html - 如何隐藏屏幕阅读器的链接?

标签 html accessibility screen-readers

我有一个链接,我想向有视觉的访问者显示,但对使用屏幕阅读器 AT 的访问者隐藏。 (这当然不理想)。

这与向视觉访问者隐藏内容(例如“跳到内容”链接)的常见问题(已知解决方案)相反

一个例子:

a box with lede text, and a link to "read more"

单击“阅读更多”链接可展开内联文本。

the same box, this time with all the text

相反,单击“少读”链接会再次折叠它。

这种折叠/展开文本功能只对有视力的访问者有益,他们的视野会在他们到达之前看到额外的文本(并且在这个例子中取代下一个常见问题解答,将其推到屏幕之外)。

应该向拥有屏幕阅读器的访问者展示全文,因为他们可以选择跳到下一个 block ,并且他们不应该遇到 (a) 没有的虚假“阅读更多”链接链接到一个页面,并且 (b) 简单地向他们提供他们将要从屏幕阅读器中听到的内容。

这将如何在 HTML5 中完成?

最佳答案

以这种方式对内容使用aria-hidden:

<p aria-hidden="true">Screen readers will not read this!</p>

关于html - 如何隐藏屏幕阅读器的链接?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27087627/

相关文章:

javascript - 使用 jQuery 验证多输入值长度

css - 如何将一个类的边界扩展到其他类

html - 部分或图形中的图片库标题?

google-chrome - Mac VoiceOver 是否会限制其在 Chrome/Firefox 上的功能?

html - 如何为所有其他 html 页面显示 HTML 相同的页面标题

html - 定义 nth-of-type

java - Android:以编程方式更改可访问性顺序

swift - 通过 macOS 辅助功能 API 在 Webkit 应用程序中选择文本

css - 我们什么时候应该使用 <dl> 而不是 <ul>?

html - 删除两个文本元素之间的空格是否存在可访问性问题? (例如跨度,a)