在 HTML5 中，使用 <section> 和 <h1> 而不是 <h2>–<h6> 会更好吗？答案

【问题标题】：In HTML5, is it better to use <section> and <h1> instead of <h2>–<h6>?在 HTML5 中，使用 <section> 和 <h1> 而不是 <h2>–<h6> 会更好吗？
【发布时间】：2010-12-20 18:51:14
【问题描述】：

在研究 HTML5 的新 section 标签时，我想知道 h1、h2、h3、h4、h5 和 h6 标签的处理...

HTML5 规范说“[h1, h2, etc.] 元素代表它们的部分的标题”(http://www.w3.org/TR/html5/sections.html#the-h1-h2-h3-h4-h5-and-h6-elements)。在规范的“4.4.11 标题和部分”部分中，目前有三个构建有关苹果的文档的示例。

如果我们遵循第一个规范，它指出标题元素“应该代表其部分的标题”，那么第三个苹果示例似乎是最正确的结构（即，使用 h1 标签作为每个部分和小节的标题）。使用这种逻辑，h2、h3、h4、h5 和 h6 标签似乎很少使用，如果有的话。

这就是我想知道的：如果 h2、h3、h4、h5 或 h6 标签实际上基本上是标记小节，是否真的应该使用它们？使用节标记来分隔节，每个节都有自己的标题，而不是依靠 h2、h3 等来启动隐式节，难道不是更有意义吗？（“标题和部分”部分还谈到了使用 h2、h3 等隐含的部分。）

也许是我的关系数据库知识导致了偏差，但创建了多个带有数字的标题标签（h 1、h 2、h 3 ) 似乎是不好的做法，因为从技术上讲，他们每个人都在各自的部分或小节上。

你有什么想法？

【问题讨论】：

我想看一个标题标签
文档大纲算法纯属虚构。它从来没有被浏览器或辅助技术实现过——如果你使用 h1-only 方法，没有什么能正确解释它。请参阅codepen.io/stevef/post/a-decade-of-heading-backwards、（更长）adrianroselli.com/2016/08/… 和（甚至更长）css-tricks.com/document-outline-dilemma。

标签： html

【解决方案1】：

似乎规范甚至声明 h1 优先于所有其他：

节可以包含任何等级的标题，但强烈建议作者要么仅使用 h1 元素，要么使用适当等级的元素用于节的嵌套级别。

然而令我不安的是：

还鼓励作者在分节内容的元素中显式包装分节，而不是依赖在分节内容的一个元素中包含多个标题所生成的隐式分节。

现在很高兴我们可以使用部分、文章、导航和旁边来防止 div-itis。但是，如果我们需要为每个部分显式使用一个部分元素，而不是最终得到更多的部分元素，那么我们就有了 div。我感到很强烈的节段炎正在发生。

【讨论】：

Div-itis 并不意味着使用大量的<div>s。这意味着使用<div>s 另一个有意义的标签是合适的。使用<section> 标签来标记实际部分就可以了。

【解决方案2】：

我同意@Robert。在我看来，这听起来像是在部分中使用“h”标签的情况，或者在隐含部分中使用 h1..n 标签。在一个部分中允许 hn 只是多余的。

【讨论】：

对，但是有很多浏览器、屏幕阅读器、搜索引擎和现有代码从未听说过<h>，但知道<h1> 到<h6> 是标题。我认为 XHTML 2 定义了一个 <h> 元素，但 HTML5 尽可能使用现有标签和用户代理行为。
我喜欢 h 标签的概念。如果由我来决定，新的标题标签将替换所有 h1、h2 等，因为每个标签都只是一个部分的标题。只是为了讨论......
对我来说有一个类似于
的标签是有意义的，我通常在主页上有超过 6 个标题，所以对我来说有一个通用的 h 标签似乎是合理的跨度>

【解决方案3】：

当您使用这些标签时，会有一个隐含的层次结构。 h2 部分低于 h1； h3低于h2等。它们是子节子节。我不确定为什么这会导致断开连接。如果您只有一个级别的子部分，那么您将只使用 h1。

我认为您反对的是 <section> 标签可以提供类似的分层功能，但 <section> 标签是 HTML 的新标签，并且（通常情况下）只是因为有另一种方法可以做到这一点并不意味着规范改变以打破旧方式。

【讨论】：

感谢您的想法。我了解 h1、h2 等标签的工作原理，但只是想知道人们对将它们与新的部分标签一起使用的想法是什么。当然，有很多方法可以完成同样的事情。在我的 OP 中提到的规范中的“苹果”示例中，我倾向于支持第三个示例。我的理由是，例如，带有和 h2 标记的小节本身就是具有自己标题的节。例如，当 ul 嵌套在“父”ul 的 li 中时，我们不使用 ul2。那么为什么要使用标题呢？（只是想进行一些讨论:)
我的意思是“...带有 an h2 标签的小节...”
@robert ：完全同意——使用带有小节的 h 标签没有真正意义，并且属于不良代码气味的类别。我想规范必须涵盖这种情况，但对我来说似乎是不明智的。

【解决方案4】：

这可能只是我对新规范的解释，但是……在我看来，<h1>-<h6> 标签开始被归为印刷层次结构的职责，而不是真正的分段标签。

whatwg.org 明确规定 section 标签可以以 H1 标签开头，这与我所了解的 SEO 最佳实践相悖——每页只定义一个。

这让我相信这是 html 的发展方向......<section> 是一个部分的“机器”可读组件，标题标签将是人类友好的元素。

【讨论】：