仅为屏幕阅读器隐藏文本答案

【问题标题】：Hide text ONLY for screen readers仅为屏幕阅读器隐藏文本
【发布时间】：2016-01-23 12:24:17
【问题描述】：

我根本无法得到这个问题的答案。 WCAG 说它可以通过aria-hidden 标签来完成，但我读过它不适用于许多屏幕阅读器。

无法理解 display:none 如何帮助隐藏某些文本仅供屏幕阅读器使用（=对 SR 以外的其他设备可见）。这也不清楚如果屏幕阅读器不支持 css，它将如何为display:none 工作。

是否有任何技术或最佳做法或任何我可以用来隐藏某些文本仅供屏幕阅读器使用？

【问题讨论】：

为什么它应该是“看不见的”？ ...具有空 alt 属性的 img 标记会执行此操作。
为什么？你不能想想这样的情况吗？试想一下，使用 SR 的用户使用该设备，以便语音引擎可以读取文本。尝试阅读一些符号、http 地址等...明白了吗？
我的问题更像是，你怎么会在这种情况下跑步？ speak:none; 或 voice-volume:silent; 没有效果吗？ w3.org/TR/css3-speech
OP also asked this on Webmasters.

【解决方案1】：

抱歉，最佳做法是使用aria-hidden 属性。屏幕阅读器忽略 ARIA 属性的用户应该更换他们的软件。

【讨论】：

【解决方案2】：

aria-hidden 应该用于向屏幕阅读器隐藏页面上任何不可聚焦的内容。当前所有主要的屏幕阅读器版本都支持这一点。

相对于satisfy WCAG 2 AA，一项功能只需要在通用或至少一种广泛分布的免费辅助技术上得到支持。 Windows 上的 NVDA 和 Firefox、OS X 和 iOS 上的 VoiceOver 以及 Android 上使用 Firefox 的 Talkback 都支持此功能。

【讨论】：

【解决方案3】：

您也可以使用role="presentation"，根据标签、浏览器和屏幕阅读器的不同，它可能是一个更好的选择（或更糟）。看看这个很好的教程，

【讨论】：