将tabindex添加到所有DIV

时间:2015-06-22 13:42:17

标签: html accessibility jaws-screen-reader accessible

我知道DIV和P元素本身并不是可聚焦的,可以通过添加tabindex属性使其成为一个。我正在尝试制作一个屏幕阅读器友好的网站,并想知道是否有必要在我的网站上的每个DIV和P上都有tabindex,以便JAWS,NVDA和Chrome Vox等屏幕阅读软件可以阅读其内容。

现在正在使用Chrome Vox,它不会读取段落内容,除非我有一个" tabindex = 0"作为一个属性。我测试不正确吗?使用屏幕阅读软件的人是否使用其他方式阅读页面内容然后点击标签将焦点从元素转移到元素?

2 个答案:

答案 0 :(得分:4)

只有您希望人们与进行互动的控件(例如,点击或输入)应该是可调焦的。

你不应该让它们专注于让它们被阅读(并且我没有测试过的屏幕阅读器(它不包括Vox)需要它。)

让它们具有可聚焦性会使人们更难以使用该网站,因为他们必须通过更多元素来标记他们想要与之交互的元素。

从Chrome Vox文档:

  

要浏览屏幕上的文字,您可以使用ChromeVox修改键。在ChromeBook上,ChromeVox键是Shift和Search,在Mac OS X上ChromeVox键是Control和Command,在其他平台上,如Windows,ChromeVox键是Control和Alt。要浏览页面,请按向上和向下箭头键旁边的ChromeVox键浏览页面。

答案 1 :(得分:0)

你只需要在作为锚链接目标的div标签上加上tabindex =“ - 1”

<a href="#targetanchor">Go to anchor</a>
[...]
<div id="targetanchor" tabindex="-1">

使用Chromevox,您可以在列表中找到导航应该了解的页面的快捷方式,请参阅此处:http://www.chromevox.com/en/keyboard_shortcuts.html(例如,ChromeVox +向下向后导航)