h1到h6本质是语义层级而非字体大小开关，h1为页面唯一核心主题，h2、h3等逐级递降构成逻辑结构；跳级或乱序会破坏SEO与无障碍访问，CSS应替代已废弃的align属性。
h1到h6本质是语义层级，不是字体大小开关
它们的区别不在“哪个更大”，而在于“哪个更重要”。h1代表整个页面唯一的核心主题，h2是它的直接子模块，h3再往下拆解——就像一本书的“书名→章节→小节→要点”，跳级或乱序会破坏结构逻辑。
- 视觉大小只是浏览器默认样式，可被 CSS 完全覆盖；但语义层级一旦写错，屏幕阅读器、搜索引擎和开发者工具就无法正确解析文档骨架
- 不要用
h3去“凑大字号”：需要加粗放大？用+ CSS 更干净h1在整页中应仅出现一次（HTML5 的内可另起一个h1，但需谨慎，多数 CMS 和 SEO 工具仍按传统单h1解析）SEO 和无障碍访问依赖严格层级顺序
Google 和 NVDA 屏幕阅读器都按
h1→h2→h3… 的嵌套关系建立内容地图。如果从h1直接跳到h4，相当于在目录里漏掉章、节、小节，只留一个“条款编号”，机器既难索引，用户也难导航。- 常见错误：
产品介绍
功能亮点
功能亮点
- 关键词要自然融入标题文本，比如
响应式网页设计入门指南
网页设计 HTML5 CSS3 响应式 入门
- 检查工具推荐：Lighthouse 的 “Accessibility” 报告、axe 浏览器插件，能直接标出跳级或缺失
h1的问题
CSS 替代 align 属性是强制要求，不是建议
HTML5 已彻底移除
h1～h6的align属性。写标题
- 居中标题请用：
h2 { text-align: center; } - 若需不同标题共用同一对齐方式，推荐定义类名：
，避免重复声明 - 注意：CSS 中
text-align控制的是**行内内容对齐**，如需整体块级居中（比如让h2在容器中水平居中），还需配合margin: 0 auto或 Flex 布局
真实项目中最容易被忽略的细节
不是“会不会用”，而是“是否持续校验”。很多团队上线后才发现首页
h1被 CMS 模板自动塞了网站名，正文主标题被迫降为h2，导致 SEO 权重分散。立即学习“前端免费学习笔记（深入）”；
