我的 HTML 页面包含以下行:
<abbr title="World Wide Web Consortium">W3C</abbr>
使用 NVDA 屏幕阅读器(2016.1 版)阅读页面时,它只会显示“W3C”,但不会显示标题。
我试图在 NVDA 中找到一个设置来激活标题属性的读取,但没有任何运气。Google 上也没有关于此限制的任何内容(NVDA 的最新版本应该阅读标题)。
我没有尝试过使用任何其他屏幕阅读器,例如 JAWS 或 Voice Over。
盲人像其他人一样理解缩写。所以他们不想每次说这些缩写时都听到 FBI、NASA、W3C 的定义。(虽然这可以在某些屏幕阅读器中配置)
如果您认为应该解释一个缩写词,那么每个人都会担心,并且提供带有abbr
标签的定义是一个坏主意,因为它需要标准用户用鼠标悬停该术语。
事实上,标签的唯一abbr
用途是在语义上标记一个缩写词,以便例如拼写出来。如果您想解释缩写词,请使用完整定义。
不好的例子:
<abbr title="Doctor">Dr</abbr> Martin lives in Lincoln <abbr title="Drive">Dr</abbr>
He works for the <abbr title="Worldwide Web Consortium">W3C</abbr>
好的例子:
Doctor Martin lives in Lincoln Drive
He works for the World Wide Web Consortium (known as the <abbr>W3C</abbr>)
我发现这篇文章澄清了很多: 标题属性和可访问性
基本上,使用标题属性对屏幕阅读器没有用处。相反,我们应该始终为屏幕阅读器使用隐藏文本(除了在其他情况下仍然有用的 title 属性)。
例如,如果您将 Bootstrap 与问题示例一起使用:
<abbr title="World Wide Web Consortium">
W3C
<span class="sr-only">World Wide Web Consortium</span>
</abbr>