11、网页开发：无障碍、可持续与安全的综合实践

网页开发：无障碍、可持续与安全的综合实践

1. 网页无障碍开发规则

1.1 ARIA 角色使用规则

在使用 ARIA 角色时，不能改变语义元素的含义。例如，不要这样做：

// DONT
<h2 role="tab">Heading tab</h2>

而应该这样：

// DO
<div role="tab"><h2>Heading tab</h2></div>

1.2 键盘导航支持规则

始终支持键盘导航。比如，错误的做法是：

// DONT
<span role="button" tabindex="1">Submit</span>

正确的做法是：

// DO
<span role="button" tabindex="0">Submit</span>

1.3 可聚焦元素隐藏规则

不要隐藏可聚焦元素。错误示例：

// DONT
<div aria-hidden="true"><but