2、HTML5 新元素：结构、语义与应用指南

HTML5 新元素：结构、语义与应用指南

1. HTML5 结构元素概述

HTML5 中的新元素旨在反映开发者实际的使用情况。使用结构元素不仅能让标记更具语义性，还能定义文档的主要地标，这对于屏幕阅读器用户和使用键盘导航的人来说非常重要，他们可以借此跳过页面的不同区域。此前，我们通过“跳过链接”和快捷键来实现这一功能，而 HTML5 则建立了正式的地标元素。不过截至目前，还没有浏览器或辅助技术将这些结构元素用于导航目的。

2. 何时使用结构元素

• header 元素 ：大多数网站都有一个被视为“头部”的区域，包含 logo、公司名称和标语等，这种情况就适合使用 header 元素。此外，文档中的部分或侧边栏如果有自己的标题和导航，使用 header 也完全合适。
• footer 元素 ：大多数页面都有适合新 footer 元素的内容，如作者信息、版权声明和相关信息等。不仅页面底部，部分、文章和侧边栏也可以包含这些信息，因此也可以使用 footer 元素。
• nav 元素 ：网站上可能有很多链接组，有些用于导航，有些是外部链接。但 nav 元素仅适用于主要的网站导航，不适用于搜索结果链接或博客列表。

3. 何时使用 div 元素

虽然新的结构元素可以取代许多非语义的容器 div 元素，但 div 元素在 HTML5 中仍有其用武之地。如果只是为了样式目的需要一个容器元素，那么应该使用 div 元素，而不要为了给 CSS 提供钩子而使用新的结构元素，因为这