Question

我还在努力让自己熟悉HTML5，而且这些东西让人觉得有些混乱....

我曾在Jeremy Keith's book和HTML5 Doctor（通过this question）阅读，其中说HTML5可以使用多个h1。在HTML5中，每个部分都可以有自己的标题元素，因此可以有多个h1。我见过一个Wordpress主题框架，"underscores"，似乎最充分地应用了它。

但是，在定义网站结构/文档大纲时，这可能会对旧浏览器（尚未支持HTML5）造成问题。此外，它也为SEO带来了问题。

我偶然发现了Matt Cutts's (from Google) video并重新阅读了Keith的书，该书建议限制使用h1并使用传统的文档大纲（每页仅使用一个或两个h1，然后多个h2，h3等）。 Matt Cutts也暗示多个h1对SEO不太好。

然而，

我之前从未认真关注网站结构/文档大纲。所以我永远不知道有多旧的浏览器（HTML5之前版本）读取网站结构/文档大纲。存在HTML5 outliner，但我找不到HTML4的大纲。
Matt Cutts的视频（关于HTML5和SEO）发布于2009年。我不知道Google是否已经支持新的HTML5概述方式文档。

所以我的问题是，如果我想：

支持较旧的浏览器（例如Firefox 3.0和IE 6）以显示正确的网站结构/文档大纲
在SEO中取得好成绩

我应该使用哪一个：多个h1 s（在HTML5中完成的方式）或传统方式？

此HTML5版本（取自HTML5 Doctor的示例）：

<h1>My fantastic site</h1>
<section>
  <h1>About me</h1>
  <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p>
  <section>
    <h1>What I do for a living</h1>
    <p>I sell enterprise-managed ant farms.</p>
  </section>
</section>
<section>
  <h1>Contact</h1>
  <p>Shout my name and I will come to you.</p>
</section>

还是传统方式？

<h1>My fantastic site</h1>
  <h2>About me</h2>
  <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p>
    <h3>What I do for a living</h3>
    <p>I sell enterprise-managed ant farms.</p>
  <h2>Contact</h2>
  <p>Shout my name and I will come to you.</p>

Answer 1

使用新格式。很多人会使用h3或h2 s，这也很好。

事实上，他们会使用html5提供的section或article或header或footer元素，然后使用h3或{{ 1}}作为该文档片段的标题（因为害怕SEO惩罚/遗留样式|布局怪癖）。

那也很好。

如果您再次观看Cuts'视频，他说要将h4使用保持在最低限度 - 只有在真正有保证时才使用倍数。

此时并没有真正改变。

谷歌不会因为倍数而谋杀你。 Google IS希望每个人都意味着内容发生了根本性的变化。

无论你是否有分段（h1 / section / etc）元素，都是如此。

谷歌已经达到了这样的程度：他们正在适当地使用仅限AJAX或依赖JavaScript的网站，并拥有自己的内容丰富的元数据系统...... ......它们非常复杂，可以解析{{ 1}}或article。

更多关注内容的质量，如果您准备好接受它，那么他们用于搜索结果的特定于Google的元数据等...... ...让谷歌担心导航语义（只要你使用它们，而不是做任何阴暗的事情）。

小型爬虫，谁知道......但这是基于每个爬虫的，大多数人只需要关注谷歌和必应和雅虎，其他爬虫要么从谷歌出来，要么非常特定于域名（如果您想因某种原因在选择加入，租车的爬虫上排名很高......那么您应该提供某种类型的XML / JSON Feed）。< / p>

Answer 2

死锁，你的第二个例子不包含任何切片元素。但是，您可以使用标题为h1以外的标题元素。我认为这就是你的问题所在：

每个分区元素

h1

<section>
  <h1>…</h1>
  <section>
    <h1>…</h1>
  </section>
</section>

或“计算”标题级别

<section>
  <h2>…</h2>
  <section>
    <h3>…</h3>
  </section>
</section>

在语义上/技术上，它们是相同的。

搜索引擎优化应该不是问题，因为“h1无处不在”将在整个网络中使用（并且已经存在），主要搜索引擎都知道这一点。如果他们想要支持HTML5，他们必须了解概述算法。我敢打赌，他们的抓取工具/ API已经正确计算了实际的标题级别，例如HTML5 outliner。

您希望使用h2 - h6作为分区元素标题的唯一原因是旧的辅助功能软件，例如：屏幕阅读器。它们通常提供轮廓菜单，因此用户可以直接跳转到某个标题。因此，如果您始终使用h1，则不知道HTML5的旧版屏幕阅读器会将所有标题声明为h1，因为它们不会计算正确的大纲级别。然而，例如Jaws 13（屏幕阅读器的当前版本），只有“h1无处不在”才能在IE中正确显示HTML5 AFAIR，如果您使用它会感到困惑HTML5页面中的其他标题级别。当然，这是一个错误，但这是一个很好的例子，坚持“旧方式”并不总是适用于较新的软件。

所以可能会以任何方式出现问题。

在我看来，你应该坚持使用HTML5规范推荐的内容，这将是：对所有切片元素标题使用h1。因为此规范是未来用户代理，可访问性工具，搜索引擎和其他服务/软件用于构建其产品的。

但是，当然，这取决于您的使用案例。如果您了解访问者统计信息，则应使用它们为特殊情况做出正确的决定。例如。如果您的网站将来不会存在多年，请使用 now 最佳支持。

Answer 3

最好的方法是使用HTML5并使用此链接使其在旧版浏览器中工作，因为Google已经准备好了您的网站，并考虑使用新技术（以便您的网站更好），如果您使用新标签

 <!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

将它放在您网站的head部分，它适用于旧的IE版本

正确使用h1的方法？（关于文件大纲和SEO）

3 个答案:

正确使用h1的方法？ （关于文件大纲和SEO）

3 个答案:

正确使用h1的方法？（关于文件大纲和SEO）