h1至h6标签用于构建页面的逻辑结构而非视觉样式，h1代表页面核心主题且应唯一，位于内容前端；h2作为h1的子级划分主要章节，保持并列关系；h3到h6逐级细分内容，不可跳跃层级，语义需一致，深度建议不超过h4；正确使用标题层级可提升SEO、可访问性及维护性，使结构如目录般清晰连贯。
HTML标题的语义化核心在于准确表达内容的结构层次，h1到h6标签不是为了视觉大小而存在，而是为文档建立清晰的逻辑框架。正确使用这些标签能让搜索引擎、屏幕阅读器和开发者更好理解页面重点。
h1代表页面核心主题
每个页面只应有一个h1，它说明当前页的最主要目的或内容。比如文章页的h1是文章标题，产品页的h1是产品名称。这有助于搜索引擎判断页面主题，也方便视障用户快速定位页面核心。
- 避免用多个h1来“强调”不同内容
- 不要仅因样式需要而降级h1为h2
- 确保h1出现在内容区域靠前位置
h2用于主要章节划分
h2是h1的直接子层级，代表页面中的大块内容模块。一篇长文可将“背景介绍”“问题分析”“解决方案”设为h2。导航栏、侧边栏等非主内容区一般不使用h2。
- 一个h1下可有多个h2
- 保持h2之间的逻辑并列关系
- 避免跳过h2直接使用h3
h3到h6逐级细分内容
从h3开始用于嵌套结构，h3属于某个h2的子节，h4属于h3的子节，以此类推。实际使用中很少用到h5和h6，通常表示非常细节的分项。
立即学习“前端免费学习笔记（深入）”；
- 层级不可跳跃，如不能在h2后直接用h4
- 同一层级应保持语义一致，比如都是小节标题
- 深度建议不超过四级（h4），否则结构过于复杂
语义化带来的实际好处
合理的标题结构不只是代码规范，它直接影响可访问性和SEO效果。屏幕阅读器用户可通过标题快速跳转，搜索引擎据此构建内容图谱。
- 提升页面在搜索结果中的片段展示质量
- 增强网页对辅助技术的友好性
- 便于后期维护和内容重构
基本上就这些。标题层级要像书籍目录一样自然连贯，不靠CSS视觉欺骗，也不为装饰滥用。结构清晰了，语义自然就到位了。
