ARIA:文档结构角色
ARIA 文档结构角色用于提供内容部分的结构描述。
结构化 ARIA 角色最初是为了桥接,告知辅助技术尚未在浏览器中完全支持的 HTML5 元素。一些角色,如 presentation、toolbar 和 tooltip,在不存在等效的原生 HTML 元素的情况下,会向辅助技术提供有关文档结构的信息。其他角色,包括下表中列出的角色,则不需要,因为存在具有相同含义的语义化 HTML 元素。在很多情况下,这些等效的 HTML 元素一直都受到支持。
注意:这些结构角色都有语义化 HTML 等效项。它们在这里是为了文档完整性而包含。Web 作者最好不要使用它们。
一些结构角色,如 suggestion,没有 HTML 等效项,因此有单独的文档。一些具有 HTML 等效项的结构角色,如 heading,具有 ARIA 属性要求。它们列在下面,并链接到各自的角色文档。
以下大多数角色从不需要,但为了完整性而添加到了 ARIA。我们也在这里为了完整性而包含了它们。
具有 HTML 等效项的结构角色
具有 HTML 等效项的结构角色列在下面
| ARIA 角色和描述 | HTML 等效项 |
|---|---|
associationlist仅包含 associationlistitemkey 子元素及其同级 associationlistitemvalue。 |
<dl> |
associationlistitemkey必须包含在 associationlist 中。 |
<dt> |
associationlistitemvalue始终是紧随 associationlistitemkey 的同级元素。 |
<dd> |
blockquote引用自其他来源的内容部分。 |
<blockquote> |
caption可见的内容,命名并可能描述 figure、table、grid 或 treegrid。仅存在于这 4 个角色中。标题的 id 通常由 figure、grid、table 或 treegrid 的 aria-labelledby 属性引用。禁止的属性: aria-label 和 aria-labelledby。 |
<caption><figcaption> |
code代表计算机代码片段的部分。 禁止的属性: aria-label 和 aria-labelledby。 |
<code> |
deletion被标记为已删除或建议删除的内容。 禁止的属性: aria-label 和 aria-labelledby。 |
<del> |
emphasis用于强调或突出内容,但不建议使用它来表明重要性。 禁止的属性: aria-label 和 aria-labelledby。 |
<em> |
figure图形文档、图像、代码片段或示例文本的容器。 |
<figure> |
heading页面部分的标题。 需要使用 aria-level 属性来指示嵌套级别。有关详细信息,请参阅 heading 角色。 |
h1、h2、h3、h4、h5 和 h6 |
image包含构成图像的元素集合的容器。是 img 角色的同义词。 |
<img> |
img包含构成图像的元素集合的容器。 需要可访问名称。 有关详细信息,请参阅 img 角色。 |
<img> |
insertion被标记为已添加或建议添加的内容。 禁止的属性: aria-label 和 aria-labelledby。 |
<ins> |
list包含 listitem 元素的部分。有关详细信息,请参阅 list 角色 |
<ol><ul> |
listitemlist 或 directory 中的单个项目。必须包含在 list 中(如 <li>)。有关详细信息,请参阅 listitem 角色。 |
<li> |
mark为了引用或注释的目的而标记或突出显示的内容。 有关详细信息,请参阅 mark 角色。 |
<mark> |
meter已知范围内的标量测量值或分数值。 需要可访问名称。需要使用 aria-valuenow。有关详细信息,请参阅 meter 角色。 |
<meter> |
paragraph一段内容。 禁止的属性: aria-label 和 aria-labelledby。 |
<p> |
强重要、严肃或紧急内容。 禁止的属性: aria-label 和 aria-labelledby。 |
<strong> |
下标一个或多个下标字符。 仅当缺少角色会改变内容含义时才使用。 禁止的属性: aria-label 和 aria-labelledby。 |
<sub> |
上标一个或多个上标字符。 仅当缺少角色会改变内容含义时才使用。 禁止的属性: aria-label 和 aria-labelledby。 |
<sup> |
术语带有可选对应定义的词语或短语。 禁止的属性: aria-label 和 aria-labelledby。有关更多信息,请参阅 term 角色。 |
<dfn> |
时间一个有效的日期或时间字符串格式,列出某个特定的时间点。 禁止的属性: aria-label 和 aria-labelledby。 |
<time> |
注意:aria-label 和 aria-labelledby 属性在 code、caption、deletion、emphasis、generic、insertion、mark、paragraph、presentation、none、strong、subscript、superscript、suggestion、term 和 time 上是被禁止的,并且应该只用于交互式内容。
最佳实践
不要使用结构化角色。选择 HTML 语义元素代替。
规范
| 规范 |
|---|
| 可访问的富互联网应用 (WAI-ARIA) # document_structure_roles |