这个问题在这里已有答案：
为什么使用像headers，section，nav和article这样的HTML5语义标签而不是简单的div和首选的css呢？
我创建了一个网页并使用了这些标签，但它们与div没有什么区别。他们的主要目的是什么？
是否仅在使用标签时使用适当的标签名称或更多？
请解释。我经历了很多网站，但我找不到这些基础知识。
正如他们的名字所说，这仅用于语义目的。它用于改进文档的自动处理。自动处理的发生频率超出您的意识 - 从搜索引擎排名的每个网站都源自所有网站的自动处理。
如果您访问网页，您作为人类读者可以立即（直观地）区分所有页面元素，更重要的是了解内容。
然而，机器是愚蠢的，不能这样做：想象一个网络爬虫或屏幕阅读器试图分析你的网页到处都是div。他们怎么知道你想要成为导航或主要文章的文件的哪一部分，或者一些不那么重要的旁注？他们可以通过使用一些通用标准分析您的文档结构来猜测，这些标准是特定元素的提示。例如。 ul内部链接列表很可能是某种页面导航。但是，如果使用nav元素，机器会立即知道该元素的用途是什么。
示例：作为用户（在没有看到实际标记的情况下读取页面），您不关心元素是否包含在<i>或<em>标记中。可能在大多数浏览器中它将被渲染为斜体文本，只要它突出文本以便轻松识别它，你就可以了。
然而，在语义方面存在更大的差异：<i>仅仅意味着斜体 - 它是浏览器的表示提示，并不一定包含更深层次的语义信息。然而，<em>意味着强调，它在语义上表示一个重要的信息。现在浏览器不再受斜体指令的约束，但可以用斜体或粗体或下划线或不同的颜色呈现它......对于视障人士，屏幕阅读器可以提高声音 - 无论哪种方法最适合于强调这一重要信息的具体情况。
// machine: okay, this structure looks like it might be a navigation element?
<div class="some-meaningless-class"><ul><li><a href="internal_link">...</div>
// machine: ah, a navigation element!
<nav class="some-meaningless-class"><ul><li><a>...</nav>
关于HTML5Doctor的HTML5语义有一篇很好的小文章。
语义已经以某种形式成为HTML的一部分。它可以帮助您了解页面上发生的情况。
早在<div>用于几乎所有的东西时，我们仍然通过给它一个“语义”类名或id名来实现语义。
这些标签有助于正确构建和理解布局。
如果你这样做，
<div class="nav"></div>
相反，
<nav></nav>
要么
<div class="sidebar"></div>
相反，
<aside></aside>
没有什么不对，但后者有助于为您以及爬虫，读者等提供更好的可读性。
在div标签中，你必须给出一个id，告诉它持有什么样的内容，包括正文，页眉，页脚等。
在HTML5的语义元素的情况下，名称清楚地定义了它所持有的代码类型，并且它是针对网站的哪个部分。
语义元素是<header>，<footer>，<section>，<aside>等。