1.语义化标签出现背景

过去我们常常采用DIV+CSS 的方式布局页面，但DIV 标签本身没有独特的含义，这样做的结果就是文档结构不够清晰，不利于浏览器对页面的读取，在分离CSS样式后，用户体验不友好。

所以HTML5 新增了很多语义化标签，使文档更具可读性，页面结构更清晰。

2.什么是HTML语义化标签？

语义化标签，就是让标签有自己的含义，利用本身传达它所包含内容的一些信息，使浏览器和搜索引擎直观地认识标签和属性的用途。

(资料图片仅供参考)

3.为什么要用语义化标签？

代码结构清晰，可读性高，减少差异化，便于团队开发和维护。

在页面没有加载CSS的情况下，也能呈现良好的内容结构，提升用户体验。

对搜索引擎友好即利于seo，良好的结构和语义，有助于爬虫抓取更多的有效信息。

4.HTML5语义化标签有哪些？

header 标签： 页眉，通常包括网站标志、主导航、全站链接以及搜索框

nav 标签：标记导航，仅对文档中重要的链接群使用

main标签：页面主要内容，一个页面只能使用一次

article标签：用来定义独立于文档且有意义的来自外部的内容

section标签：定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。

aside标签：定义article标签外的内容，可用作文章的侧边栏

footer标签：页脚，只有当父级是body时，才是整个页面的页脚。

等等……