Search code examples
csshtmlimagecaption

What is the correct way to add caption to an image using html5

I am trying to work out the correct way to display a caption with an image, something like here makes sense jfiddle link but i am also looking at figure and figcaption which appears to serve the purpose better and I prefer ie:

<figure>
<img src="/animage.jpg" alt="an image">
<figcaption>This is the caption</figcaption>
</figure>

I am building a template for a blog news post so does either way matter or is there a correct use for figcaption that im missing?

Solution

  • I would use the <figure> method as it has more semantic meaning than the div / span example.

    <figure class="image">
  <img src="http://[..]" />
  <figcaption>I am an image caption</figcaption>
</figure>

    http://jsfiddle.net/duncan/KYTWS/

    related, although about blockquotes, http://alistapart.com/blog/post/more-thoughts-about-blockquotes-than-are-strictly-required