推荐使用HTML5语义化标签因其能提升网页可读性、可访问性和SEO效果。1. 语义化标签如header、nav、article明确表达内容角色，使代码更有意义；2. 提升SEO，搜索引擎更易识别重点内容；3. 增强可访问性，屏幕阅读器可快速定位导航与主内容；4. 便于团队协作，结构直观利于新人理解；5. 减少class滥用，避免冗余写法。header用于页面或区块头部，可包含标题、logo、导航等，一个页面可有多个，适用于介绍性内容。footer用于底部区域，可放置版权信息、联系方式等，同样支持多个实例，应关注语义而非仅视觉布局。配合nav、main、section等标签，整体结构更清晰，有利于长期维护与优化。
使用HTML5语义化标签能提升网页的可读性、可访问性和SEO效果。相比用div加class的方式，语义化标签明确表达了内容的角色和结构，让浏览器、开发者和辅助工具更容易理解页面布局。
为什么推荐使用HTML5语义化标签？
语义化标签让HTML代码更有意义。比如，header表示页眉，nav代表导航，article指独立内容块。这种清晰的结构带来几个实际好处：
- 提升SEO：搜索引擎更容易识别页面重点内容，有助于排名
- 增强可访问性：屏幕阅读器能根据语义标签快速定位导航、主内容等区域
- 便于团队协作：代码更直观，新成员能快速理解页面结构
- 减少class滥用：避免出现像div class="header"这类冗余写法
Header标签的正确用法
header元素用于定义页面或区块的头部区域，通常包含标题、logo、搜索框或导航链接。它可以出现在页面级，也能用于文章或章节内部。
- 一个页面可以有多个header，比如页面顶部一个，每篇文章也有自己的header
- 常见内容包括h1-h6标题、logo图片、作者信息、发布日期等
- 不要把header当成通用容器，它只用于“介绍性”内容
网站标题
Footer标签的正确用法
footer代表页面或内容区块的底部，常用于放置版权信息、联系方式、相关链接或隐私政策。
立即学习“前端免费学习笔记（深入）”；
- 和header一样，一个页面可以有多个footer，例如页面整体底部一个，每篇博客文章下方也可有自己的footer
- 适合放版权说明、作者信息、返回顶部链接、备案号等内容
- 不要用footer做页面最外层的底部样式容器，应关注其语义而非视觉位置
基本上就这些。合理使用header和footer，配合nav、main、section等其他语义标签，能让HTML结构更清晰，长期来看对维护和优化都有帮助。
