可访问性(Accessibility) => 无障碍功能

时间:2022-10-10 06:07:39

了解无障碍功能及其范围和影响可令您成为更出色的网络开发者 复杂的一笔 https://developers.google.cn/web/fundamentals/accessibility/

ARIA 简介 https://developers.google.cn/web/fundamentals/accessibility/semantics-aria/

(WAI-ARIA,简称 ARIA)适用于跨越某些领域的障碍

使用 ARIA 属性,我们就可以为元素提供缺少的信息,以便屏幕阅读器能正确解读它。 我们在以上代码中添加了 role 和 aria-checked 属性,将该元素显式标识为一个复选框,并指定它在默认情况下处于选中状态。该列表项现在将添加到无障碍树中,屏幕阅读器将把它正确地报告为一个复选框。

<li tabindex="0" class="checkbox" role="checkbox" checked aria-checked="true">
Receive promotional offers
</li> <div class="button" role="button">click me</div>

ARIA 通过更改和补充标准 DOM 无障碍树来发挥作用

ARIA 可以做什么? https://developers.google.cn/web/fundamentals/accessibility/semantics-aria/#aria

ARIA 可以修改现有元素语义,也可以向不存在原生语义的元素添加语义。

ARIA 标签和关系 https://developers.google.cn/web/fundamentals/accessibility/semantics-aria/aria-labels-and-relationships