交互态可访问性标准必须按状态拆解，需为每个交互态（:hover、:focus、:active、:disabled、[aria-busy="true"]）单独定义焦点可见性、语义变更、aria同步、对比度（≥4.5:1）等要求，并在文档中明确验证责任、已知限制及具体替代方案。
交互态可访问性标准必须按状态拆解，不能笼统写“支持键盘”
很多团队把“符合可访问性”当成一个静态目标，结果在按钮悬停、聚焦、禁用、加载中等状态上漏掉关键要求。比如 button 在 :disabled 状态下，屏幕阅读器会自动跳过它，但视觉上如果只靠灰度变化而没提供足够对比度（color: #999），低视力用户就无法识别其状态；又比如 :focus 样式被 outline: none 无条件移除，等于直接切断键盘用户的导航路径。
实操建议：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 每个交互态（
:hover、:focus、:active、:disabled、[aria-busy="true"]）都需单独定义：焦点可见性、语义是否变更、ARIA 属性是否同步更新、颜色对比度是否达标（≥4.5:1） - 禁用态必须同时满足：HTML
disabled属性 +aria-disabled="true"（对自定义组件），不能只靠 CSSpointer-events: none - 加载中态（如按钮点击后变“提交中…”）要触发
aria-busy="true"，并配合aria-live="polite"区域播报状态变更，否则屏幕阅读器用户不知道操作是否生效
文档里写清楚“谁负责验证状态同步”，而不是只列属性
常见疏漏是文档只写“使用 aria-expanded 控制折叠菜单”，却不说明：当用户用键盘打开菜单时，JS 必须同步设置 aria-expanded="true" 并将焦点移到第一个子项；关闭时不仅要重置属性，还要把焦点移回触发按钮。否则，键盘用户打开后无法继续操作，或关闭后焦点丢失。
实操建议：
- 对每个含状态变更的组件（手风琴、选项卡、模态框），文档必须注明：触发行为（点击/空格/回车）、JS 同步动作（改哪些 ARIA 属性、调哪些方法、移不移焦点）、辅助技术预期反馈（例如 VoiceOver 会读“已展开，共3项”）
- 避免写“确保 ARIA 属性正确”这种模糊描述，要具体到：
tablist元素在获得焦点时，必须有aria-activedescendant指向当前激活的tab元素 ID - 状态切换的 JS 逻辑必须附带单元测试断言，例如：
expect(button).toHaveAttribute('aria-busy', 'true')，否则文档要求形同虚设
鼠标悬停和键盘聚焦必须提供同等信息密度
很多工具提示文档只规定“悬停显示文字”，却忽略：键盘用户 Tab 进入元素时，该提示内容必须立即可读，且不能依赖 title 属性——因为 title 在多数屏幕阅读器中默认不播报，移动端也完全不可用。
实操建议：
- 所有悬停类提示（icon + tooltip）必须有对应键盘方案：Tab 聚焦触发显示 + Esc 关闭 +
aria-describedby关联描述元素 - 提示内容不能仅靠视觉位置暗示归属，必须用
id显式绑定，例如：<button aria-describedby="tooltip-1"></button><div id="tooltip-1" role="tooltip">删除此项目</div> - 若提示含链接或操作按钮，整个提示区域需设
tabindex="0"并处理键盘事件（方向键导航、Enter 触发），否则键盘用户无法与之交互
文档末尾必须声明“哪些状态未覆盖”，而非假装全支持
真实项目总有妥协：比如旧版 IE 不支持 :focus-visible，导致无法区分鼠标聚焦和键盘聚焦；又比如某些第三方图表库的 legend 项无法添加 tabindex。这时候文档若写“完全支持 WCAG 2.1 AA”，反而误导后续维护者。
实操建议：
- 在文档末尾单列“已知限制”章节，明确写出：不支持的状态场景（如“触控设备上长按无法触发 tooltip”）、替代方案（如“提供常驻帮助图标按钮”）、预计修复时间（如“v2.3 版本计划替换图表库”）
- 每个限制项关联具体 issue 编号和测试环境（例如：“iOS Safari 17.5 下，
aria-modal="true"对 modal 外部元素的 focus trap 失效”） - 禁止用“正在优化中”“后续迭代完善”这类空话，必须写清当前实际表现和用户影响程度（如“键盘用户需连续按 5 次 Tab 才能绕过该区域”）
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
