lang属性缺失会导致无障碍、SEO、翻译、渲染四方面失效；必须写在<html>标签上，正确值为zh-CN等BCP 47标准格式，缺位、错位或非法值均无效。
lang属性缺失不是“少写一个属性”，而是让整个页面在无障碍、SEO、翻译、渲染四个层面同时掉链子。 它必须出现在 <html> 标签上，缺位或错位等于没写。
屏幕阅读器读成乱码或英文
NVDA、VoiceOver 等辅助技术依赖 <html lang="zh-CN"> 启动中文语音引擎。缺失时，它们会 fallback 到系统默认语言（通常是英文），把“联系我们”读成 /kənˈtækt ʌs/；写成 lang="zh" 或 lang="cn" 同样无效——IETF 标准只认 zh-CN、zh-TW、zh-HK 这类完整变体。语调断裂、分词错误，用户根本无法理解内容。
Google 搜索引擎当你是英文页索引
lang 属性不参与排名计算，但它是搜索引擎判断“这页到底说什么语言”的第一道门。缺失或写错（如 zh_cn、Chinese、ZH-CN），会导致：
- 整站被归入英文语境，中文关键词匹配率暴跌
-
hreflang声明被静默忽略——哪怕你写了十组 alternate 链接，Google 也当它不存在 - 中英混排内容被判定为“语言混杂、质量存疑”，长尾词权重被压制
浏览器自动翻译按钮不出现或翻错
Chrome 和 Edge 的翻译功能依赖根 lang 值做初始判断。没有 <html lang="zh-CN">，翻译按钮大概率不显示；即使手动触发，也可能走错路径（比如中文 → 英文 → 中文的二次失真）。更隐蔽的是：若主页面 lang="en"，但大段产品描述是中文且未用 <p lang="zh-CN"> 显式标注，浏览器可能跳过整块内容，不提供翻译选项。
立即学习“前端免费学习笔记（深入）”；
CSS 伪类和断字规则失效
:lang(zh) 这类选择器需要根 lang 存在且合法才能生效；否则样式不会命中。同理，hyphens: auto 在中文场景下依赖 lang="zh-CN" 触发正确的断字逻辑。缺失时，中文字间可能出现异常间距，或干脆不折行，影响响应式排版。
真正难的不是补上那一行 <html lang="zh-CN">，而是在 SSR 模板里防 XSS 注入、在 SPA 切换语言时同步更新已挂载节点、在富文本编辑器粘贴外文时自动包裹 lang、在 Shadow DOM 内单独设置——这些地方漏一个，就等于在可访问性和 SEO 上开了个洞。
