标签是语义化段落容器，非换行工具；滥用会导致seo降权、屏幕阅读器误读、css控制困难，空无语义且破坏结构。
<p></p> 标签不是“换行工具”，它是语义化的段落容器；用错会导致 SEO 降权、屏幕阅读器误读、CSS 重置困难。
别把 <p></p> 当成 <br> 用
常见错误：连续写多个 <p></p> 来制造视觉空行，比如：
<p>第一段</p> <p></p> <p>第二段</p>
这会让浏览器渲染出三段——中间那段是空段落，语义上毫无意义，还可能被搜索引擎判为低质内容。真正需要换行时，优先用 <br>；需要分隔逻辑内容时，才用 <p></p>。
- 段落必须有实际文本内容，空
<p></p>是无效语义 -
<br>是单标签，只负责换行，不带任何语义权重 - 若需控制段间距，用 CSS 的
margin，而非靠空段落“撑开”
<strong></strong> 和 <b></b> 看似一样，但搜索引擎和读屏软件区别对待
<strong></strong> 表示内容重要性（语义强调），<b></b> 仅表示“视觉加粗”（无语义）。现代 HTML5 明确区分用途：
- 价格、警告、必填项等关键信息，用
<strong></strong>—— 屏幕阅读器会加重语气读出 - 产品名、术语、关键词等需突出但不强调重要性时，用
<b></b> - 纯样式需求（如品牌 logo 文字加粗），应改用
font-weight: bold+<span></span>
混用会导致辅助技术无法准确传达信息层级。
<mark></mark> 不是高亮笔，而是“上下文相关标记”
<mark></mark> 的本意是标出与当前用户查询或上下文相关的部分（例如搜索结果中匹配的关键词），不是通用高亮装饰。浏览器默认黄色背景只是样式，语义才是重点：
- 搜索页结果中匹配词：
<p>找到包含 <mark>HTML</mark> 的文档</p> - 文章中引用他人观点时的标注，比
<em></em>更强调“这是被特别指出的内容” - 不要用它替代
background-color做 UI 高亮；那样既冗余又破坏语义
滥用 <mark></mark> 会让页面在无障碍测试中失分，也干扰内容摘要提取。
<small></small> 不等于“字号小”，而是“附属信息”的语义容器
<small></small> 在 HTML5 中被明确定义为“边注、版权说明、法律条款等次要信息”，不是字体大小控制开关：
- 页脚版权：
<footer><small>© 2026 All rights reserved.</small></footer> - 免责声明、版本号、数据来源等弱化内容，适合用它包裹
- 如果只是想让某段文字变小，应该用 CSS：
font-size: 0.875rem
依赖 <small></small> 控制样式，会在响应式断点或用户自定义字体设置下失效，且语义错位。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
