9

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

我曾经读过Jeremy Keith 的书和 HTML5 Doctor（通过这个问题），其中说 HTML5 使得使用多个h1s 成为可能。在 HTML5 中，每个部分都可以有自己的标题元素，因此可以有多个h1. 我见过一个 Wordpress 主题框架，“下划线”，它似乎最充分地应用了这一点。

但是，这似乎会给旧版浏览器（尚不支持 HTML5）在定义站点结构/文档大纲时带来问题。此外，它给 SEO 带来了问题。

我偶然发现了Matt Cutts（来自 Google）的视频并重新阅读了 Keith 的书，该书建议限制使用和使用传统的文档大纲（每页h1只使用一两个，然后是多个,等）。Matt Cutts 还暗示多重对于 SEO 来说并不是太好。h1h2h3h1

然而，

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

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

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

我应该使用哪一个：multiple h1s（在 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>
4

3 回答 3

5

使用新格式。很多人会使用h3s 或h2s，这也很好。

事实上，他们将使用 html5 提供的sectionorarticle或headerorfooter元素，然后使用h3orh4作为该文档段的标题（因为担心 SEO 惩罚/遗留样式|布局怪癖）。

这也很好。

如果你再看一次 Cuts 的视频，他说要尽量h1减少使用——只有在真正有必要时才使用倍数。

在这一点上，这并没有真正改变。

谷歌不会因为你有多个而谋杀你。谷歌预计每一个都意味着内容发生了根本性的变化。

无论您是否在其中有切片 ( section/ article/etc) 元素，都是如此。

谷歌也已经到了正确爬取仅 AJAX 或依赖 JavaScript 的网站的地步，并拥有自己的内容丰富的元数据系统............它们足够复杂，可以解析section或article.

更多地担心内容的质量，如果你准备好接受它，他们用于搜索结果的谷歌特定元数据等等......让谷歌担心导航语义（如只要你很好地使用它们，并且没有做任何阴暗的事情）。

较小的爬虫，谁知道... ...但这是基于每个爬虫的，大多数人只需要关心谷歌、必应和雅虎，其他爬虫要么以谷歌为食，要么非常特定于域（例如，如果您出于某种原因想在选择加入的汽车租赁爬虫中排名靠前…………无论如何，此时您应该提供某种 XML/JSON 提要）。

于 2012-10-24T21:30:18.123 回答
2

死锁，您的第二个示例不包含任何分段元素。但是，您可以使用带有除h1. 我认为这就是你问题的重点：

h1在每个切片元素中

<section>
  <h1>…&lt;/h1>
  <section>
    <h1>…&lt;/h1>
  </section>
</section>

或“计算”标题级别

<section>
  <h2>…&lt;/h2>
  <section>
    <h3>…&lt;/h3>
  </section>
</section>

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

搜索引擎优化不应该是一个问题，因为“h1无处不在”将（并且已经）在整个网络上使用，并且主要的搜索引擎都知道这一点。如果他们想支持 HTML5，他们必须了解大纲算法。我敢打赌，他们的爬虫/API 已经正确计算了真实的标题级别，就像HTML5 大纲一样，例如。

您想要使用h2-h6作为分段元素标题的唯一原因是旧的可访问性软件，例如屏幕阅读器。他们通常提供一个大纲菜单，因此用户可以直接跳转到某个标题。因此，如果您总是使用h1，不了解 HTML5 的旧屏幕阅读器会将所有标题宣布为h1，因为它们不会计算正确的大纲级别。但是，例如 Jaws 13（当前版本的屏幕阅读器），只能h1在 IE、AFAIR中正确地获取 HTML5 的“所有位置” ，并且如果您在 HTML5 页面中使用其他标题级别，它会感到困惑。这当然是一个错误，但这是一个很好的例子，坚持“旧方式”并不总是适用于更新的软件。

因此，无论哪种方式，您都可能会遇到问题。

在我看来，您应该坚持 HTML5 规范的建议，这将是：h1用于所有分段元素标题。因为这个规范是未来的用户代理、可访问性工具、搜索引擎和其他服务/软件用来构建他们的产品的。

但是，这当然取决于您的用例。如果您知道您的访问者统计数据，您应该使用它们为您的特殊情况做出正确的决定。例如，如果您的站点在未来很多年都不会存在，请使用现在最受支持的内容。

于 2012-10-25T17:03:30.397 回答
-4

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

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

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

于 2012-10-24T20:28:28.733 回答