可以在同一页面上使用多个 h1 标签，但设置不同的样式吗？

Question

我有一个网页，我在各种 DIV 中多次使用 h1 标签，我将每个 div 的 h1 样式设置为合适的大小。

例如…

 #content h1 {
  font-size:22px;
}

#left-nav h1 {
  font-size:14px;
}

#content .recent-news h1 {
  font-size:16px;
}

这样可以吗？

原文由 Brad 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

在我看来，你不必担心，这样做就可以了。

H1 将您的部分内容指定为一级标题。因此，如果您的导航 div 中有一级标题（例如 <H1>Navigation Menu</H1> ），当然应该是 #nav h1 。

如果您的内容中应该有几个 H1，则取决于：如果您有一个博客并且每个条目都有自己的标题，那么这些就是 H1。但是，如果您的博客本身有标题（例如 <H1>My Blog!</H1> ），则博客条目标题应该是 H2。

但这只是理论。寻找可读的语义标记。您最好通过查看您的 html 并问自己：’它可读吗？如果我换一种方式，可读性会提高吗？答案因项目而异。

原文由 Treb 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

来自 Google 的 Matt Cutts 回答 了一个页面上不止一个 H1：好还是坏？ （2009 年 3 月 5 日）与：

好吧，如果有一个合乎逻辑的理由来拥有多个部分，那么拥有多个 h1 并不是那么糟糕。我会注意过度它。如果您的整个页面是 h1 ，那看起来很漂亮，对吧？所以不要做所有 h1 然后你的 CSS 让它看起来像普通文本，因为我们看到人们，他们是竞争对手抱怨说，如果用户关闭 CSS 或者 CSS 没有加载，它看起来真的很糟糕。所以，你知道，这里有一点 h1 是可以的，然后可能在页面上有两个部分，所以这里可能有一点 h1 。

但是您真的应该将它用于页眉或标题，这就是意图所在。不要只是将 h1 扔到页面上的任何地方。因为我可以告诉你，如果你只是在页面的任何地方抛出 h1 ，人们就会试图滥用它，所以我们的算法会尝试考虑到这一点，所以它对你并没有多大好处。所以我会在有意义且更谨慎的地方使用它，但你可以多次使用它。

原文由 Joel 发布，翻译遵循 CC BY-SA 3.0 许可协议