aria-hidden="true"有什么用
指示辅助技术忽略特定的HTML元素
aria-hidden="true"的主要作用是指示辅助技术忽略特定的HTML元素,使其在屏幕阅读器等辅助设备中不可见,从而减少冗余信息的输出,提高网页的可访问性。 当一个元素被设置为aria-hidden="true"时,辅助技术将不会读取该元素及其内容,这对于纯装饰性的图像或其他不需要被屏幕阅读器读取的元素非常有用。12
在不同场景中,aria-hidden="true"的应用包括:
- 图标和装饰元素:当图标仅用于装饰目的时,设置aria-hidden="true"可以避免屏幕阅读器读取不必要的图标信息,保持页面内容的简洁性。23
- 页面弹窗元素:在页面弹窗(modal)上使用aria-hidden="true"可以避免屏幕阅读器读取非必要的弹窗内容,提高用户体验。45
- 表达含义的图标:如果图标用于表达特定含义,而不是仅作为装饰,应确保其含义可通过辅助设备识别。在这种情况下,可以结合使用aria-label属性来提供额外的信息。23
此外,aria-hidden属性是HTML5中的一个全局属性,用于指示辅助技术忽略特定的HTML元素。通过将其设置为"true",可以减少辅助技术用户浏览页面时遇到的冗余信息,从而提高网页的可访问性。