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