html5——语义化标签总结

什么是语义化标签？

语义化标签是表示一些特定区域的标签。

为什么要用语义化标签？

（1）使用语义化标签可以使页面引用的css文件未加载出来时，页面仍然可以保持一定的结构样式，不至于过于混乱。

（2）使用语义化标签有利于爬虫读取信息，帮助爬虫获取更有效的信息，比如浏览器搜索的时候，就可以根据header标签的内容来判断与要查找的内容的相关性，以此来决定信息的排列。

（3）便于维护人员的理解，降低维护的难度。

常用的语义化标签有哪些？

（1）header元素

header元素代表网页或section的页眉，通常包括网站logo、主导航、全站链接以及搜索框。包含了h1~h6以及hgroup，网页上header可以有多个，给每一个内容块都加上header元素。

注意：倘若header元素非必要，仅仅h1~h6和hgroup就可以完成功能，就没必要强行使用header标签了。

（2）footer元素

footer元素代表网页或section的页脚，除了包含的内容与header不一样之外，其余与header标签一样。

（3）nav元素

nav元素是页面的导航链接区域，但是并不是所有的链接都要存放在nav中，将主要的链接存放进来就可以了。

（4）hgroup元素

hgroup元素是存放标题的区域，如h1~h5这些标题元素。

当使用多个连续的标题元素的时候，再使用hgroup元素。

（5）aside元素

aside元素是用于存放附属消息的区域，在article内表示主要元素的附属消息，在article内以侧边栏的形式展现。

（6）article元素

article元素是一块相对独立的区域，用于存放一些自成一体的内容。

相对独立的情况下用article，与外部其他元素有关联用section，没有语义的话用div。

（7）section元素

section元素代表文档中的各个部分。