效果最好的做法是优先重构入口页、含表单页、全局模板片段三类html文件，因改一处可覆盖全站80%以上可访问性漏洞；必须首批处理index.html、home.html、login.html、contact.html、header.inc（或footer.inc）。
效果最好的做法，不是等项目做完再补可访问性，而是把修复动作卡在三个具体文件类型上：入口页、含表单页、全局模板片段。改这三类，80% 的可访问性问题当场消失。
哪些HTML文件必须第一批动手改
别碰全站，先锁死这五种文件：index.html、home.html、login.html、contact.html、header.inc（或 footer.inc）。它们改一处，影响所有引用页。
-
index.html和home.html缺lang或，浏览器进怪异模式，JS 计算都可能偏移 -
login.html和contact.html里<input>没<label></label>、alt为空、required缺失——W3C 验证器批量报错，屏幕阅读器用户根本没法填 -
header.inc里用<div role="navigation"> 模拟导航？错。它被全站复用，一旦键盘焦点卡死，所有页面都不可用 <h3>HTMLHint 基线规则怎么配才不翻车</h3> <p>启用全部 40+ 规则只会让团队每天收到 100+ 警告，最后全员禁用插件。真正能落地的只有 5 条硬规则，写进项目根目录的 <code>.htmlhintrc：-
doctype-first和doctype-html5：防怪异模式，避免盒模型错乱拖垮 JS -
html-lang-require：没lang，VoiceOver/TalkBack 直接读成英文，中文页面变外语现场 -
id-unique：重复id会让document.getElementById()返回随机节点，aria-labelledby彻底失效 -
alt-require：缺alt不是“体验差”，是功能缺失——无图环境、弱网、辅助技术下，信息直接消失
VS Code 保存即校验，比 Code Review 早两周暴露问题。
动态内容更新后怎么让屏幕阅读器感知
AJAX 提交成功、表单校验失败、模态框打开——这些变化若不主动通知，视障用户会卡在旧状态里，以为操作没响应。
- 错误提示必须用
aria-live="polite"包裹，且放在 DOM 中靠前位置（最好紧贴<form></form>开头） - 模态框需同时设置
role="dialog"、aria-modal="true"和aria-labelledby指向标题元素，否则屏幕阅读器继续朗读背景内容 - 校验失败字段，除了视觉高亮，必须加
aria-invalid="true"和aria-describedby指向错误消息的id；仅靠 CSSdisplay: none隐藏错误消息，内容就从可访问树中彻底消失
main 标签为什么只能有一个且不能套广告
屏幕阅读器按 M 键跳转时，只识别第一个合法的
<main></main>。如果页面中存在多个，或它包裹了顶部 banner + 左侧菜单 + 内容区，读屏工具要么跳过、要么定位错误。- 必须全局唯一，且只包含用户真正要操作/阅读的部分（如商品列表、表单主体、文章正文）
- 不能嵌套在
<section></section>内——否则屏幕阅读器误判内容层级 - 冗余
<main></main>不增加字节大小，但会让辅助技术多做无效 DOM 遍历，拖慢语音导航响应
最常被忽略的是：Next.js 布局组件里写一个
<main></main>，子页面又渲染一个——两个<main></main>同时存在，M 键一按就失效。 -
