HTML5 tag to use for a group of thumbnail images
I'm curious what tag would make the most semantic sense to encapsulate a group of thumbnail images? Does it make sense to use the <figure>
开发者_StackOverflow tag (reading the html5 spec, it's not clear)? Or stick with a <div>
, or is it considered it's own <section>
?
Normally I'd probably use a div to section it off, but trying to utilize the semantic structure of html5, I was hoping maybe there would be a tag that fits this sort of content better.
Thoughts? Suggestions? All are welcome. Thanks!
From a semantic point of view, using <figure>
is probably the best fit. If you check the HTML5 spec, you'll see that it's perfectly acceptable to include a series of images within a single <figure>
declaration.
Example:
<figure>
<img src="castle1423.jpeg" title="Etching. Anonymous, ca. 1423."
alt="The castle has one tower, and a tall wall around it.">
<img src="castle1858.jpeg" title="Oil-based paint on canvas. Maria Towle, 1858."
alt="The castle now has two towers and two walls.">
<img src="castle1999.jpeg" title="Film photograph. Peter Jankle, 1999."
alt="The castle lies in ruins, the original tower all that remains in one piece.">
<figcaption>The castle through the ages: 1423, 1858, and 1999 respectively.</figcaption>
</figure>
There is also a similar example shown on HTML5Doctor.com where multiple images (which could just as easily be thumbnails) are listed as children of a single <figure>
element.
精彩评论