以 skill 自身的术语
在 macOS、Windows、iOS 和 Android 平台上,使用 VoiceOver、NVDA、JAWS、TalkBack 和 Narrator 屏幕阅读器测试 Web 应用程序。通过实际屏幕阅读器进行实机测试,验证屏幕阅读器兼容性、调试辅助技术问题,并确保 ARIA 实现正确。
涵盖导航、表单、动态内容通知、焦点管理和模态对话框。提供特定平台的命令、测试清单和常见无障碍模式的代码示例。强调在不同屏幕阅读器模式(浏览、焦点、应用程序)下进行测试,并优先使用语义化 HTML,将 ARIA 作为补充增强。
它产出什么
- VoiceOver 测试清单,涵盖页面加载、导航、链接、表单、动态内容和表格
- NVDA 测试脚本,提供关于初始加载、地标、标题、表单、交互元素和动态内容的分步说明
- 展示无障碍模式的 HTML 代码示例,并针对未标注的按钮、未播报的动态内容、表单错误等常见问题给出修复方案
- 用于焦点管理的 JavaScript 代码,包括模态对话框、焦点陷阱和标签界面的键盘导航
工作方式
- 01按平台测试主流屏幕阅读器
在 Windows 上使用 NVDA 配合 Firefox(占比 31%)、在 macOS 和 iOS 上使用 VoiceOver 配合 Safari(占比 15%)、使用 JAWS 配合 Chrome(占比 40%)、在 Android 上使用 TalkBack(占比 10%),以及使用 Narrator 配合 Edge(占比 4%)。
- 02使用屏幕阅读器专属命令进行导航
执行诸如 VO+右箭头(VoiceOver 元素导航)、H(NVDA 标题跳转)、Insert+F7(JAWS 链接列表)以及双指滑动(TalkBack 滚动)等命令。
- 03在浏览模式和焦点模式下测试
验证屏幕阅读器能否正确地在用于阅读内容的浏览模式与用于操作表单控件的焦点模式之间切换,并留意模式切换的语音提示。
- 04验证语义结构和 ARIA
检查标题是否可通过转子或元素列表被发现,地标是否正确标注,实时区域是否会宣读更新内容,以及 dialog、tab、progressbar 等角色是否正确实现。
- 05验证焦点管理和键盘交互
确保表单提交后焦点移动到错误提示处,模态框能正确捕获焦点并在关闭时将焦点返回,且标签界面能响应方向键、Home 和 End 键。
- 06测试动态内容通知
触发内容更新,确认带有 aria-live="polite" 的 role="status" 会在当前语音播报完成后宣读变更,而 role="alert" 会立即打断播报。