你了解语义化吗？

什么是语义化

语义化顾名思义就是让人一眼就可以看出每个标签的含义与作用。现在有很多人，铺页面使用大量的div+css。然而div是没有任何意义的，全靠css来支撑页面显示效果。如果使用h1标签，它是有意义的，它代表了一级标题，标签内容是加粗的。

除了前几篇文章介绍过的标签外，还有一些与页面结构相关的语义化标签。

1. header 页眉通常包括网站标志、主导航、全站链接以及搜索框
2. nav 标记导航，仅对文档中重要的链接群使用
3. main 页面主要内容，一个页面只能使用一次
4. article 定义外部的内容，其中的内容独立于文档的其余部分
5. section 定义文档中的节。比如章节、页眉、页脚或文档中的其他部分
6. aside 定义其所处内容之外的内容。如侧栏、文章链接、广告、相关产品列表等
7. footer 页脚，只有当父级是body时，才是整个页面的页脚

怎样确定页面是否语义化

将css去掉，如果页面结构清晰，内容正常显示，那么就可以认为页面已经语义化了。

语义化有什么作用

1. 易于阅读，如果样式丢失，也会显示清晰的结构
2. 易于维护，更具可读性
3. 易于seo，有利于根据标签来确定权重

根据我的经验，铺页面时，尽量减少div和span标签的使用，就可以达到不错的语义化效果。单单是使代码更具可读性这一条优点，就足以令语义化成为铺页面时不可或缺的一部分了。