html标题标签至用于构建语义层级，唯一且为页面主标题，后续按逻辑递降；段落用，强调用等语义标签；禁用模拟标题或段落；需配标题并按内容粒度合理嵌套。
用 <h1></h1> 到 <h6></h6> 构建真实语义层级
标题标签不是“调字号工具”，而是告诉浏览器、搜索引擎和屏幕阅读器“这段文字在全文中的逻辑位置”。<h1></h1> 必须且只能出现一次，对应整页唯一主标题；后续用 <h2></h2> 表示一级子模块（如“安装步骤”“配置说明”），<h3></h3> 表示其下的细分项（如“安装 Node.js”“安装 VS Code”）。
常见错误包括：<h1></h1> 套 <h3></h3> 跳级、同一页面多个 <h1></h1>、用 <h4></h4> 标注页脚说明文字。这些都会破坏辅助技术导航，也影响 SEO 权重分配。
层级一旦开始，就应在同一 <section></section> 或 <article></article> 内连续递降，不能中断后又从 <h2></h2> 重启——除非进入一个全新语义区块（如另一篇独立文章）。
段落与强调标签配合表达信息密度
<p></p> 是默认段落容器，浏览器自动加上下边距、保持换行和可读性。它不该被滥用为“换行符”或“空行占位”——需要空行请用 CSS margin，而非堆砌多个 <p></p>。
局部强调必须用语义化行内标签：<strong></strong> 表示内容重要性提升（非仅视觉加粗），<em></em> 表示语气强调（通常斜体），<small></small> 用于附属说明（如版权、注释），<mark></mark> 标出高亮匹配项（搜索结果中常用）。
别用 <b></b> 替代 <strong></strong>，也别用 <i></i> 替代 <em></em>——前者纯样式，后者带语义。例如：<p>请务必检查 <strong>API 密钥是否已启用</strong></p> 比 <p>请务必检查 <b>API 密钥是否已启用</b></p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill8272" title="anything-to-html"><img
src="https://img.php.cn/upload/skill/000/000/081/179195588450431.jpg" alt="anything-to-html" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill8272" title="anything-to-html" class="overflowclass">anything-to-html</a>
<p class="overflowclass">将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。</p>
</div>
<a rel="nofollow" href="/xiazai/skill8272" title="anything-to-html" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div> 更利于自动化处理。
避免用 <div> 和 <code><span></span> 模拟标题或段落
<div> 是无语义容器，<code><span></span> 是无语义行内容器。它们没有结构含义，不能替代 <h2></h2> 或 <p></p>。强行用 <div class="title"> + CSS 控制字号，会让屏幕阅读器读作“普通文本”，跳过标题导航快捷键（如 JAWS 的 H 键遍历）。
<p>典型误用场景：</p>
<p>• 把整个文章正文包进一个 <code><div class="content">，却不使用 <code><article></article> 或正确标题层级
• 用 <span style="font-size: 1.5em;"></span> 冒充 <h3></h3>
• 在 <li> 里嵌套 <div> 而非直接放 <code><p></p> 或 <strong></strong>
这类写法在视觉上可能“看起来对”，但会切断机器可读性链路，且不利于长期维护。
标题与 <section></section> 的嵌套关系要对齐内容粒度
<section></section> 不是“多加一层 div”，而是表示一个有独立主题、可被单独引用或复用的内容块。每个 <section></section> 应该自带一个标题（<h2></h2> 或更高级别），且该标题就是本区块的语义起点。
例如文档中“环境准备”“代码示例”“常见错误”三个部分，各自用 <section></section> 包裹，并以 <h2></h2> 开头。而“常见错误”内部再分“网络超时”“权限拒绝”，就该用 <h3></h3>，且仍保留在同一 <section></section> 内。
容易忽略的一点：不要把广告、侧边栏、页脚塞进主 <article></article> 或 <section></section> 里——它们不属于同一语义单元，应放在 <aside></aside> 或 <footer></footer> 中独立管理。
