HTML语义化是什么？
在我们日常WEB开发中，通常会使用大量<div>去构造网站的整体结构，而HTML语义化就是根据内容结构，使用正确的语义元素，更方便于开发者的维护和阅读的形式去开发。
语义化的重要性
- 更加清晰的代码结构。
- 提升用户的阅读体验。
- 便于团队的开发和维护。
- 有利于不同设备的解析。
HTML5语义元素
- header：定义页面的头部区域。
- nav：定义页面的导航链接部分区域。
- main：定义文档的主要内容区块。
- article：定义页面独立的内容，它可以有自己的 header、footer、sections 等。
- section：表示文档中的一个区域，比如，内容中的一个专题组。
- aside：表示一个和其余页面内容几乎无关的部分。通常表现为侧边栏或嵌入内容。
- footer：定义最近一个章节内容或者根节点元素的页脚。
案例分析
在这里举个例子。
实际上，使用这种语义元素，不仅能让代码结构更加清晰，阅读起来也是一目了然。
如果，上述图片是大量的DIV元素构成，根据class语义化还能看懂，但是做最坏的打算，开发者连class语义都没描述清楚，我们下手去阅读代码将会变得极其困难。
总结
不得不说，HTML语义化在很大程度上规范了代码的合理性，但也有很多开发时根据自己的习惯去使用div+span语义化的类名对功能进行划分。同样，这些语义元素自带的样式在某些页面的布局中无法兼容。所以，合理的使用HTML语义化即可。
