语义化标签（如、、<h1>-<h6>、<section>等）才是构建内容结构的关键，格式化标签（、、<u>）仅控制样式，无助于SEO和可访问性。
<b>、<i>、<u> 这类标签不是用来“优化结构”的，它们只负责文本样式，对语义、SEO 或可访问性几乎没帮助。真要优化内容结构，得靠语义化容器和标题层级，而不是加粗或斜体。
别用 <b> 和 <i> 替代语义标签
很多人习惯用 <b> 强调关键词、用 <i> 标注外文或术语，但这样浏览器和屏幕阅读器只看到“加粗”“斜体”，不知道这段文字的意图。搜索引擎也不因此提升权重。
-
<strong>才表示内容重要性提升，适合强调关键操作、警告或核心主张 -
<em>表示语气强调，比如“你必须保存后再退出”，其中“必须”用<em>更准确 -
<cite>用于作品名（如书名、电影名），<dfn>用于首次定义术语，比<i>更有语义价值 - 纯视觉样式需求（比如让某段文字统一变蓝）应交给 CSS，而不是塞一堆无意义的
<span>+<b>
<h1> 到 <h6> 必须保持逻辑嵌套
标题不是“加大字号的段落”，而是内容大纲的骨架。跳级（比如 <h2> 后直接 <h4>）会让屏幕阅读器用户迷失层级，也会干扰搜索引擎判断主次关系。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 每个页面有且仅有一个
<h1>，代表页面主题（通常与<title>一致） -
<section>或<article>内部可以有自己的<h2>～<h6>，但必须从<h2>开始，不能越级 - 避免用
<h2>当作“小标题样式”滥用——如果它不构成内容分组的逻辑标题，就该用<p class="subtitle">+ CSS - 浏览器开发者工具的“Accessibility”面板能实时检查标题层级是否断裂
格式化标签和语义标签混用时的常见错误
比如在 <blockquote> 里硬塞 <b> 做作者名，或给 <code> 外包一层 <i>——这既破坏语义，又增加冗余节点。
立即学习“前端免费学习笔记（深入）”；
-
<blockquote>应配合<footer>或<cite>标注来源，而不是靠<i>模拟斜体署名 -
<code>已自带等宽字体和语义，再套<pre>是为了保留换行缩进；但加<b>就多余了 -
<time>、<address>、<abbr>这些轻量语义标签，比任何格式化标签都更利于机器理解 - 检查 DOM 时留意：如果某个
<span>只为加 class 而存在，且没包裹任何语义信息，大概率可以删掉
真正影响结构质量的，从来不是“这段字要不要加粗”，而是“这段内容在整个信息流中扮演什么角色”。格式化标签是粉刷，语义标签才是承重墙。写完 HTML 后，关掉 CSS 看一眼纯文本渲染效果，如果逻辑断层、重点模糊、顺序混乱——那问题八成出在结构，不在样式。
