一个页面只能有一个h1，因其代表文档唯一主题，重复使用会破坏语义结构、削弱可访问性并导致seo降权；h2至h6必须严格按顺序嵌套，跳级将破坏大纲逻辑，影响屏幕阅读器导航与lighthouse评分。

h1-h6 标签不是“加大字号的装饰工具”，而是 HTML 中定义内容语义层级的核心结构标签；搜索引擎和屏幕阅读器都依赖它们判断页面主次关系，滥用或跳级会直接削弱可访问性与 SEO 表现。

为什么一个页面只能有一个 h1

这不是浏览器限制，而是语义规范强制要求：h1 代表整个文档的唯一主题（类似论文的标题），重复使用等于告诉辅助技术“这篇文档有多个中心思想”。SEO 层面，Google 多次确认会将 h1 内容作为页面核心关键词信号之一，若出现两个 h1（比如模板里 header 固定一个、正文又写一个），算法可能降权或忽略其权重。

常见错误场景：

• CMS 模板中 <h1>{{site_name}}</h1> + 文章页又加 <h1>{{post_title}}</h1>
• 用 h1 包裹 logo 图片（应改用 <div role="banner"> 或语义化 <code><header></header>）
• 单页应用（SPA）路由切换后未动态更新 h1 文本，导致多个路由共用同一 h1

h2 到 h6 必须严格按顺序嵌套吗？

必须。跳级（如 h1 → h3）会破坏文档大纲（document outline），让屏幕阅读器用户无法线性理解内容结构，也影响 Lighthouse 等工具的可访问性评分。


Webflow SEO/GEO + API
在Webflow中管理SEO和GEO内容更新，使用GSC进行优先级排序，草拟内容，创建补丁JSON，通过API更新CMS，优化图片以及...
下载

实际开发中要注意：

• CSS 可以任意调整视觉大小，但语义层级不能靠 h4 显示得比 h2 大来“假装重要”
• Markdown 渲染器（如 remark）默认把 ## 转成 h2，若原始文档从 ### 开始，需手动补全上层标题或配置插件修正
• 服务端渲染（SSR）中，h2 出现在 h1 之前属于严重结构错误，会被 Chrome DevTools 的 “Accessibility” 面板标为「Heading order」问题

SEO 权重真的随 h1 > h2 > h3 递减吗？

权重差异存在，但不是线性衰减，更不是“用了 h6 就没 SEO 效果”。真实影响逻辑是：

• h1：强信号，关联页面整体主题，关键词匹配度高时提升首页排名
• h2：中等信号，常用于区块标题，帮助 Google 理解内容模块划分（如“价格”、“参数”、“售后”）
• h3–h6：弱信号，主要作用是支撑内容结构，对长尾词有一定锚点价值，但单独优化意义极小
• 所有标题内含关键词 ≠ 自动提升排名；若 h2 堆砌关键词（如 <h2>北京SEO优化公司_北京SEO外包_北京SEO代运营</h2>），反而触发 spam 惩罚

用 CSS 替代 h1–h6 可行吗？

不可行。仅用 <div class="title-lv1"> + CSS 设置字体大小/粗细，等于主动放弃语义化： <ul> <li>屏幕阅读器不会将其识别为标题，用户无法用快捷键（如 NVDA 的 H 键）跳转</li> <li>Google 的 Page Experience 报告中，“Missing heading elements” 会直接扣分</li> <li>部分 CMS（如 WordPress Gutenberg）在编辑器中禁用非语义标题，强制使用块级标题组件</li> <li>真正需要自定义样式时，应保留 <code>h1–h6 标签，再用 CSS 覆盖默认 margin/font-size 等，例如：

h1 { font-size: 2.5rem; margin: 0 0 1rem; }

最容易被忽略的一点：现代框架（React/Vue）中动态生成标题时，h1 的存在与否、文本是否随数据实时更新，比“用了几个 h2”更重要——结构完整性永远优先于数量堆砌。