我应该使用<main>或<article>作为博文吗?

时间:2017-04-08 01:39:18

标签: html html5 semantic-markup

我目前正在清理我的个人博客,而我正试图让HTML更具语义性。博客结构很简单。我有一个主页链接到博客帖子和每个博客帖子的页面。

对于博客帖子页面。我不确定是否应该使用<main><article>标记来包装所有内容。

我会使用

<html>
<body>
  { heading, navigation, etc. }
  <main>
    <h1>{title}</h1>
    <time datetime="{publish date}">{human readable publish date}</time>

    {content}
  </main>
</body>
</html>

<html>
<body>
  { heading, navigation, etc. }
  <article>
    <h1>{title}</h1>
    <time datetime="{publish date}">{human readable publish date}</time>

    {content}
  </article>
</body>
</html>

使用<main>似乎是更好的选择,因为<article>用于分隔HTML文档的独立自包含部分,而<main>用于指示主要部分的位置文件或文件的内容。

我犹豫的原因是<article><time>元素配合使用,以便我指定发布帖子的时间。

来自MDN(https://developer.mozilla.org/en-US/docs/Web/HTML/Element/article):

  

可以使用元素的datetime属性来描述元素的发布日期和时间。请注意,pubdate属性不再是W3C HTML 5标准的一部分。

3 个答案:

答案 0 :(得分:1)

(请注意,您的两个示例会创建不同的文档大纲。)

同时使用。这些元素有不同的用途,可以很好地协同工作。

<main>
  <article>
  </article>
</main>

如果由于某种原因只能使用一个元素,请使用main,因为标题的使用会创建一个隐式部分(article将使此部分显式化),以及所有{{ 1}} - 如果article是最近的部分,相关的功能(如addressbookmark)也可以使用。请注意,body已不再存在与time相关的功能(早期的HTML5草稿具有article属性,该属性提供了此类功能,但已将其删除。)

答案 1 :(得分:0)

文章 - https://www.w3schools.com/tags/tag_article.asp

  

article标签指定独立的自包含内容。

     

一篇文章本身应该有意义,应该可以   独立于网站的其他部分分发。

     

文章元素的潜在来源:

     

论坛帖子,博客帖子,新闻,故事和评论

主要 - https://www.w3schools.com/tags/tag_main.asp

  

主标签指定文档的主要内容。

     

主要元素内的内容应该是唯一的   文献。它不应包含任何重复的内容   侧栏,导航链接,版权信息等文件,   网站徽标和搜索表单。

     

注意:文档中的主要元素不得超过一个。   除了之外,主要元素不能是文章的后代   页脚,标题或导航元素。

如果您像博文一样重复它,我会亲自使用文章标记

答案 2 :(得分:0)

  

主要内容部分包含与文档的中心主题或应用程序的中心功能直接相关或扩展的内容。

来源:https://www.w3.org/TR/2012/WD-html-main-element-20121217

这基本上是: 主要标记是您要查找的内容,因为它包含了您网页上的所有内容。文章标签确实在这个内部。 (您可以在该源链接中查看示例)。

但是不要把这作为一般规则。文章标签也可以正常工作,如此处所述

来源:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/article

这完全取决于你的html结构