Menu
I'm currently cleaning up my personal blog and I'm trying to make the HTML adhere correctly to HTML standards. The blog structure is simple. I have a home page that links to blog posts and a page for each blog post.
For the blog post pages. I'm not sure if I should use the <main> or <article> tag to wrap all of the content.
I would either use
<html>
<body>
{ heading, navigation, etc. }
<main>
<h1>{title}</h1>
<time datetime="{publish date}">{human readable publish date}</time>
{content}
</main>
</body>
</html>
or
<html>
<body>
{ heading, navigation, etc. }
<article>
<h1>{title}</h1>
<time datetime="{publish date}">{human readable publish date}</time>
{content}
</article>
</body>
</html>
If I read the HTML specification for <article> correctly,
using <main> seems to be the better option because <article> is meant to separate independent self-contained parts of an HTML document while <main> is meant to indicate where the main part of the document or meat of the document.
The reason I'm hesitating is because <article> works with the <time> element to allow me to specify when the post was published.
From 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.
954
(Note that your two examples create a different document outline.)
Use both. The elements serve different purposes and work fine together.
<main>
<article>
</article>
</main>
If you can only use one element for some reason, go with main, because the use of the heading creates an implicit section (where article would make this section explicit), and all article-related features (like address and bookmark) also work if the body is the nearest section. Note that there is no time-related feature for article anymore (early HTML5 drafts had the pubdate attribute, which offered such a feature, but it got removed).
110
article - https://www.w3schools.com/tags/tag_article.asp
The article tag specifies independent, self-contained content.
An article should make sense on its own and it should be possible to distribute it independently from the rest of the site.
Potential sources for the article element:
Forum post, Blog post, News, story and Comment
main - https://www.w3schools.com/tags/tag_main.asp
The main tag specifies the main content of a document.
The content inside the main element should be unique to the document. It should not contain any content that is repeated across documents such as sidebars, navigation links, copyright information, site logos, and search forms.
Note: There must not be more than one main element in a document. The main element must NOT be a descendant of an article, aside, footer, header, or nav element.
In case you repeat it like a blog post I would personally use the article tag
21
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
