2

我已经阅读了有关使用 HTML 5元素的冲突 网页。section将它用作我的页眉和页脚之间的部分在语义上是否合适？

<body>
  <header>logo, nav links</header>
  <section>main content of my webpage</section>
  <footer>copyright, more links, contact info</footer>
</body>
4

3 回答 3

4

一个很好的起点是 Bruce Lawson 的Scooby Doo 和提议的 HTML5<content>元素。

您会在其中找到指向Ian (Hixie) Hickson 意见的链接，他是 WHATWG 版本的 HTML5（又名 HTML 生活标准）的编辑，直到最近还是 W3C 版本的 HTML5 标准的编辑。

他所说的（并且至少在过去 5 年中一直在说）是那里不需要切片元素。如果您需要不在页眉或页脚中的所有内容的包含元素，则<div>使用该元素。

另一方面，W3C HTML 工作组的另一位成员 Steve Faulkner<maincontent>为您的用例提出了该元素，理由是允许将 ARIA“主要”角色合并到原生 HTML 中。

<body>FWIW，对我来说，你应该在页眉和页脚之间有一个特殊的元素，而不是在页眉和页脚之间，这似乎很奇怪，<section>所以<article>我同意 Hixie。

我也不相信史蒂夫的评论，因为它会标记主要内容，即使其他分段和页眉/页脚元素没有正确标记，因为似乎没有任何情况我可以提倡它的用途。它似乎只适用于想要半途而废的网络作者。

请注意，如果<maincontent>确实被接受，它将不是 HTML5 的一部分。它最早可能出现的是 HTML 5.1

于 2012-10-05T21:05:46.623 回答
1

<section>在语义上比<div>. <section>HTML5 的要点之一是它帮助浏览器理解文档的大纲。

您的方法实际上取决于我们页面的内容。<header>和之间的所有内容是否<footer>紧密相关，或者可以将其分解为更多<sections>，甚至其他元素？

总是会有充满矛盾建议的来源，尤其是对于 HTML5 处于开发和利用阶段的东西。

于 2012-10-05T20:13:18.560 回答
0

如果您使用标题 ( h1to h6)，则您已经在使用可以称为“隐式部分”的内容。以下两个标记示例的大纲在语义上是相同的：

示例 1：

<body>
  <header>
   <h1>My cool site</h1>
   …
  </header>
  <section>
   <h1>My cool article</h1>
   …
  </section>
  <footer>…&lt;/footer>
</body>

示例 2：

<body>
  <header>
   <h1>My cool site</h1>
   …
  </header>

  <h2>My cool article</h2>
   …

  <footer>…&lt;/footer>
</body>

因此，在这种情况下，您是否显式添加section并不重要：大纲（语义结构）将是相同的。旁注：建议始终明确使用分段元素来分段内容：

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

（但是，这仅适用于分割内容，而不是分割根（如body））

现在，如果我们不知道您使用的标题，您的问题一般无法回答。有些情况需要您使用section(或article)，否则您会得到错误的页面大纲。在某些情况下，显式section（或article）的使用是可选的。

一些一般性提示（仅适用于“原型”网站；当然有很多例外；这些提示应该只是给您一个想法）

  • 您网站的每个页面都应该有一个网站标题（例如“约翰的博客”）和一个内容标题（例如“我发现了一个有趣的视频”）
    • 站点标题是 中的第一个标题body，它不包含在分段元素（section、或）article中navaside
  • 网站标题“支配”页面的所有范围，例如在大多数情况下 a) 导航和 b) 内容
  • 页面的所有范围都应该有一个标题（不过，您可以使用 CSS 在视觉上隐藏它们）。如果您不能或不想为范围指定标题，则必须使用分段元素（section、或） article，这将创建无标题/隐式标题navaside
于 2012-10-06T01:58:40.137 回答