部分vs文章HTML5

问题描述 投票：165回答：10

我有一个页面由各种“部分”组成，如视频，新闻源等。我有点困惑如何用HTML5表示这些。目前我将它们作为HTML5 <section>s，但在进一步检查时，它看起来更正确的标签是<article>。谁能为我解释一下这个问题？

这些东西都不是真正意义上的博客文章或“文档”，所以很难看出应用哪个元素。

干杯

编辑：我选择使用article标签，因为它似乎是不相关元素的容器标签，我想我的“部分”是。然而，实际的标记名称文章似乎颇具误导性，虽然他们说HTML5是在更加考虑Web应用程序的情况下开发的，但我发现许多标记更加以博客为中心/基于文档。

无论如何，谢谢你的答案似乎是相当主观的。

html html5 markup
10个回答
118
投票

听起来你应该在<article>标签中的<section>标签和条目中包装每个“部分”（如你所说）。

HTML5 spec说（部分）：

section元素表示文档或应用程序的通用部分。在此上下文中，部分是内容的主题分组，通常带有标题。 [...]

部分的示例可以是章节，选项卡式对话框中的各种选项卡式页面，或论文的编号部分。网站的主页可以分为几个部分，用于介绍，新闻和联系信息。

注意：鼓励作者使用article元素而不是section元素，因为联合元素的内容是有意义的。

而对于Article

article元素表示文档，页面，应用程序或站点中的自包含组合，并且原则上可独立分发或可重用，例如，文档元素。在联合。这可以是论坛帖子，杂志或报纸文章，博客条目，用户提交的评论，交互式小部件或小工具，或任何其他独立的内容项。

我认为OP中你所谓的“部分”符合文章的定义，因为我可以看到它们是可独立分发的或可重用的。

更新：article中latest editors draft for HTML 5.1的一些小文本更改（斜体更改）：

article元素表示文档，页面，应用程序或站点中的完整或自包含的组合，并且原则上可独立分发或可重用，例如，在联合。这可以是论坛帖子，杂志或报纸文章，博客条目，用户提交的评论，交互式小部件或小工具，或任何其他独立的内容项。

另外，关于2013年article和January中关于February的公共HTML邮件列表的讨论。

-1
投票

文章和部分都是HTML5的语义元素。 Section是网页的块级通用部分，但与我们的网页内容相关。文章也是块级别，但文章是指网页的个人博客文章，评论。

条款和章节都应包括标题元素h2-h6。

119
投票

在W3 wiki page about structuring HTML5，它说：

<section>：用于将不同的文章分组到不同的目的或主题，或定义单个文章的不同部分。

然后显示我清理的an image：

它还描述了如何使用<article>标签（来自上面的相同W3链接）：

<article>与<section>有关，但明显不同。 <section>用于分组内容或功能的不同部分，而<article>用于包含相关的单独独立内容，例如个人博客文章，视频，图像或新闻项目。可以这样想 - 如果你有很多内容，每个内容都适合自己阅读，并且在RSS feed中作为单独的项目联合有意义，那么<article>适合于标记它们。

在我们的示例中，<section id="main">包含博客条目。每个博客条目都适合作为RSS提要中的项目进行联合，并且在独立阅读时有意义，因此<article>对他们来说是完美的：

<section id="main">
    <article>
      <!-- first blog post -->
    </article>

    <article>
      <!-- second blog post  -->
    </article>

    <article>
      <!-- third blog post -->
    </article>
</section>

简单吧？请注意，您也可以在文章中嵌套部分，这样做是有意义的。例如，如果这些博客文章中的每一篇都具有不同部分的一致结构，那么您也可以在文章中放置部分。它可能看起来像这样：

<article>
  <section id="introduction">
  </section>

  <section id="content">
  </section>

  <section id="summary">
  </section>
</article>
39
投票

我使用<article>作为一个与页面上其他块完全无关的文本块。另一方面，<section>将分隔一份彼此相关的文件。

现在，我不确定你的视频，新闻源等有什么，但这里有一个例子（没有真正的对或错，只是我如何使用这些标签的指南）：

<article>
    <h1>People</h1>
    <p>text about people</p>
    <section>
        <h1>fat people</h1>
        <p>text about fat people</p>
    </section>
    <section>
        <h1>skinny people</p>
        <p>text about skinny people</p>
    </section>
</article>
<article>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</article>

正如您所看到的，这些部分仍然相互关联，但只要它们位于将它们组合在一起的块中。章节DONT必须在文章内。它们可以在文档的正文中，但是当整个文档是一篇文章时，我会使用正文中的部分。

EG

<body>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</body>

希望这是有道理的。

18
投票

我喜欢坚持使用的单词的标准含义：article适用于文章。我将博客文章，文档和新闻文章定义为articles。另一方面，部分将引用layout / ux项：侧栏，页眉，页脚将是部分。然而，这是我个人的解释 - 正如您所指出的，这些元素的规范没有明确定义。

支持这一点，w3c将article元素定义为可独立独立的内容部分。博客文章可以作为有价值和可消费的内容项目独立存在。但是，标题不会。

Here是一篇有趣的文章，关于一个男人试图区分这两个新元素的疯狂。这篇文章的基本观点，我也觉得是正确的，就是尝试使用你认为最能代表它所包含内容的元素。

更有问题的是文章和章节非常相似。所有将它们分开的是“自足”。如果存在一些严格的规则，那么决定使用哪个元素会很容易。相反，这是一个解释问题。您可以在一个部分中包含多个文章，您可以在文章中包含多个部分，您可以在部分内的部分和文章中嵌套部分。由您来决定在任何给定情况下哪个元素在语义上最合适。

Here对SO的同一问题是一个非常好的答案

5
投票

部分

  • 用它来定义布局的一部分。它可能是mid，left，right等。
  • 这具有与其他元素连接的含义，简单地说，它是相关的。

文章

  • 在您拥有独立内容的地方使用它。
  • 文章有其完整的含义。
3
投票

一节基本上是h1（或其他h标签）的包装以及与此对应的内容。 article本质上是文档中重复或分页的文档...就像文档中的每篇博文都可以是文章，或者文档上的每条评论都可以是文章。

1
投票

此外，对于联合内容“鼓励作者使用article元素而不是section元素，因为联合元素的内容是有意义的。”

1
投票

选择以下各种语义HTML5元素之一时，下面的流程图会有所帮助：enter image description here

0
投票

我的解释是：我认为YouTube有一个评论部分，在评论部分内部有多篇文章（在这种情况下是评论）。

所以一个部分就像一个包含文章的div容器。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.