写在前面
我刚开始自学前端的时候，是听的燕十八老师的8小时学会HTML网页开发。这个对于零基础的人来说，真的是一个入门的好选择。当时感觉前端好简单的啊，都是div，然后就慢慢走上了前端这条不归路。由于是入门课程，加上视频教程也比较老了，所以当时视频里面在进行网页结构布局的时候，运用了大量的div元素，所以在很长一段时间内，任何的网页布局在我的眼睛里面都是一个个div。但是随着学习的深入，以及见识到更多的优秀的代码之后，我才逐渐意识到除了div很多更加适合的标签应该被我们在网页中应用。
是什么？
html语义化是什么呢？
这个我并没有找到官方的权威解释，对于这个概念，只代表我自己的理解。
html语义化是指：利用适合内容含义的标签，去构建网页布局，让代码更加正确的被理解。
举个例子，当我们在做一个网页的导航区域的内容的时候应该使用<nav>标签，而不是其他的标签。
好处？
那么我们为什么要语义化呢？
可能有的人就说了，为什么一定要多花记忆力去多记一些标签呢？div怎么了？罗老师都说过，又不是不能用！
又不是不能用
答案当然是可以用的，但是能用和好用就是两码事情了。做为一个有追求的前端，必须要追求更好用，而不仅仅是能用。
下面是语义化几个主要的优点：
- 可以更好的被搜索引擎捕获正确的信息，有利于搜索优化。
- 让网页的整体结构更加清晰，易读。
- 有利于团队以及后期的代码的维护。
举一些例子
用特定的标签包裹特定的元素，关于语义化可以从多个方面去分析，而我在此只是针对网页的布局方面的标签去举一些例子 。
-
<section>:表示文档中的一个章节 -
<nav>:表示只包含导航链接的章节 -
<article>:表示可以独立于内容其余部分的完整独立内容块 -
<aside>:表示与内容关联度较低的内容 -
<h1><h2><h3><h4><h5><h6>:表示六层文档标题。<h1>最大，<h6>最小 -
<header>:表示页面或者章节的头部，主要包括logo、页面标题、和导航等 -
<footer>:表示页面或者章节的尾部，主要包括版权信息、法律信息、相关网址等 -
<address>:表示联系信息的一个章节 -
<header>:表示文档中的主要内容
html的语义化，不仅仅包括网页布局方面，还有文字形式、嵌入内容以及交互元素等，这些在MDN上都有详细的介绍。总之，对于页面上的任何一个元素，都应该用最适合它的含义的标签去表达。
