lang属性必须显式声明在<html>标签上，浏览器和屏幕阅读器依赖它识别语言；子语言切换需用lang而非CSS或HTTP头；语义标签需配合lang声明语言边界；dir与lang须组合使用；多语言导航需<nav>包裹并为每个链接设hreflang和lang。
lang 属性必须显式声明在 <html> 标签上
浏览器和屏幕阅读器依赖 lang 属性识别当前语言，否则多语言切换时语义结构会“失联”——比如中文页面里嵌入的英文段落若没用 <span lang="en"> 包裹，语音朗读可能仍用中文音调读英文单词，词形变化（如德语名词首字母大写）或 RTL 布局（如阿拉伯语）也可能失效。
实操建议：
立即学习“前端免费学习笔记（深入）”；
-
<html lang="zh-CN">是起点，不能省略；切忌只靠 HTTPContent-Language头或 meta 标签替代 - 子语言切换必须用
lang属性，而非仅靠 CSSdirection或text-align - 动态切换语言时，务必同步更新
<html>的lang值，否则 ARIA 属性（如aria-label）的语音解析会错乱
用 <section> 和 <article> 替代 <div> 时需注意嵌套层级与语言边界
语义标签本身不带语言感知能力，但它们定义的内容边界会影响翻译工具、SEO 抓取和辅助技术对“一段独立内容”的判断。例如，一个 <article lang="ja"> 内部混用未标注 lang 的英文术语，会被当作日语上下文中的外来语处理；而如果整个 <article> 被错误标记为 lang="en"，其中的中文引文就可能被机器翻译成错误方向。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 每个
<article>、<section>应有明确主语言，通过lang属性声明，避免跨语言内容“寄生”在无语言标记的容器中 - 不要把整站所有内容塞进一个
<main>再靠 JS 切换语言——这会让语义结构坍缩成单语言骨架，失去多语言可访问性基础 - RTL 语言（如
lang="ar"）下，<aside>的视觉位置虽常在右侧，但语义上仍是“附属内容”，不可因布局翻转就改用<nav>或<footer>替代
dir 属性和 CSS direction 不等价，且不能替代 lang
常见错误是以为加了 dir="rtl" 就完成了阿拉伯语适配，结果搜索爬虫仍按默认 LTR 解析标题层级，或者 <h2> 在屏幕阅读器中被误读为 <h1>。HTML 的 dir 影响文本流、表单光标走向和某些 Unicode 渲染行为（如连字），但不触发语言相关的拼写检查、断行规则或语音合成引擎的语言切换。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 始终组合使用：
<html lang="he" dir="rtl">，而不是只选其一 - CSS 中的
direction: rtl只作用于样式渲染层，无法被辅助技术识别为语言信号，禁止单独用于多语言语义适配 - 嵌套方向变化（如阿拉伯文中插入英文 URL）应靠
<bdi>或<span dir="ltr">局部修正，而非全局覆盖dir
多语言导航中 <nav> 与 hreflang 的配合盲区
很多团队给语言切换链接加上 hreflang，却把它们放在普通 <div> 里，导致屏幕阅读器无法将这些链接识别为“导航意图”。更隐蔽的问题是：当 <nav> 内部语言与页面主体不一致（如中文页底部放英文语言选择器），lang 属性若只设在 <nav> 上，会导致该导航块内所有子链接被统一视为英文上下文，破坏 hreflang 的语义锚定。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 语言切换区域必须用
<nav aria-label="Language navigation">包裹，并为每个<a>显式设置hreflang和目标语言的lang（如<a href="/en/" hreflang="en" lang="en">English</a>） - 避免在
<nav>根节点设lang，除非整个导航块使用同一种非页面主语言（极少见） - 服务端渲染时，
hreflang值必须与实际响应头Content-Language和 HTML<html lang>严格一致，三者错位会导致搜索引擎降权或辅助技术拒绝加载对应资源
最易被忽略的是：语义标签的嵌套深度一旦超过三层（比如 <article> <section> <aside> <p>），不同语言的语法结构差异（如日语无冠词、阿拉伯语动词前置）会让同一套 DOM 结构在翻译后语义漂移——这时候，不是加更多属性能解决的，得回退到内容建模阶段，按语言特性拆分语义单元。
