一个其隐式原生角色语义不会映射到 辅助功能 API 的 元素。请参阅同义词 none。
注
在 ARIA 1.1 中,由于作者对“presentation”或“presentational”一词的预期含义存在困惑,工作组引入了 none 作为 presentation 角色的同义词。许多人错误地认为 role="presentation" 与 aria-hidden="true" 同义,我们相信 role="none" 能够更明确地传达其实际含义。
在实现充分支持 role="none" 之前,建议 Web 作者单独使用 presentation 角色 role="presentation",或者作为 none 角色的回退冗余使用 role="none presentation"。
其预期用途是当元素用于更改页面外观,但并不具备元素类型所暗示的所有功能、交互或结构相关性时;或者用于为不支持 WAI-ARIA 的旧浏览器提供可访问的回退。
用例示例:
对于任何具有 presentation(展示)角色且不可聚焦的元素,用户代理 不得 向辅助功能 API 暴露该元素的隐式原生语义(角色及其状态和属性)。然而,用户代理 必须 暴露那些没有显式或继承自 presentation 角色的内容及后代元素。因此,presentation 角色会导致给定的元素被视为没有角色或从辅助功能树中移除,但并不会导致该元素内包含的内容从辅助功能树中移除。
例如,根据可访问性 API,以下标记元素似乎具有相同的角色语义(无角色)和相同的内容。
<h1 role="presentation"> Sample Content </h1>
<span> Sample Content </span>
<span role="presentation"> Sample Content </span>
Sample Content
presentation 角色用于具有隐式原生语义的元素,这意味着该元素拥有默认的辅助功能 API 角色。某些元素只有在提供额外的后代元素时才是完整的。例如,在 HTML 中,table 元素(对应 table 角色)需要 tr 后代(即 row 角色),而后者又需要 th 或 td 子元素(即 cell、columnheader、rowheader 角色)。同样,列表需要列表项子元素。在 WAI-ARIA 中,将补全元素语义的后代元素描述为 必需的从属元素。
当一个显式或继承的 presentation 角色应用于一个具有 WAI-ARIA 隐式语义角色且该角色拥有 必需的从属元素 时,除该具有显式 presentation 角色的元素外,用户代理 必须 将继承的 presentation 角色应用于任何未定义显式角色的从属元素。此外,当显式或继承的 presentation 角色应用于宿主语言规范定义了必需子元素的宿主语言元素时,除该具有显式 presentation 角色的元素外,用户代理 必须 将继承的 presentation 角色应用于任何未定义显式角色的必需子元素。
在 HTML 中,无论图像文件的类型如何,<img> 元素 都被视为一个单一实体。因此,在 HTML img 上使用 role="presentation" 或 role="none" 等同于使用 aria-hidden="true"。为了使图像内容可访问,作者可以使用 <object> 或 <iframe> 元素 嵌入对象,或者使用内联 SVG 代码,并遵循图像内容的可访问性指南。
对于任何具有显式或继承的 presentation 角色且不可聚焦的元素,用户代理 必须 忽略该元素特定于角色的 WAI-ARIA 状态和属性。例如,在 HTML 中,带有 presentation 角色的 ul 或 ol 元素,其 li 元素的隐式原生语义将被移除,因为 ul 或 ol 所对应的 list 角色具有 必需的从属元素 listitem。同样,HTML table 元素的 thead/tbody/tfoot/tr/th/td 后代的隐式原生语义也将被移除,因为 HTML 规范指出这些是 table 元素的必需结构性后代。
注
仅移除对应于 WAI-ARIA 必需的从属元素 的元素的隐式原生语义。所有其他内容保持不变,包括嵌套表格或列表,除非这些元素也被应用了显式的 presentation 角色。
例如,根据可访问性 API,以下标记元素似乎具有相同的角色语义(无角色)和相同的内容。
<ul role="presentation">
<li> Sample Content </li>
<li> More Sample Content </li>
</ul>
<foo>
<foo> Sample Content </foo>
<foo> More Sample Content </foo>
</foo>
注
还有其他具有必需子元素的 WAI-ARIA 角色也适用此情况(例如,radiogroups 和 listboxes),但表格和列表是 presentation 继承最常应用的实际案例。
对于任何具有显式或继承的 presentation 角色的元素,用户代理 必须 将继承的 presentation 角色应用于该展示型元素的所有宿主语言特定的标注元素。例如,带有 presentation 角色的 table 元素,其 caption 元素的隐式原生语义将被移除,因为标题仅仅是该展示型表格的标签。
当 presentation 角色应用于图像时,作者 不应 提供有意义的替代文本(例如,在 HTML 中使用 alt="")。
在以下代码示例中,包含的 img 由 caption 段落适当地标注。在此示例中,img 元素可以被标记为 presentation,因为其角色和文本替代是由包含它的元素提供的。
<div role="img" aria-labelledby="caption">
<img src="example.png" role="presentation" alt="">
<p id="caption">A visible text caption labeling the image.</p>
</div>
在以下代码示例中,因为锚点(HTML a 元素)充当树项,所以列表项(HTML li 元素)被分配了一个显式的 WAI-ARIA presentation 角色,以覆盖用户代理对列表项的隐式原生语义。
<ul role="tree">
<li role="presentation">
<a role="treeitem" aria-expanded="true">An expanded tree node</a>
</li>
…
</ul>
展示性角色冲突有多种解决方法。
用户代理 不得 在辅助功能树中暴露具有显式或继承的展示性角色的 元素,以下情况除外:
- 如果元素是可聚焦的或以其他方式具有交互性,用户代理 必须 忽略
presentation 角色,并暴露该元素的隐式角色,以确保元素是 可操作的。
- 如果一个 必需的从属元素 具有显式的非展示性角色,用户代理 必须 忽略继承的展示性角色,并以其显式角色暴露该元素。如果暴露显式角色的操作导致辅助功能树格式错误,其预期结果未定义。
- 如果元素具有全局 WAI-ARIA 状态或属性,用户代理 必须 忽略
presentation 角色,并以其隐式角色暴露该元素。然而,如果元素仅具有非全局、特定于角色的 WAI-ARIA 状态或属性,则 不得 暴露该元素,除非该展示性角色是继承的且应用了显式的非展示性角色。
例如,aria-describedby 是一个全局属性,将始终被应用;aria-level 不是全局属性,因此仅当元素不处于展示状态时才会被应用。
<h1 role="presentation" aria-describedby="comment-1"> Sample Content </h1>
<h1 role="presentation" aria-level="2"> Sample Content </h1>