屏幕阅读器读取锚标签或角色="对话框"中的所有内容

Question

很久以前,屏幕阅读器决定开始阅读锚标签<a>中的所有内容作为功能.这允许链接变短,其中上下文在视觉上明显但对于屏幕阅读器来说是模糊的.
然后开发人员可以编写类似于此行的内容,以使屏幕阅读器读取所有内容:

<a href="#">More<span style="display: none;"> information about XYZ</span></a>

但是,使用HTML5,锚标记变得"透明",并允许在其中包含更广泛的元素.http://dev.w3.org/html5/markup/a.html#a
这个新的链接功能很棒,因为我们可以用正确的语义封装整个可点击的对象.
不幸的是,阅读隐藏在链接中的所有内容的功能现在正在咬我们:

<li><a href="#"> [ complicated markup ] </a></li>

在上面的标记中,使用任何隐藏的内容将被读取给屏幕阅读器.
将属性添加role="dialog"到<div> 时会发生同样的问题

阻止屏幕阅读器阅读现在真正隐藏的内容的诀窍是什么？

我正在使用IE10和Windows 8讲述人

Answer 1

您可以使用aria-hidden，但要小心。

仅当隐藏此内容的行为旨在通过删除冗余或无关内容来改善辅助技术用户的体验时，作者才可以谨慎使用 aria-hidden 来隐藏辅助技术中可见呈现的内容。使用 aria-hidden 向屏幕阅读器隐藏可见内容的作者必须确保向辅助技术公开相同或等效的含义和功能。