html语义标签不可替代：表强调，表特定语义，表内容层级降低，表上下文相关标记；误用损害可访问性、seo与维护性。
<strong></strong> 和 <em></em> 不是“加粗”和“斜体”的快捷写法，而是语义标签——用错会直接影响可访问性、SEO 和屏幕阅读器行为。
为什么 <b></b> 和 <i></i> 还没被废弃？
它们确实还在标准里，但语义完全不同：<b></b> 表示“不带额外重要性的关键词突出”，比如产品名、船名；<i></i> 表示“语气或状态变化”，比如外语词、术语、船名（再次出现）、思想状态（例：“他心想，这不对劲”）。浏览器默认渲染成加粗/斜体，只是巧合，不是目的。
- 误用
<b></b>替代<strong></strong>：视觉一样，但屏幕阅读器不会加重语气，搜索引擎可能忽略强调意图 - 用
<i></i>标英文单词没问题，但标“重点结论”就错了——该用<em></em> - 老项目里大量
<b></b>/<i></i>很常见，迁移时别只靠全局替换，得逐处判断语义
<small></small> 不是“调小字号”的 CSS 替代品
<small></small> 专用于“附属细则类内容”，比如版权说明、免责声明、法律条款脚注。HTML5 明确说它“不表示字体大小，而表示内容层级降低”。浏览器默认缩小显示，只是呈现方式。
- 想让某段文字视觉变小？该用 CSS 的
font-size，而不是塞个<small></small> - 把导航菜单文字包进
<small></small>，语义上等于告诉辅助技术“这段不重要”，反而损害可用性 - 如果真要放版权信息，
<small></small>是正确选择，且建议配合<footer></footer>或<aside></aside>使用
<mark></mark> 的高亮逻辑容易被误解
<mark></mark> 表示“在当前上下文中被标记为相关的内容”，不是“我想让它黄底黑字”。典型场景是搜索结果页中匹配的关键词、引用中被作者强调的部分、教学文档中的考点标注。
- 不要用
<mark></mark>做装饰性高亮（比如标题背景色），那该用span+ class - 动态插入的搜索高亮必须用
<mark></mark>，否则键盘用户按Tab无法聚焦到高亮段落，屏幕阅读器也不会特别提示 - 注意默认样式在不同浏览器略有差异（如 Safari 会加阴影），若需统一，CSS 中重置
background-color即可，别删标签
真正难的不是记住每个标签怎么写，而是每次敲下 时，先问一句：这段内容对用户、机器、未来维护者意味着什么？语义一旦写错，后期补救成本远高于初始多花十秒思考。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
