The <article> tag

<article> marks a self-contained block of content that makes sense on its own, independent of the rest of the page — a post, a comment, a product card.

Syntax

<article>...</article>

Example

<article>
  <h2>Article heading</h2>
  <p>Article text...</p>
</article>

Notes

Multiple article elements can be nested (e.g. a post and its comments).
The difference from section: article is a standalone unit that could be syndicated on its own (RSS); section is just a thematic division within a page.

Accessibility

article has an implicit ARIA role of article.

Related tools

The <section> tag

Purpose of <section>: grouping thematically related content, usually with its own heading.

Card component

A basic card component with a heading, text, and a hover lift effect.