章节vs文章HTML5

我有一个由各种“部分”组成的页面,如视频,新闻提要等。我有点困惑如何用HTML5表示这些。目前我有他们作为HTML5 <section>s,但进一步检查,看起来他们更正确的标签将是<article>。有人能给我解释一下吗?

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

干杯

编辑:我选择使用article标记,因为它似乎是一个容器标记的不相关的元素,我猜我的“部分”是。然而,实际的标签名称文章似乎相当误导,尽管他们说HTML5已经开发了更多的web 应用程序考虑,我发现很多标签更以博客为中心/基于文档。

无论如何,谢谢你的回答,这似乎是相当主观的。

185921 次浏览
我将使用<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>

如您所见,这些部分仍然彼此相关,但只要它们在将它们分组的块中。章节不必在文章内部。它们可以在一个文档的主体中,但是当整个文档是一篇文章时,我在主体中使用章节。

如。

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

希望这是有意义的。

我喜欢坚持使用的单词的标准含义:article将适用于,嗯,文章。我将博客文章、文档和新闻文章定义为articles。另一方面,section指的是布局/ux项:边栏、页眉、页脚都是section。然而,这完全是我个人的解释——正如您所指出的,这些元素的规范并没有很好地定义。

为了支持这一点,w3c定义了一个article元素作为一个可以独立存在的内容部分。一篇博客文章可以作为一种有价值和可消费的内容。然而,头文件则不会。

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

更有问题的是这篇文章和这一节太 相似的。它们之间唯一的区别就是“自给自足”这个词。 如果存在一些困难的元素,那么决定使用哪个元素就会很容易 还有快速规则。相反,这是一个解释的问题。你可以有 一个部分中的多个文章,可以有多个部分 在和文章中,可以在节和文章中嵌套节 在部分。由您来决定哪个元素是最多的

.

.

在这里是一个非常好的答案,同样的问题在这里SO

听起来好像你应该用<article>标签包装每个“部分”(你这样称呼它们),用<section>标签包装文章中的条目。

HTML5规范说(Section):

section元素表示文档的通用部分 应用程序。在这种情况下,节是一个主题分组 内容,通常带有标题。[…]< / p >
section的例子是章节,不同的标签页 带标签的对话框,或论文中有编号的部分。一个网络 网站的主页可以分为介绍部分,

.新闻条目和联系信息

请注意:作者被鼓励使用article元素而不是 的内容进行辛迪加是有意义的 元素。< / p >

文章

元素中的一个自包含的组合 文件、页面、应用程序或站点,即原则上 可独立分发或可重用,例如在联合中。这 可以是一篇论坛帖子,一篇杂志或报纸文章,一篇博客文章, 用户提交的评论、交互式小部件或小工具等等 其他独立的内容项

我认为你在OP中所说的“sections”符合article的定义,因为我可以看到它们是可独立分发或可重用

更新: HTML 5.1的最新编辑稿article的一些小文本变化(斜体部分的变化):

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

此外,2013年的1月2月中关于article的公共HTML邮件列表的讨论。

同样,对于联合的内容,“鼓励作者使用article元素而不是section元素,如果联合元素的内容是有意义的。”

我的理解是: 我认为YouTube有一个评论区,在评论区内有多个文章(在这种情况下是评论)

因此,section就像一个存放文章的div-container。

关于构建HTML5的W3 wiki页面中,它说:

<section>:用于将不同的文章分为不同的目的或 或定义一篇文章的不同部分。

然后显示我清理的一个图像:

enter image description here

它还描述了如何使用<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>
< p >简单啊?请注意,您也可以在其中嵌套部分 文章,这样做是有意义的。例如,如果每一个 这些博客文章有一个一致的结构,不同的部分,然后 你也可以在文章中加入章节。它看起来 就像这样:

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


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


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

section基本上是h1(或其他h标记)和与之对应的内容的包装器。article本质上是文档中的一个重复或分页的文档…比如你文档上的每一篇博文都可以是一篇文章,或者你文档上的每一条评论都可以是一篇文章。

部分

  • 用于定义布局的一个部分。它可以是midleftright 李等。< / >
  • 这有一个与其他元素联系的意思,简单地说,它是依赖的。

文章

  • 在你有独立内容的时候使用这个方法。

  • Article有其完整的含义。

下面的流程图可以在选择各种语义HTML5元素之一时提供帮助: enter image description here < / p >