无障碍为何重要：WCAG 等级

网页可访问性意味着确保残障人士能够感知、理解、导航和使用网页：

• 视觉障碍 — 失明、视力低下、色盲
• 运动障碍 — 无法使用鼠标
• 听觉障碍 — 耳聋
• 认知障碍 — 阅读障碍、ADHD、记忆方面的困难

可访问性之所以重要，有多个原因：

• 人权 — 每个人都应当能够访问网页
• 法律要求 — ADA、第 508 条、欧盟可访问性法案
• 商业价值 — 全球有 15% 的人口患有残障（约 10 亿人）
• 搜索引擎优化 — 具有可访问性的网站通常排名更高
• 为所有人提供更好的用户体验 — 路缘坡道效应：字幕在嘈杂环境中也很有帮助

WCAG（网页内容可访问性指南）是由 W3C 发布的网页可访问性国际标准：

• 当前版本：WCAG 2.1（广泛采用）、WCAG 2.2（2023 年）
• WCAG 3.0 正在开发中
• 按照四项原则组织：POUR

WCAG 建立在四项核心原则之上。内容必须：

• Perceivable — 可感知：用户必须能够感知信息
• Operable — 可操作：用户必须能够操作界面
• Understandable — 可理解：内容必须易于理解
• Robust — 稳健：内容必须能够与当前和未来的辅助技术配合使用

WCAG 有三个一致性等级：

• Level A — 最低等级；必须满足。否则会排除主要用户群体。
• Level AA — 大多数网站的推荐等级；大多数法律都要求达到此等级
• Level AAA — 理想等级，但不是强制要求；标准非常高

Level A 的基本要求：

• 所有图像都有替代文本
• 所有音频都有文字稿或字幕
• 没有内容每秒闪烁超过 3 次（存在诱发癫痫发作的风险）
• 用户可以暂停、停止或隐藏移动内容
• 所有功能都可以使用键盘操作

Level AA 要求（标准目标）：

• 文本对比度至少为 4.5:1
• 界面焦点指示器清晰可见
• 将文本调整为 200% 不会破坏布局
• 表单具有适当的标签
• 错误消息会指出并描述错误
• 各页面之间的导航保持一致

Level AAA 要求（理想目标）：

• 文本对比度至少为 7:1
• 为音频提供手语翻译
• 阅读水平不高于九年级
• 最大限度降低认知负担
• 可以关闭会话超时

世界各地的网页可访问性法律：

• 美国 — ADA（《美国残疾人法》）、第 508 条（联邦要求）
• 欧盟 — 欧洲可访问性法案（EAA），于 2025 年生效
• 英国 — 《2010 年平等法》、公共部门法规
• 加拿大 — AODA、ACA
• 澳大利亚 — DDA（《残疾歧视法》）

具有可访问性的网站会让所有人受益：

• 字幕在嘈杂环境中很有帮助
• 良好的颜色对比度在阳光明亮时很有帮助
• 键盘导航有助于高级用户
• 清晰的语言有助于非母语使用者
• 15% 的用户患有残障，这是一个规模可观的市场

开始构建具有可访问性的网站的方法：

1. 正确使用语义化 HTML 元素
2. 使用键盘进行测试：不使用鼠标可以操作网站吗？
3. 使用 WebAIM 对比度检查器检查对比度
4. 为所有有意义的图像添加替代文本
5. 运行 Lighthouse 可访问性审计
6. 使用免费的屏幕阅读器进行测试（NVDA 或 VoiceOver）

WCAG 要点：

• POUR：可感知、可操作、可理解、稳健
• Level A — 最低等级；必须通过
• Level AA — 推荐等级；大多数法律都要求达到此等级
• Level AAA — 理想等级；整个网站不必达到此等级
• 从语义化 HTML、键盘导航和替代文本开始