html - 对于同时也是文章的页面的主要内容,使用 <main> 或 <article> 哪个更正确?

标签 html semantic-markup

<分区>

我目前正在清理我的个人博客,并试图使 HTML 正确地遵守 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>

如果我阅读 HTML specification对于 <article>正确地, 使用 <main>似乎是更好的选择,因为 <article> <main> 用于分隔 HTML 文档的独立自包含部分用于指示文档的主要部分或文档的主要部分。

我犹豫的原因是因为<article>适用于 <time>允许我指定帖子发布时间的元素。

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

The publication date and time of an element can be described using the datetime attribute of a element. Note that the pubdate attribute of is no longer a part of the W3C HTML 5 standard.

最佳答案

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

同时使用。这些元素服务于不同的目的,并且可以很好地协同工作。

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

如果出于某种原因您只能使用一个元素,请使用 main,因为使用标题会创建一个隐式部分(其中 article 会使该部分显式),如果 body 是最近的部分,则所有与 article 相关的功能(如 addressbookmark)也有效。请注意,article 不再有与time 相关的功能(早期的 HTML5 草稿具有 pubdate 属性,它提供了这样的功能,但它被删除了)。

关于html - 对于同时也是文章的页面的主要内容,使用 <main> 或 <article> 哪个更正确?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43289280/

相关文章:

php - $errors 未在 Laravel 5.4 中显示

javascript - 在 laravel 5 中显示多个评级星 jquery bar 评级

html - 如何仅在按钮之间添加填充?

html - 样式化 CSS 字体以在 html 页面上具有两种自定义字体

javascript - 按钮 : calling "onclick" parent's element instead of itself (HTML Button) 的奇怪行为

html - anchor 标记 (<a>) 上的 rel ="home"是否有帮助?

html - 内容和表现分离的实际意义是什么?

html - 如何在不关闭浏览器自动完成建议的情况下改进它们?

html - 名称-值对的语义和结构

html - 我应该为详细信息标签指定 h2-h6 子标题以使详细信息成为一个不同的部分吗?