键盘无障碍

键盘无障碍意味着用户在页面上可以执行的每一项操作，均可仅通过键盘完成。这是最不可妥协的无障碍要求：一旦缺失，其他任何辅助技术都将无法正常工作。

键盘接口是通用接口

屏幕阅读器、开关控制设备、语音控制、眼动追踪——网络上使用的每一种辅助技术，最终都通过键盘层进行交互。一个完全没有运动障碍的用户或许从不按 Tab 键，但同一个网站必须能够以这种方式完整操作，残障用户才能正常使用。

这正是 **2.1.1 键盘（Keyboard）**被定为 A 级成功准则的原因：未满足该准则不是让网站变得更难用，而是让整个用户群体完全无法使用。

“键盘可操作”的具体要求

• Tab 和 Shift+Tab 在可交互元素间向前和向后移动焦点。
• Enter 激活链接和大多数按钮。
• 空格键 激活按钮，并切换复选框/单选按钮。
• 方向键 在复合小部件内导航（选项卡面板、菜单、单选组、列表框、滑块）。
• Escape 关闭模态对话框、弹出层和下拉菜单。
• Page Up/Down、Home/End 在适用平台惯例的长内容中导航。

一个未实现其角色所期望键盘交互契约的小部件——例如，一个响应点击但不响应方向键的 ARIA 组合框（combobox）——在技术上可获得焦点，但功能上已经损坏。

最快的手动审计方法

从页面最顶部开始（地址栏获得焦点，然后按 Tab），一直 Tab 到页脚。Tab 顺序应与视觉顺序一致。每个可点击元素应且仅应获得一次焦点。对已获焦点的元素按 Enter 或空格键，效果应与点击相同。在模态框内按 Escape 应关闭该模态框。若有任何元素无法到达、顺序错乱，或焦点被捕获，则发现了缺陷。

五分钟有条理的 Tab 键导航发现的无障碍问题，往往多于十五分钟的 axe-core 扫描。

常见的失效模式

• 使用 <div onclick> 实现可点击卡片。 无法获得焦点，无法通过键盘激活，对屏幕阅读器完全不可见（作为可交互元素）。应使用 <button>（用于操作）或 <a href>（用于导航）。
• 自定义下拉菜单不响应 Enter/空格键。 仅使用点击事件处理；键盘用户可以聚焦触发器，但无法打开列表。
• 模态对话框未捕获焦点。 Tab 键将焦点移出模态框，进入（视觉上隐藏的）背景页面。用户无法感知自己所处的位置。
• 模态对话框过度捕获焦点。 Escape 键无法关闭。用户被困其中。
• 跳过链接目标不可聚焦。 跳过链接跳转至 #main，但 <main id="main"> 缺少 tabindex="-1"，焦点实际上未移动，下一次 Tab 又从页面顶部重新开始。

有两个库值得了解：focus-trap 用于管理模态框内的焦点，tabbable 用于查找容器内的可聚焦元素。两者均体积轻小、无倾向性。