概念

HTML 中的语义化就是指每一个 HTML 元素都有具体的含义。

其实 HTML 的每一个元素，浏览器都给他设置了一些默认样式，比如 p 元素是段落，读者如果写一个 p 元素会发现其自带上下边距，这些其实都是浏览器默认的 CSS 样式，我们是可以自己改的，换句话说，哪怕现在这是一个 p 元素，我也可以通过 CSS 样式把它变成 a 元素的样式，这样就会导致一些问题，既然所有元素都可以随便修改其样式，那么这么多元素看起来种类很多，但只需要一个元素就够了，确实，理论上来说，只需要一个元素就可以构成整个网页，但是我们不会这么干，我们不同的结构也要使用不同的元素，例如我要一个列表就用 li 元素，要用段落就用 p 标签，如此。

说得再详细一点，其实现在我们要的是结构样式分离，HTML 就是用来干结构，CSS 就是用来干样式，也就是说一个东西它只要是 p 标签，那么他不管长什么样，他应该是一个段落，哪怕我可以用 CSS 把它的样子给他搞成和标题一样，他也依旧是一个段落。也就是说我们应该根据内容来选择元素，而不是通过样式来选择元素，什么意思呢，我使用 h1 标签是因为我需要一个标题，而不是因为我需要一个加大加黑的字体。

为什么需要语义化

语义化主要是为了让搜索引擎和浏览器能读懂你的结构，什么意思呢，首先，搜索引擎会爬取你的网页数据，他爬取到的就是你的网页源代码，如果你的语义化做得很好，那么这个搜索引擎是可以读懂你网页意思的，搜索引擎就可以知道你这个网站是干嘛的，从而做一些相应推荐。同时，语义化还可以让浏览器读懂你的代码，比如浏览器的阅读模式，就可以通过语义化标签来找出主要内容，从而屏蔽其他内容进入阅读模式。