语义化html标签是seo核心，必须唯一且包裹主体内容，/影响权重分配，标题层级须严格递进，+提升图片seo，标签须匹配真实内容结构。

搜索引擎爬虫不“看”页面，它解析标签名和嵌套关系来推断内容角色。用一堆 <div> 套来套去，等于交出一张没标注的地图；而 <code><main></main>、<nav></nav> 这类语义标签，是直接告诉爬虫“这里是什么”。

为什么 <main></main> 不是可选，而是必须

Google 移动优先索引已 100% 启用，<main></main> 是它识别“用户真正该看到的内容”的核心信号。没有它，爬虫可能把页脚的友情链接或侧边栏广告块当作主内容抓取。

• 每个页面有且仅有一个 <main></main>，不能嵌套在 <article></article> 或 <section></section> 内部
• <main></main> 里不要放导航、页脚复制品、登录框等非主体内容
• 若页面含多个独立文章（如博客列表页），<main></main> 应包裹整个列表，每篇用 <article></article> 单独封装

<header></header> 和 <footer></footer> 的作用被严重低估

它们不只是视觉区域划分——<header></header> 内的 <h1></h1> 自动获得最高权重，<footer></footer> 中的链接默认被降权处理，这是爬虫内置规则。

• <header></header> 必须包含至少一个标题级元素（<h1></h1>–<h6></h6>），否则部分爬虫会忽略其语义
• 页面级 <header></header> 和文章级 <header></header> 可并存，后者应放在 <article></article> 内部
• <footer></footer> 不该塞进版权声明以外的导航链接，否则干扰主内容权重分配

标题层级错乱比不用语义标签更伤 SEO

跳级（<h1></h1> → <h4></h4>）、重复 <h1></h1>、把 <h2></h2> 当样式用，都会让爬虫误判内容树结构，导致关键词上下文丢失。

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

• 每个页面只允许一个 <h1></h1>，且必须精准匹配页面主题词（如“HTML语义化SEO实践”，而非“欢迎光临”）
• <h2></h2> 对应一级内容模块，建议控制在 3–5 个/页；<h3></h3> 以下只用于真正有子层级的段落，不用于按钮、图标容器
• 避免用 CSS 隐藏标题却保留标签（如 display: none 的 <h2></h2>），爬虫可能视作作弊信号

<figure></figure> + <figcaption></figcaption> 是图片 SEO 的隐藏开关

单纯加 alt 属性只能让爬虫“知道图里有什么”，但加上 <figure></figure> 容器和 <figcaption></figcaption> 描述，等于给图片打上结构化标签，触发图文联合分析。

• 信息图、代码截图、数据图表等有意义图片，必须用 <figure></figure> 包裹，<figcaption></figcaption> 里写清用途（例：<figcaption>图：<code><article></article> 标签在 Chrome 中的实际渲染效果）
• 装饰性图片（分割线、背景纹理）设 alt=""，否则爬虫会尝试索引不存在的内容
• 避免把 <img> 直接扔进 <p></p> 或 <div> —— 没有容器语义，<code>alt 文本权重会大幅衰减

  最常被忽略的点：语义标签必须配合真实内容结构使用。用 <article></article> 包住一段纯 JS 渲染的空白 <div>，等于贴了个假标签——爬虫拿到的是空容器，语义彻底失效。</div>