<article>
The <article> element identifies a self-contained composition that could stand on its own, such as a blog post, news item, forum entry, or card-like content unit.
Overview
The <article> element identifies a self-contained composition that could stand on its own, such as a blog post, news item, forum entry, or card-like content unit.
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.
Related links
Powered by web-features