我想使用屏幕阅读器来实现可访问性,以便阅读列表中的文本。我在网络上找到了一些示例,当<li>
的项目用{{1 }}。
我尝试了类似以下操作,但是它不起作用:
<a>
希望您能帮助我。
答案 0 :(得分:1)
#1 rule for using ARIA(aria-*
属性和role
属性)在没有必要的情况下不使用。您的代码示例虽然有效,但咏叹调过多,所有这些都是多余的。
默认情况下,<ul>
有一个role = list,spec专门说不设置角色。
与<li>
元素相同。
根据“ Accessible Name and Description Computation”的步骤2F,标题的可访问名称(<h3>
将来自标题的文本内容,因此,不需要aria-label
。
因此,您的代码示例与该代码段完全相同:
<h3>
通常,列表不能在键盘上显示焦点,因此您不会使用 TAB 键导航到这些列表。我认为这就是为什么您提到将列表项包装在锚标签<ul>
<li>
<div>
<h3>item 1</h3>
</div>
</li>
<li>
<div>
<h3>item 2</h3>
</div>
</li>
<li>
<div>
<h3>item 3</h3>
</div>
</li>
<li>
<div>
<h3>item 4</h3>
</div>
</li>
</ul>
中,以允许您 TAB 到链接的原因。
屏幕阅读器用户导航到列表的方式是使用快捷键。 JAWS和NVDA都使用 L 键导航到列表,并使用 I (“ eye”)键导航到列表项。屏幕阅读器用户还可以使用向上/向下箭头键浏览DOM。 iOS设备上的VoiceOver用户可以将其转子设置为“列表”,然后可以向上/向下滑动到下一个列表。
因此,如果您尝试使用键盘强制列表变得可聚焦,那么屏幕阅读器用户将受到损害,因为他们不习惯以这种方式导航到列表。非交互式元素(例如<a>
或<ul>
或<p>
)不能放在键盘上。