【问题标题】:Prevent screen reader from reading aria-label防止屏幕阅读器阅读 aria-label
【发布时间】:2017-11-10 13:24:51
【问题描述】:

我有一个具有里程碑角色(互补)的元素,它需要一个 aria-label/aria-labelledBy。 此元素有几个可聚焦的子元素,其中包含需要屏幕阅读器阅读的文本。

有没有办法阻止屏幕阅读器读取父元素的 aria-label,同时又不阻止子元素被读取?

编辑

对于此代码:

<div id="parent-element" role="complementary" aria-label="some text" tabindex="0">
    <div id="child-element1" tabindex="0">I'm the first child</div>
    <div id="child-element2" tabindex="0">I'm the second child</div>
</div>

当聚焦到父元素时,屏幕阅读器会读到“我是第一个孩子,我是第二个孩子”。

我正在使用 IBM 的 Chrome 版“动态评估插件”来评估我的网站。

这是我得到的违规行为:comlementary role must have aria label

关于违规的更多解释 - https://aat.mybluemix.net/token/ace67f8e-8cad-40b4-be4b-eb02197944bc/6c6a166a-542d-4e1a-8a10-40a4c69e1d1d/doc/w3/help/en-US/idhi_accessibility_check_g1174.html

我不希望它读取“一些文本”,但如果我希望网站通过可访问性评估工具,我必须使用 aria-label。

【问题讨论】:

  • 不包括它?如果没有看到代码或对您要实现的目标进行解释,这没有任何意义。什么是元素(无论角色如何)以及需要什么属性?

标签: accessibility roles wai-aria screen-readers jaws-screen-reader


【解决方案1】:

具有complementary 角色的元素不需要aria-label/aria-labelledby

只要您保留此属性,您的屏幕阅读器就会忽略内容并读取该属性。

编辑:没有官方规范表明有aria-label 的义务,但是根据 W3C,当您有多个互补地标时 you should have a unique label。请注意,“应该”非常重要,因为这不是“必须”(实际上在实践中毫无用处)

ARIA 示例:多个互补的地标 当页面上有多个互补的地标时,每个地标都应该有一个唯一的标签。

工具只是工具,评估工具非常不完善。

【讨论】:

  • 我添加了有关该问题的更多信息,希望您知道如何处理它。
  • @Chen 我答完了
猜你喜欢
  • 2018-07-13
  • 2022-08-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-10-04
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多