为什么HTML5头元素需要一个h标记？_Html_Semantic Markup_Seo

为什么HTML5头元素需要一个h标记？

html seo

为什么HTML5头元素需要一个h标记？,html,semantic-markup,seo,Html,Semantic Markup,Seo,根据HTML5Doctor.com和其他HTML5入门网站的说法，header元素应该包含h1-h6标签以及其他导航或入门内容。然而，在大多数网站上，传统的“标题”只包含一个徽标和一些导航元素包括Facebook和Twitter在内的许多主要网站都使用h1标签作为其徽标，这在我看来似乎不合逻辑，因为徽标不是页面上最重要或信息量最大的元素 95%的网站的内容部分会出现h1标签，而不是标题部分。那么为什么我们要在标题中包含一个h标记呢？如果我们必须这样做，为什么Facebook和Twitter不使

根据HTML5Doctor.com和其他HTML5入门网站的说法，header元素应该包含h1-h6标签以及其他导航或入门内容。然而，在大多数网站上，传统的“标题”只包含一个徽标和一些导航元素

包括Facebook和Twitter在内的许多主要网站都使用h1标签作为其徽标，这在我看来似乎不合逻辑，因为徽标不是页面上最重要或信息量最大的元素

95%的网站的内容部分会出现h1标签，而不是标题部分。那么为什么我们要在标题中包含一个h标记呢？如果我们必须这样做，为什么Facebook和Twitter不使用h6标签呢？

不要被“应该”包含和“必须”包含搞混了。您不需要在标题中包含任何不需要的内容，但标题的“语义”目的是在文档的标题处查找和放置这些内容。正如您在打印页面顶部查找标题、简介或目录一样。

您应该查看

您可能希望您的站点标题/徽标为

h1

设想一个小网页，由一个页眉（徽标、站点名称等）、一个站点导航和一个博客条目（此页面的主要内容）组成：

好多了！页面大纲现在看起来像：

ACME公司

站点导航

同侧眼睑

但它仍然不是完美的：它们都在同一个层次上，但“ACME Inc.”是所有网页形成一个网站的原因，这就是为什么会有网页。导航和博客条目是“ACME Inc.”的一部分，代表公司和网站本身

因此，我们应该将导航和博客条目标题从

h1

更改为

h2

：

<body>
 <!-- not using sectioning elements, for the sake of the example -->

 <header>
  <h1>ACME Inc.</h1>
 </header>

 <div class="navigation">
  <h2>Site navigation</h2>
  <ul>…</ul>
 </div>

 <div class="content">
  <h2>Lorem Ipsum</h2
  <p>…</p>
 </div>

</body>

轮廓保持不变。我们甚至可以将

h2

（在

nav

和

文章

）更改回

h1

，大纲也将保持不变

如果您不想为导航设置“显式”标题，您可以随意删除它：轮廓保持不变（现在为

nav

设置了隐式/未命名”标题）。每个部分都有一个标题，无论您是否添加它

您甚至可以将

标题中的h1
更改为h6
，但它不会更改大纲。您可以将此标题视为“正文的标题”
附加说明

这些示例中不需要标题
元素。我添加它只是因为你在问题中提到了它
如果您想使用徽标而不是文字名称（“ACME Inc.），则仍应使用h1
，并将img
作为子项添加。alt
属性的值应该给出名称
顶层标题不必是“页面上最重要或信息量最大的元素”。这不是标题的用途。它们给出结构/大纲，并“标记”其范围内的内容。在本例中，您可以假设文章
（标题在里面）是最重要的内容
如果每次需要时都使用剖切元素，则不再需要h2
…h6
（但为了清晰或向后兼容，您可以自由使用它们）
您可以使用HTML大纲视图（它有一些未修复的错误）对一些标记结构进行测试
这是一个灵活但重要的SEO和基本HTML编程概念。虽然这个标准还有一些回旋余地，但它不会影响你的网站
例如，您提到Facebook的标题中有徽标而不是H1。这是正确的一半，因为它们的标题在一对h1标记中，使其功能基本上与任何其他h1文本相同：

但我永远不会在页眉中查找网页的标题。我不相信有人会，永远不会。h1始终位于内容部分。标题包含徽标、标记行和导航。@Moppy-然后您需要阅读W3C规范中的内容：我应该做什么？我不知道为什么我觉得这一切如此混乱。我的页面结构如下：
。据我所知，我可以在
显式部分重用
。然而，MDN建议您永远不要使用多个
，然而在我看来，站点导航中的所有
元素都是平等的？MDN的例子是使用
。这是正确的吗？你能再详细说明一下吗？@Anthony:这听起来像是一个单独的问题，应该在它自己的问题中提出。简而言之，nav
中的单个链接不能是标题的一部分；如果您愿意，整个nav
可以得到一个标题（或者多个标题，如果nav中有某种结构的话）——它可以是h1
，但是（主要是为了向后兼容）最好使用计算出的秩的标题，即在这种情况下是h2。
<body>
 <!-- not using sectioning elements, for the sake of the example -->

 <header>
  <h1>ACME Inc.</h1>
 </header>

 <div class="navigation">
  <h1>Site navigation</h1>
  <ul>…</ul>
 </div>

 <div class="content">
  <h1>Lorem Ipsum</h1>
  <p>…</p>
 </div>

</body>

<body>
 <!-- not using sectioning elements, for the sake of the example -->

 <header>
  <h1>ACME Inc.</h1>
 </header>

 <div class="navigation">
  <h2>Site navigation</h2>
  <ul>…</ul>
 </div>

 <div class="content">
  <h2>Lorem Ipsum</h2
  <p>…</p>
 </div>

</body>

<body>

 <header>
  <h1>ACME Inc.</h1>
 </header>

 <nav>
  <h2>Site navigation</h2>
  <ul>…</ul>
 </nav>

 <article>
  <h2>Lorem Ipsum</h2
  <p>…</p>
 </article>

</body>