lang属性必须写在标签上且符合bcp 47规范（如zh-cn），写在等其他位置无效；缺失或错误会导致可访问性、seo和语音合成异常。

HTML5 页面语言声明（lang 属性）本身不参与 W3C 语法校验的强制要求，但缺失或错误会影响可访问性、SEO 和语音合成等关键功能。真正需要排查的是它是否被正确、一致、语义化地使用——而不是“通不过校验”，而是“通不过最佳实践审查”。

确认 lang 属性是否写在根元素上

lang 必须出现在 标签中，且是唯一有效的声明位置。其他地方（如 、<div>）加 <code>lang 不会覆盖根语言，仅用于局部语言切换。

• ✅ 正确： 或
• ❌ 错误：（无效，浏览器忽略）
• ⚠️ 风险：（空值被视作未知语言，屏幕阅读器可能跳过或报错）

检查语言代码是否符合 BCP 47 标准

W3C 不校验语言代码格式，但辅助技术（如读屏软件）和搜索引擎依赖标准写法。避免手写常见错误：

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

• 用连字符 -，不用下划线：zh-CN ✅，zh_CN ❌
• 地区子标签大写：en-US ✅，en-us ❌（虽部分兼容，但不符合规范）
• 中文推荐用 zh-CN（简体）、zh-TW（繁体），不用 zh（太宽泛，缺乏地域信息）
• 多语言混合页面中，局部切换需明确标注：<span lang="ja">こんにちは</span>

用开发者工具快速验证实际生效情况

打开浏览器 Elements 面板，点击 元素，看右侧 Attributes 是否显示 lang 值；再右键该节点 → “Copy” → “Copy outerHTML”，粘贴后确认值未被 JS 动态覆盖或清空。

• 灰色斜体的 lang 属性：说明是浏览器自动补全（原始代码没写），需手动补上
• 属性值被红色波浪线标出：可能是 DevTools 检测到非标准代码（如 lang="chinese"），不是语法错误，但提示语义风险
• 按 Ctrl+Shift+P（Win）或 Cmd+Shift+P（Mac），输入 “Accessibility” 打开无障碍检查器，查看“Language”字段是否识别为有效值

配合 Lighthouse 或 axe 工具做语义化审计

W3C Validator 不报 lang 缺失，但 Lighthouse（在 Chrome DevTools 的 Lighthouse 标签页）的 “Accessibility” 类别会明确提示 “Document doesn’t have a valid lang attribute”。

• 运行 Lighthouse → 选择 “Accessibility” → 生成报告 → 查看 “Document has a valid lang attribute” 项
• 用 axe 浏览器插件一键扫描，结果中会直接定位到 标签并给出修复建议
• 若项目集成 CI/CD，可用 axe-core CLI 或 pa11y 自动检测，把语言声明纳入质量门禁