可访问性必须从首次提交卡死，htmlhint在pre-commit阶段通过显式启用"alt-require":true和"input-requires-label":true强制拦截缺alt的及未关联label的，且不认aria-label，仅认原生语义。
可访问性不是“上线前补几个 alt”的收尾动作，而是从第一次提交就必须卡死的准入门槛——没配 alt 的 <img>、没被 <label></label> 包裹的 <input>，必须在 pre-commit 阶段直接拒绝，不能进 CI，更不能进主干。
pre-commit 钩子里怎么强制校验 alt 和 label
HTMLHint 是唯一能静态拦截这类问题的工具，但它默认不启用可访问性规则。光装插件没用，必须手动开关键开关。
- 在项目根目录建
.htmlhintrc，明确写入："alt-require": true和"input-requires-label": true -
input-requires-label会拒绝所有未被<label></label>包裹、也未通过for/id关联的<input>、<textarea></textarea>、<select></select> - 它不认
aria-label—— 这是设计选择，不是 bug；你要的是原生语义锚点，不是运行时补丁 - 钩子脚本里加
exit 1，且禁用--no-verify参数，否则开发随手git commit --no-verify就绕过了
为什么 W3C 验证器拦不住缺 alt 的图
W3C Markup Validation Service 只管语法合法，不管语义责任。它认为 <img src="icon.svg"> 完全合规，哪怕这张图是“提交订单”按钮。
- WCAG 2.1 AA 级要求：所有非纯装饰性图片必须有有意义的
alt；装饰性图片必须显式写成alt=""（空字符串），不能省略 - 这意味着：W3C 报“通过”，HTMLHint 报“错误”，axe 报“严重”——三者目标不同，不能互相替代
- 真实项目中，W3C 检查只用于兜底语法，可访问性红线必须由 HTMLHint 在 pre-commit 阶段守住
CI 里 HTMLHint 和 axe 怎么分工不打架
HTMLHint 查源码结构，axe 查运行时 DOM；一个防“写错”，一个防“跑偏”。两者叠加才覆盖全链路。
- HTMLHint 在 lint 阶段运行，报错即阻断构建：比如
<img>缺alt、<main></main>缺<h1></h1>、<iframe></iframe>缺title - axe 在测试环境启动后扫描实际渲染的页面，捕获 JS 动态插入却没补
alt、模态框打开后焦点没管理、aria-live区域未声明等场景 - CI 脚本里分开报告：HTMLHint 失败 = 构建失败；axe 失败 = 标记为“需人工确认”，因为部分结果依赖上下文（例如某张图是否真为装饰性）
最难的不是工具报错，而是当 frame-title-require 报警时，你得立刻判断那个 <iframe></iframe> 是嵌第三方地图还是客服系统——这没法自动化，得靠团队在 PR 描述里写清用途，并在 .htmlhintrc 里按需排除特定路径，而不是关掉整条规则。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
