<article>或<section>标签之间的混淆.哪个用？

Question

尽管在页面上阅读有关<article>和<section>标签的页面我真的不明白如何将它们应用到我的网站.

我在页面末尾有一个包含相关产品的产品页面.首先我想做这样的事情:

<section>
   <header><h1>Product title</h1><header>
   <img src="image.jpg"/>
   <p>Description</p>
   <p>Price</p>
   <p><a href="...">Order</a></p>
</section>

<section>
  <header><h1>Related products</h1></header>
  <article>
    <a href="..."><img src="image1.jpg"><br/>Product 1</a><br/>Price
  </article>
  <article>
    <a href="..."><img src="image2.jpg"><br/>Product 2</a><br/>Price
  </article>
  <article>
    <a href="..."><img src="image3.jpg"><br/>Product 3</a><br/>Price
  </article>
</section>

但是,然后我读了一些其他的博客,它发生在我身上,也许我应该用<section>标签替换<article>标签.

哪个是对的？为什么？谢谢.

Answer 1

部分

section 元素表示文档或应用程序的通用部分。在这种情况下，部分是内容的主题分组。应标识每个部分的主题，通常通过包含标题（h1-h6 元素）作为部分元素的子元素。

文章

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

当文章元素嵌套时，内部文章元素表示原则上与外部文章内容相关的文章。例如，接受用户提交的评论的网站上的博客条目可以将评论表示为嵌套在博客条目的文章元素内的文章元素。

直接来自 W3 http://www.w3.org/html/wg/drafts/html/master/sections.html

在他们的示例中，他们有一个article嵌套在一个section内的一个article。我想说你绝对正确使用它。

<article>
 <header></header>
 <section>
  <h1></h1>
  <article></article>
  <article></article>
 </section>
</article>