无障碍
无障碍意味着残障人士能够感知、操作和理解你的设计作品。这包括永久性、暂时性和情境性障碍。大多数失败始于一个无人做出的设计决策：未绘制焦点样式、未定义错误状态、未添加替代文本、未设置标题层级。本技能将这些决策转化为一份检查清单。
对比度数学、APCA 和色觉缺陷相关内容位于 color → contrast-and-dark-mode.md。平台触摸目标尺寸位于 media-specs → digital-platforms.md。年长者、读写能力、阅读障碍和文化相关内容位于 cognitive-psychology → audience-and-culture.md。字体最小值位于 typography → legibility-by-medium.md。
不可协商的规则
- 以 WCAG 2.2 AA 为目标，除非合同或法律指定了其他版本。它也满足 2.1 AA 和 2.0 AA，但 4.1.1 解析规则除外（该规则在 2.2 中已移除）。所有 WCAG 要求均为 [E2]。
- 设计每一个状态。 默认、悬停、焦点、激活、选中、禁用、错误、加载和空状态，在两种颜色模式下均需设计。未绘制的状态即为可访问性缺陷。
- 焦点可见无处不在。 公司标准：2px 实线轮廓，2px 偏移，与相邻颜色对比度达到 3:1（满足 AAA 2.4.13）。切勿使用
outline: none而不提供替代方案。粘性页眉不得隐藏焦点项 (2.4.11)。 - 触摸目标 ≥ 24×24 CSS 像素 (2.5.8 AA)，或间距足够使其在效果上等同。平台最小值更大（iOS 为 44pt，Android 为 48dp），因此在触摸界面上使用这些值。
- 切勿频闪，并尊重减少运动偏好。 最多每秒闪烁 3 次。为任何超过 5 秒的动画提供暂停控制。将
prefers-reduced-motion作为公司规则（2.3.3）来遵循。 - 一切均可通过键盘操作；没有任何操作仅能通过拖拽、悬停或记忆完成。 为拖拽提供单次点击替代方案 (2.5.7)。登录时无需拼图或转录 (3.3.8)。不要要求用户重新输入数据 (3.3.7)。
- 表单： 可见标签（占位符不是标签）、字段前的说明、说明如何修复问题的文本错误信息，以及等待用户离开字段后才触发的验证。对个人数据使用
autocomplete令牌 (1.3.5)。 - 根据用途确定文本替代方案。 遵循 W3C 替代文本决策树：装饰性图片使用
alt=""，功能性图片描述操作，复杂图片提供长描述。不使用文字图片。 - 先修复通用障碍，再进行定制化调整。 简明语言、可预测的布局、容错的表单和用户控制能同时帮助认知障碍、年长者、低读写能力者、第二语言使用者和有压力的用户 [E2]。
- 自动化工具不是最终裁决。 根据 2017 年英国政府审计，单一工具仅能发现 17–41% 的障碍类型。请进行手动测试并让残障人士参与测试。
- 法律注释仅供参考，不构成法律建议。 在引用日期前请核实。部分日期已在 2026 年变更。
设计师规范清单（交接用）
- 标题层级、地标以及阅读/焦点顺序已注释（注释工具包：
motion-media-and-forms.md§7）。 - 每个交互元素：名称、角色、所有状态、焦点样式、目标尺寸。
- 每张图片：已添加替代文本或标记为装饰性。图表有文本或表格等效内容。
- 每个表单：标签、帮助文本、错误消息已编写，必填字段已标记，
autocomplete已注明。 - 文本、UI 边界、焦点和图标的对比度已在两种模式下检查 (
color)。 - 动画：已指定减少运动的变体。无闪烁。为长时间动画提供暂停控制。
- 视频：字幕，以及音频描述或文字稿。
- 布局在 320 CSS 像素宽度下能正常重排。文本能承受 200% 缩放和 1.4.12 间距覆盖 (
layout-composition)。 - 帮助和联系方式位于一致的位置 (3.2.6)。登录无需记忆测试 (3.3.8)。
- 所有文案已通过简明语言检查 (
inclusive-and-cognitive.md§5)。
法律快照（2026年10月核实，引用前请重新核实）
| 地区 | 法规 | 标准 | 生效日期 |
|---|---|---|---|
| 欧盟 | 欧洲无障碍法案 | 目前引用 EN 301 549: V3.2.1；V4.1.1 (WCAG 2.2 AA) 已于 2026 年 9 月发布，等待《官方公报》引用 | 自 2025 年 6 月 28 日起适用 |
| 美国州/地方政府 | ADA Title II 规定 (2024) | WCAG 2.1 AA | 2026 年 4 月延期：≥5 万人口地区 2027 年 4 月 26 日；较小地区及特别区 2028 年 4 月 26 日 |
| 美国企业 | ADA Title III | 判例法，通常为 WCAG 2.x AA | 诉讼驱动 |
| 美国联邦 | Section 508 | WCAG 2.0 AA（网页、文档、软件） | 自 2018 年起 |
| 英国公共部门 | PSBAR 2018 | WCAG 2.2 AA + 无障碍声明 | 已生效 |
| 加拿大联邦 | 《无障碍加拿大法案》 | CAN/ASC-EN 301 549:2024 | 目标 2040 年 |
| 巴西 | LBI 第 63 条 | ABNT NBR 17225 (2025)；eMAG 3.1（联邦） | 已生效 |
| 日本 | 《残疾人歧视消除法》 | JIS X 8341-3:2016 | 自 2024 年 4 月起私营部门须提供便利 |
WCAG 2.2 同时也是 ISO/IEC 40500:2025。WCAG 3 仍是工作草案，距离正式发布尚需多年。
按媒介分类
| 媒介 | 重点 |
|---|---|
| 原生应用 | 1.3.4 方向、1.4.4 动态字体/字体缩放、2.5.x 指针和目标、3.3.x 输入、4.1.2 名称/角色/值 |
| 网页 | 全部。1.4.10 重排、1.4.12 间距和 2.4.11 焦点不被遮挡最常被违反。 |
| PDF、幻灯片 | 标签、标题、阅读顺序、对比度、页面标题、语言 |
| 社交媒体帖子 | 替代文本字段、视频字幕、无纯颜色传达信息、字幕中重复文字、无频闪 |
| 印刷品、户外广告 | WCAG 不直接适用，但其对比度和颜色逻辑是良好实践。距离规则在 media-specs 中。 |
参考文件 — 何时打开
| 文件 | 打开时机 |
|---|---|
references/wcag-22-in-practice.md | 检查任何成功标准时；编写规范时；需要 2.2 新增内容的详细信息时；值得采用的 AAA 标准时；按媒介的适用性分析时。 |
references/inclusive-and-cognitive.md | 包容性设计方法、人物谱系、可引用的普遍性数据、情境性障碍、认知可访问性 (COGA)、简明语言、神经多样性用户、本地化/从右到左基础知识、包容性审查检查清单。 |
references/motion-media-and-forms.md | 运动与闪烁、减少运动代码、字幕/音频描述/文字稿、替代文本与复杂图片、焦点与键盘规范、跳过链接、表单与错误、autocomplete、触摸/指针、屏幕阅读器注释与工具包。 |
references/legal-and-testing.md | 按司法管辖区的法律问题、应遵循的设计标准、工具覆盖范围、WebAIM Million 2026、手动测试检查清单、与残障用户测试、Figma 交接检查清单、无障碍声明、VPAT/ACR。 |