doctype必须独占首行且全小写以启用标准模式，lang属性须精确设为zh-cn等bcp 47规范值，meta charset必须紧接html标签后且为utf-8无bom，main元素不可嵌套于header等语义容器内。
DOCTYPE 必须独占首行且全小写
浏览器靠它判断是否启用标准模式，写错或漏掉直接进怪异模式（document.compatMode 返回 "BackCompat"），Flex 布局塌陷、margin 计算错乱、盒模型失效全跟着来。
必须是文件第一字符，前面不能有空格、BOM、注释、PHP 输出- 禁止写成
（小写但缺感叹号）、<code>（大写）、<code><!-- 注释 --> - 旧式 DTD 如
已被 HTML5 废弃，验证器会报错
lang 属性必须精确且出现在
这不是装饰项，设错会影响屏幕阅读器发音、拼写检查、Google 搜索语言识别，甚至导致中文页面被当成英文索引。
- 大陆简体用
lang="zh-CN"，台湾繁体用lang="zh-TW"，港澳可用lang="zh-HK" - 禁用
lang="cn"、lang="ch"、lang="zh"—— 这些不符合 BCP 47 规范，W3C 验证器会标为错误 - 局部切语言可用
<p lang="en">Hello</p>，但别在<main></main>或<header></header>里重复套用
<meta charset> 必须紧接
它决定整个文档的初始解码方式。放错位置或文件含 BOM，中文、emoji 一出现就乱码，后面再补也救不回来。
- 必须写在
内，且是中第一个子元素（即后第二行） - 只能是
<meta charset="UTF-8">，不能写成<meta charset="utf8">（缺横杠）或<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">（HTML5 中冗余） - 编辑器保存时务必选 “UTF-8 without BOM”，VS Code 默认可能带 BOM，需手动关掉
<main></main> 的使用有硬性语义约束
它不是视觉容器替代品，而是无障碍导航的核心锚点。键盘用户按 Ctrl+Alt+I（或屏幕阅读器快捷键）跳转“主要内容区”全靠它，滥用等于切断访问路径。
- 整个页面只能有一个
<main></main>，且不能嵌套在<header></header>、<footer></footer>、<nav></nav>、<aside></aside>内部 - 不能和
<section></section>混用：一个<main></main>包裹主体内容，多个<section></section>是它的子模块划分 - 验证时 W3C Validator 会明确报出
Element main not allowed as child of element header这类错误，改起来快，但上线后才发现就得返工
实际构建模板时，最容易被忽略的是 BOM 和 lang 值的合规性——它们不报错但行为异常，调试成本远高于写对那两行代码。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
