<article>
The <article> HTML element represents a self-contained composition in a document, page, application, or site, which is intended to be independently distributable or reusable (e.g., in syndication). Examples include: a forum post, a magazine or newspaper article, or a blog entry, a product card, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 5 | 12 | 4 | 5 | 18 | 4.2 | |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
HTML
<article>
<h2>Blog Post Title</h2>
<p><time datetime="2024-01-15">January 15, 2024</time></p>
<p>The body of the article goes here.</p>
</article>Live demo
blogarticlecard
Article element in blogarticle structureization.date or kacategory with.
PreviewFullscreen
ni-scardoverview
Multiple. Article element line upni-sOverview representationationation.
PreviewFullscreen
Use cases
-
Posts and news items
Mark self-contained pieces of content that make sense outside the surrounding page.
-
Feed cards
Use article for repeated result items, updates, or cards that each carry their own heading and metadata.
Cautions
- Do not use article for every visual section. Some page regions are better expressed as section, div, or list items.
- An article should usually have its own heading or clear label so its boundaries are understandable.
Accessibility
- Clear headings and metadata make repeated article blocks much easier to scan with assistive technology.