juniorHTML5
Explain the <figure> and <figcaption> elements.
Updated Apr 28, 2026
Short answer
<figure> groups self-contained content (like images or code); <figcaption> provides its description.
Deep explanation
These tags create a semantic relationship between an asset and its caption, which was previously done with non-semantic <div> tags.
Real-world example
Including a diagram in a technical article where the caption is programmatically linked to the image for SEO.
Common mistakes
- Using <figcaption> outside of a <figure> tag.
Follow-up questions
- Can <figure> contain code snippets?