已对辅助技术隐藏屏幕外内容

确保仅向屏幕阅读器和其他辅助技术提供页面的相关部分。例如,应在屏幕之外或仅供演示之用的内容对辅助技术隐藏。

如何手动测试

如需检查屏幕外内容是否处于隐藏状态,您需要使用屏幕阅读器手动测试该内容。- 对于 Mac 用户,请观看这个有关使用 VoiceOver 的视频。 - PC 用户可观看这个关于如何使用 NVDA 的视频。 - 对于 Chromebook 用户,请参阅内置屏幕阅读器 ChromeVox

使用 TAB 键在网页间切换。 屏幕阅读器不应读出隐藏的内容。

修正方法

如需隐藏屏幕外的内容,只需将其设为 display: nonevisibility: hidden,即可从 Tab 键顺序中移除包含相应内容的元素。

例如:

.remove-me {
  visibility: hidden;
}
<button class="remove-me">Can't reach me with the TAB key!</button>

另请参阅正确设置屏幕外内容的公开范围

资源

屏幕外内容已对辅助技术隐藏审核的源代码