HTML是前端结构层，DOCTYPE必须顶格首行、lang属性需写全“zh-CN”、charset必须置于head最前、body文本须语义化包裹，否则将触发怪异模式或无障碍失效。
HTML 不是编程语言，它是前端开发者必须亲手写、亲手改、亲手调试的结构层——没有它，CSS 无处挂载，JavaScript 无处操作节点，整个页面连骨架都立不起来。
DOCTYPE html 必须放在第一行，且不能有任何前置内容
常见错误现象：页面样式错乱、盒模型异常、Flex/Grid 行为诡异
原因不是“少写了”，而是浏览器进入了怪异模式（Quirks Mode），按旧标准解析 DOM
- 必须顶格写，前面不能有空格、注释、BOM 字符或
<?php等服务端指令 - 不区分大小写，但惯例全小写；
html后面不加任何版本号（如HTML5或html5） - VS Code 中输入
!+ Tab 可自动生成完整骨架，但要注意检查生成结果里有没有意外空行
lang 属性不是可选项，而是语义与可用性刚需
lang="zh-CN" 写在 <html> 标签上，影响远超“翻译识别”：
- 屏幕阅读器依赖它切换发音规则（比如“行”读 háng 还是 xíng）
- 浏览器拼写检查、自动填充、字体回退策略均受其约束
- 搜索引擎用它判断内容地域相关性，影响 SEO 排名权重
- 错误示例：
<html lang="zh">（缺地区码）、<html lang="CN">（缺语言码）
meta charset="UTF-8" 必须出现在 <head> 最靠前位置
一旦位置靠后，浏览器可能已用默认编码（如 ISO-8859-1）解析了前面的标签，导致：
- 中文标题显示为乱码（）
-
<title>内容无法被正确索引 - 表单提交时中文参数丢失或变形
- 它必须是
<head>中第一个非注释标签，早于<title>、<meta name="viewport">等所有其他meta
body 里不能直接写文本，必须包裹在语义化容器中
看似能运行的代码：<body>欢迎来到首页</body>
实际问题：
- 缺失段落语义，无障碍工具无法识别为可读文本块
- 无法单独设置字体、行高、间距等样式（CSS 选择器无目标）
- 打印、导出 PDF 时排版失控
- 正确做法：至少用
<p>包裹，优先考虑<main>+<section>+<h1>组合
真正容易被忽略的点在于：HTML 的“正确”不等于“能渲染”，而在于是否建立可维护、可访问、可扩展的结构契约。哪怕只改一个 lang 值，也可能让残障用户第一次听懂你的页面。
立即学习“前端免费学习笔记（深入）”；
