html - HTML 5：使用标签或类=“标题”

Question

HTML 5 引入了新的语义标签，包括页眉和页脚。但我很困惑我应该使用什么，为什么？直接使用header标签或者给class="header"。哪个更好，为什么？

标签： html

Answer 1

使用<header>和那些语义标签。

为什么？因为它们是有意义的，更容易阅读。

例如，考虑

<header id="article-header>
  ...
</header>

和

<div id="article-header" class="header">
  ...
</div>

如您所见，第一个更短，更易于阅读。

根据Inbound now，语义标签在 SEO 方面也更好。

---

此外，这个和这个问题有有趣的答案

---

编辑：

我从MDN引用这个：

编写语义标记的一些好处如下：

1. 搜索引擎会将其内容视为影响页面搜索排名的重要关键字（参见 SEO）
2. 屏幕阅读器可以将其用作路标，以帮助视障用户浏览页面
3. 查找有意义的代码块比搜索带有或不带有语义或命名空间类的无尽 div 要容易得多
4. 向开发人员建议将要填充的数据类型
5. 语义命名反映了正确的自定义元素/组件命名

此外，我很久以前在某处读过语义标签用于定义文档的轮廓，divs 更适合像框样式这样的视觉切片（我现在无法找到源代码）。