无障碍描述

**可访问描述**是指对用户界面元素的描述，该描述提供更多信息来帮助使用辅助技术的用户理解 UI 元素及其上下文。它与 HTML 或 SVG 元素相关联，并为用户提供有关其目的的更多上下文，而不仅仅是元素的可访问名称。这对于依赖屏幕阅读器等辅助技术的用户尤其重要。元素的可访问描述是可访问性树的一部分。

例如，<table> 的可访问名称由其第一个<caption> 提供。对于复杂的数据表，可以用一两句话来描述表格。这可以是表格之前或之后的段落，在视觉上和源代码顺序上都是如此。如果在源代码顺序的其他地方，或者为了使关联明确，可以使用aria-describedby 属性将表格与其描述相关联。

类似地，当要求用户创建密码时，<label> 用于类型为 password 的<input>，提供其可访问名称。一个好的可访问描述包括对密码的要求，以一种对所有用户可见的方式。它可以通过 aria-describedby 属性显式地与输入相关联，这将它添加到可访问性树中，作为该节点的“描述”。

描述被简化为文本字符串。在我们的密码示例中，如果输入的 aria-describedby 属性值为 HTML<ul> 的 id，其中包含要求列表，则描述将连接文本和所有列表项的文本等效项。

您可以检查页面上任何元素的可访问描述：查看浏览器开发者工具的可访问性选项卡，它提供了当前选中元素的可访问性信息。

无障碍描述计算

对于 HTML 元素，如果元素没有可访问描述，则需要以编程方式将描述与相关元素相关联。可访问性对象模型 (AOM) 通过按顺序检查这些功能来计算可访问描述，直到它被定义。

  1. aria-describedby 属性。
  2. aria-description 属性。
  3. 如果该功能尚未用于定义可访问名称，则参与描述计算的特定语言功能。例如
    • 嵌套在<details> 中的<summary> 由其内容描述。
    • 类型属性为 button、submit 或 reset 的<input> 按钮由其 value 属性的值描述。
    • 在 SVG 中，如果存在，则<desc> 元素的内容，否则，是包含在后代文本容器元素（即 <text>）中的文本，如果它们未被用作可访问名称。
  4. 如果以上内容均未提供描述，则使用title 属性，如果 title 不是该元素的可访问名称。
  5. 如果以上内容均未定义可访问描述，则可访问描述为空。

在 HTML 中定义可访问描述的步骤在HTML-AAM 可访问描述 中定义)。SVG 元素的可访问描述遵循相同的步骤，只是在SVG-AAM 可访问描述 中列出了细微差别。

另请参阅