段落必须用而非，标题须按–层级规范使用，强调用/而非/，换行优先CSS控制而非，语义缺失会损害SEO与可访问性。
用 写段落
浏览器默认给 包文本，既没语义、又得手动重置 margin，还可能影响 SEO 和可访问性。
常见错误：把标题、说明、列表项全塞进 ，结果样式混乱、缩放时文字重叠、屏幕阅读器念成“一堆没名字的盒子”。
- 正文段落一律用
- 小说明、注释类短文本可用
- 避免嵌套
...
—— HTML5 不允许
标题标签的意义不在字号，而在文档结构。一个页面只能有一个
立即学习“前端免费学习笔记（深入）”；
实操建议：
- 先画草稿：标出哪是主标题、哪是章节、哪是小提示，再选对应
- 别靠 CSS 把
- 用浏览器开发者工具的“无障碍”面板检查标题树是否连贯
强调和特殊语义别只靠
典型误用场景：
- 用
- 用
- 在按钮里写
提交 → 按钮文本本身已有语义，无需额外强调标签
长文本换行和空格处理：用
更可控的做法：
- 段落之间用
margin 控制间距
- 想保留原文换行和空格？用
white-space: pre-line（适合用户输入的富文本预览）
- 单字/词强制不换行？用
white-space: nowrap
第一行
第二行（两个空格后换行）
第三行
实际写静态页时，最容易被忽略的是标题层级断裂和 泛滥——看着渲染正常，但一开无障碍模式或跑 Lighthouse 审计就暴雷。语义标签不是“写了更好”，而是“不写就埋坑”。
浏览器默认给 常见错误：把标题、说明、列表项全塞进 ... 标题标签的意义不在字号，而在文档结构。一个页面只能有一个 立即学习“前端免费学习笔记（深入）”； 实操建议： 典型误用场景： 更可控的做法： 第一行
第二行（两个空格后换行）
第三行 加了上下外边距，语义上也明确这是“一段文字”，搜索引擎和读屏软件会识别它为独立内容块。直接用 margin，还可能影响 SEO 和可访问性。
（语义是附属信息，不是单纯变小）
—— HTML5 不允许 互相嵌套
到 必须按层级写，不能只看大小（通常是主标题），子模块用 ，子模块里的小节用 ，以此类推。跳级（比如 后直接 ）或乱用（比如用 当强调文字）会让大纲解析失败，影响目录生成、SEO 权重分配和键盘导航顺序。
改成比 还大 —— 视觉可以调，语义不能骗强调和特殊语义别只靠
/ ，优先用 /
和 只表示“视觉加粗/斜体”，而 表示内容重要性高（读屏器会加重语气）， 表示语气强调（读屏器会变调）。HTML5 明确区分了表现与语义。
写英文书名、生物拉丁名 → 应该用 或 + class 做关键词高亮 → 应该用 （如果真重要）或 （如果是搜索匹配高亮）提交 → 按钮文本本身已有语义，无需额外强调标签长文本换行和空格处理：用
分隔，靠 CSS 的 margin 控制间距（适合代码、日志）或 white-space: pre-line（适合用户输入的富文本预览） + white-space: nowrap
实际写静态页时，最容易被忽略的是标题层级断裂和
