主要观点:
- 介绍了与
aria-label
相关的内容,包括其在不同 HTML 元素中的使用规则和注意事项。 - 强调了 prefer native HTML labeling mechanisms over ARIA labeling mechanisms 的原则。
- 列举了各种 HTML 元素在使用
aria-label
时的情况,包括是否允许、是否会被屏幕阅读器读取等。
关键信息:
aria-label
是标注原生 HTML UI 元素的辅助方法之一,在交互元素和部分块级元素上效果较好,在文本级语义上效果不佳或不适用。- 有隐式角色(由浏览器自动应用)和显式角色(由开发者使用
role
属性应用)。 - 提供了关于
aria-label
使用的一般规则,如优先使用可见标签、放置在预期位置等。 - 详细列出了不同 HTML 元素在使用
aria-label
时的具体情况,包括是否允许、是否会被屏蔽等。
重要细节:
- 空的
aria-label=""
不等于空的alt=""
,alt
用于img
元素,aria-label
有其特定用途。 aria-label
会屏蔽除aria-labelledby
之外的其他可访问名称源,aria-labelledby
会屏蔽包括aria-label
在内的所有其他名称源。- 对于一些元素,如
a
元素无href
时、img
元素无alt
时等,aria-label
的使用有特定限制和注意事项。 - 不同浏览器和屏幕阅读器对
aria-label
的支持情况有所差异。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。