doctype 和 lang 必须在第一行且无 bom 或注释，否则触发怪异模式；lang 值须严格匹配实际语言并小写规范；语义化标签是 dom 解析前提，不可用 class 替代；meta charset 必在 head 前 1024 字节内，viewport 需紧随其后；图片 video 必须有完整 fallback。
DOCTYPE 和 lang 必须在第一行，且中间不能有 BOM 或注释
只要 前出现任意字符（包括 UTF-8 BOM、空格、<code><!-- comment -->），IE 和旧版 Safari 就会退入怪异模式（Quirks Mode），导致盒模型、Flexbox、position: sticky 等行为完全错乱。
必须是文档第一个字节，连换行都不行；验证方法：用 VS Code 打开文件，右下角检查编码是否为 “UTF-8 with BOM” —— 若是，转成 “UTF-8” 并保存-
的lang值必须与页面实际语言严格一致；lang="zh"在 Safari 中无法触发中文语音朗读，lang="zh-cn"（小写）在部分 Android WebView 中被忽略 - JS 动态修改
document.documentElement.lang无效 —— 它只影响初始渲染时的辅助技术识别，后续改不生效
语义化标签不是“可选装饰”，而是 DOM 解析一致性前提
用 <div class="header"> 替代 <code><header></header>，看似没区别，但在 Safari + VoiceOver、NVDA、甚至 Chrome 的 querySelectorAll('nav') 中，结果可能完全不同 —— 因为部分浏览器/读屏器只按原生语义标签建立 DOM 导航树，不认 class。
-
<main></main>在整个文档中只能出现一次，嵌套在<section></section>或<article></article>内会导致document.querySelector('main')返回null -
<nav></nav>不等于“所有带链接的容器”——它只适用于主导航、页脚导航等全局导航区块；面包屑、分页、相关推荐都不该用<nav></nav> -
<ul></ul>和<ol></ol>必须直接包裹<li>，中间插<div> 或 <code><p></p>会让屏幕阅读器跳过全部列表项viewport 和 charset 的位置比你想象中更敏感
<meta charset="UTF-8">必须出现在前 1024 字节内，否则 IE 和某些 Android 浏览器会按系统默认编码（如 GBK）解析后续 HTML，造成中文乱码或脚本中断；而<meta name="viewport">若放在 CSS<link>之后，在 iOS Safari 中可能被忽略，导致响应式失效。- 把
<meta charset="UTF-8">放到<title></title>之前，且确保它前面只有<meta http-equiv="X-UA-Compatible">这类极简元数据 -
<meta name="viewport" content="width=device-width, initial-scale=1">要紧贴<meta charset>后面，不要隔开任何<link>或<script></script> - 避免用
<meta charset>的等效写法如<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">—— 它在部分老安卓 WebView 中不被识别
图片和媒体元素的 fallback 不是锦上添花，而是降级生存线
当
<img src="xxx.jpg">加载失败、或用户禁用图片、或读屏器解析时，alt是唯一内容载体；<video></video>没有<source></source>或poster，在 iOS Safari 中会显示空白黑块，且无法触发错误事件。-
alt=""表示“该图纯装饰，无信息”，不能省略；留空alt属性比不写更安全 -
<picture></picture>中每个<source></source>必须带media或type，否则 Chrome 会忽略整个结构，回退到<img>的src -
<video poster="cover.jpg"></video>的poster图片必须能独立加载 —— 如果它 404，iOS Safari 会卡在 loading 状态，不显示 controls，也不触发error事件
大型站点真正难的不是写对标签，而是让每个标签在 Safari 14、Android 9 WebView、Edge Legacy、甚至微信内置浏览器里，都触发同一套 DOM 构建逻辑 —— 这要求你把“标准”当成硬约束，而不是参考指南。
- 把
