HTML5 Figure Figcaption

What is <figure> and <figcaption>?

<figure>

• It is used to group media content (like images, diagrams, code snippets, charts, etc.) that is referenced in the main content.
• It helps clearly separate this content from the rest of the text.

<figcaption>

• It is used inside <figcaption> to give a caption or description for that content.
• It tells what the figure is about. Think of <figure> like a photo frame, and <figcaption> like the note below it saying what the photo is.

<figure>
  <img src="mountain.jpg" alt="A beautiful mountain view">
  <figcaption>A stunning sunrise over the Himalayan mountains.</figcaption>
</figure>

<figure> groups the image and its caption together.

<figcaption> explains what the image shows.

Why use it?

• Makes your HTML more semantic (meaningful).
• Helps screen readers understand content better.
• Useful for search engines (SEO).