可访问性债务是结构失衡的累积效应，源于语义缺失、角色错配、焦点流断裂等长期叠加问题，需通过axe-core与htmlhint组合扫描，并在pre-commit阶段用husky+lint-staged硬性拦截。
可访问性债务不是“没加alt”，而是结构失衡的累积效应
HTML可访问性问题极少单点爆发，更多是语义缺失、角色错配、焦点流断裂长期叠加的结果。比如一个div被反复用onclick模拟按钮，表面功能正常，但已同时埋下三颗雷：屏幕阅读器无法识别操作意图、键盘Tab无法聚焦、role="button"与aria-pressed状态不同步。这类债务不会报错，却在用户测试中集中暴露——它不阻断构建，只阻断真实使用。
用 axe-core + HTMLHint 做可访问性债务扫描
别依赖肉眼检查或零散eslint-plugin-jsx-a11y规则。axe-core 是 WCAG 合规性检测的工业级工具，能识别上下文相关问题（如img是否真需要alt、aria-hidden是否误遮挡交互元素）；HTMLHint 则补上基础结构债（如lang缺失、meta charset位置错误、自闭合标签滥用）。二者组合覆盖从语法到语义的全链路。
- 安装：
npm install axe-core htmlhint --save-dev - CI 中运行：
npx axe src/index.html --reporter=html > axe-report.html，配合npx htmlhint src/**/*.html - 关键配置项：
htmlhintrc里必须启用attr-lowercase、id-unique、head-script-disabled（禁止<script></script>写在末尾）
把可访问性债务映射到具体开发动作
扫描报告里的每一条警告，都要对应到可执行的代码修改，否则就是无效负债登记。例如：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
-
ARIA role must be appropriate for the element→ 替换<div role="button">为<code><button></button>，而非仅补tabindex="0" -
Heading levels should only increase by one→ 检查所有<h2></h2>前是否有<h1></h1>，而不是给<h2></h2>加aria-level="1" -
Color contrast ratio less than 4.5:1→ 修改 CSS 中color和background-color值，而非加aria-label绕过
重点在于：可访问性修复必须改变 DOM 结构或样式声明，不能靠 ARIA “打补丁”掩盖语义缺陷。
治理难点不在检测，而在持续拦截
最常被忽略的是 pre-commit 阶段的硬性拦截。光有 CI 扫描没用——开发者提交后才被告知问题，修复意愿和成本都陡增。必须用husky + lint-staged 在本地 commit 前跑axe-core轻量检查（如只测当前变更文件中的button、input、img节点），失败则阻断提交。这比等 PR 评审时发现更早、更省力，也避免“这次先 merge，下个迭代再修”的债务滚雪球。
