HTML5标签订单

时间:2013-09-29 15:20:41

标签: html5 tags seo semantic-markup

您编写HTML5标签的顺序是否重要?

例如,导航可以在导航之前的标题或部分之前写入吗?

我会说是的,因为标签本身表明它不是订单。

有兴趣听听其他人的想法,特别是在搜索引擎优化方面。

2 个答案:

答案 0 :(得分:1)

主要结构标签(如html,head和body)需要始终按正确的顺序排列。但所有其他因素并不重要。您不应将您的网站内容放在head或html标记之前。将您的网站内容始终放在<body>...</body>部分。

在搜索引擎优化方面,最好的做法是用干净,正确的代码编写一个网站,并使用独特而优质的内容。

答案 1 :(得分:1)

  

可以在导航前的标题或部分之前写入导航吗?

是。这是HTML5的改进之一:感谢sectioning elements and the outlining algorithm,我们不再需要单独依赖标题了(参见下面的示例)。

但是,如果您不总是(如果适用)使用切片元素和header / footer,则在某些情况下顺序可能很重要(例如HTML 4.01中的情况)。< / p>

搜索引擎优化方面是一个完全不同的问题,一般无法回答,因为有无数的搜索引擎,他们可能每天都会改变他们的解释。一个更好的地方可能是Webmasters SE


以下示例创建相同的文档大纲:

<article id="example-1">
  <nav>…</nav> <!-- before the article heading -->
  <h1>My article</h1>
  <h2>Foo is great</h2>
  <p>…</p>
  <h2>Bar, too</h2>
  <p>…</p>
</article>

<article id="example-2">
  <h1>My article</h1>
  <nav>…</nav> <!-- after the article heading -->
  <h2>Foo is great</h2>
  <p>…</p>
  <h2>Bar, too</h2>
  <p>…</p>
</article>

相应的大纲是:

1. "My article" (article, h1)
  1.1 untitled (nav, no heading)
  1.2 "Foo is great" (implicit section; h2)
  1.3 "Bar, too" (implicit section; h2)

此示例创建了一个不同的文档大纲,但文档含义(或者更好,本质)是相同的:

<article id="example-3">
  <h1>My article</h1>
  <h2>Foo is great</h2>
  <p>…</p>
  <h2>Bar, too</h2>
  <p>…</p>
  <!-- article’s end --> <nav>…</nav>
</article>

大纲将是:

1. "My article" (article, h1)
  1.1 "Foo is great" (implicit section; h2)
  1.2 "Bar, too" (implicit section; h2)
  1.3 untitled (nav, no heading)

只要您不将nav嵌套在另一个切片元素中,它就会出现在article的任何位置。


除了header / footer和分段元素之外,顺序(好吧,内容顺序)当然也很有意义。

明显的例子:

<ol>
  <li>Foo</li>
  <li>Bar</li>
</ol>

<p>Then I danced.</p>
<p>Then I woke up.</p>

<h4>Noodle soup</h4>
<h3>Dreams</h3>