将 tabindex 添加到所有 DIV

Adding tabindex to all the DIVs

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

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

只有您希望人们与之交互(例如单击或键入)的控件才应该是可聚焦的。

您不需要让它们可聚焦只是为了让它们被阅读(而且我测试过的屏幕 reader(不包括 Vox)都不需要它)。

将它们设为可聚焦会使人们更难使用该网站,因为他们必须通过 Tab 键浏览更多元素才能获得他们想要与之交互的元素。


来自 Chrome Vox 文档:

To navigate through the text on a screen, you can use the ChromeVox modifier keys. On a ChromeBook, the ChromeVox keys are Shift and Search, on Mac OS X the ChromeVox keys are Control and Command and on other platforms, such as Windows, the ChromeVox keys are Control and Alt. To move through a page, press the ChromeVox keys alongside the Up and Down arrow keys to navigate through the page.

您只需在作为锚点目标的 div 标签上放置 tabindex="-1" link

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

使用 Chromevox,您有一个浏览页面的快捷方式列表,您应该注意,请参阅此处:http://www.chromevox.com/en/keyboard_shortcuts.html(例如,ChromeVox + 向下键可向后导航)