使用 AI 指导 Web 应用的屏幕阅读器无障碍测试 #

解决 Web 应用在视障群体中的可用性问题：利用 AI 引导进行屏幕阅读器兼容性验证，确保 ARIA 标签正确、动态内容可感知且导航流程顺畅。

为什么需要这个技能 #

许多开发者在编写 HTML 时会依赖简单的语义化标签，但在面对复杂交互（如模态框、下拉菜单、动态加载列表）时，简单的标签往往不足以向辅助技术传达准确的状态。

如果缺乏专业的屏幕阅读器测试流程，产品可能会出现“焦点丢失”、“状态不可知”或“朗读顺序混乱”等严重问题。本技能通过 AI 提供一套结构化的测试方法论，帮助开发者在不需要成为 a11y 专家的情况下，也能高效地验证和修复无障碍缺陷。

适用场景 #

• ARIA 实现验证：检查 aria-label、aria-expanded 等属性是否在状态变更时正确更新。
• 表单可访问性检查：验证输入框的关联标签是否能被正确朗读，错误提示是否能即时通知用户。
• 动态内容监听：测试页面在不刷新的情况下，通过 aria-live 区域推送的新消息是否能被及时播报。
• 导航流程审计：确保 Tab 键切换顺序逻辑符合用户预期，且没有出现“键盘陷阱”。

核心工作流 #

1. 明确测试目标：定义需要验证的具体组件或用户路径（如“完成一次注册流程”）。
2. 配置测试环境：根据 AI 建议选择合适的屏幕阅读器（如 NVDA, JAWS 或 VoiceOver）并配置基础选项。
3. 执行验证步骤：
   • 检查语义化结构是否正确。
   • 验证焦点跳转路径。
   • 确认动态交互的语音反馈是否与视觉状态一致。
4. 缺陷分析与修复：将测试中发现的朗读异常反馈给 AI，由 AI 结合 resources/implementation-playbook.md 中的模式提供修复方案。

下载和安装 #

下载 screen-reader-testing 中文版 Skill ZIP

解压后将目录放入你的 AI 工具 skills 文件夹，重启工具后即可使用。具体路径参考内附的 USAGE.zh.md。

你可能还需要 #

暂无推荐