不设lang属性,页面就等于没声明语言;必须设在标签且符合bcp 47标准(如zh-cn),否则翻译、朗读、seo等功能全部失效。

不设lang属性,页面就等于没声明自己说什么语言
只要页面内容不是纯符号、纯数字或完全无文本,就必须设 lang。浏览器、屏幕阅读器、Chrome 翻译按钮、Google 搜索索引,全部依赖 document.documentElement.lang 做第一判断——它不是“增强体验”,而是语义基础设施。没设,就等于把中文当英文读、把日文当乱码索引、让翻译功能直接消失。
哪些情况必须显式设置lang="zh-CN"
以下任一条件成立,lang="zh-CN" 就不是可选项:
- 页面主体是简体中文(哪怕只有一段正文 + 一个标题)
- 用了中文标点(如《》、【】、、)、中文避头尾规则或 CSS 的
:lang(zh)选择器 - 目标用户含视障人士(NVDA / VoiceOver 必须靠该值加载中文 TTS 引擎)
- 希望 Chrome 右键出现“翻译成中文”按钮(且不被误翻成日语/韩语)
- SEO 要求被 Google 正确识别为中文站点(否则可能进“未标注语言”降权池)
常见“以为不用设”的错误场景
这些情况反而更需要严格设 lang:
-
:只影响局部断词和:lang()匹配,对页面级语言识别完全无效 - 页面含英文引文但主体是中文:仍需
,再给引文加<p lang="en"></p> - 用 React/Vue 渲染,但 SSR 未输出
lang:JS 后期执行document.documentElement.lang = "zh-CN"已错过辅助技术初始化时机 - 写了
<meta http-equiv="Content-Language" content="zh-CN">:HTML5 已废弃,所有现代浏览器忽略
lang值写错比不写还糟
以下写法等同于没设,甚至触发更差行为:
-
lang="ZH-CN"或lang="zh_cn":BCP 47 要求小写+连字符,非法值被静默忽略 -
lang="zh":虽合法但粒度太粗,部分旧读屏无法匹配拼音库,iOS VoiceOver 可能 fallback 到英文朗读 -
lang="":明确声明“语言未知”,屏幕阅读器按默认语种(通常是英语)逐字朗读中文,多音字全错 -
lang="chinese"或lang="Chinese":非标准标签,浏览器直接无视
真正安全的中文值只有 zh-CN(大陆简体)、zh-TW(台湾繁体)、zh-HK(香港繁体)——选哪个,取决于内容实际使用的规范,而不是开发者的所在地。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











