As currently speced, the proper usage of <figure> is:
<figure>
<dd><img src="bunny.jpg" alt="A Bunny"></dd>
<dt>The Cutest Animal</dt>
</figure>
Apart from all that has been said about legacy parsing, leaking style in
IE, etc I would (perhaps not be the first to) add:
1. It seems quite easy to confuse or mistype dd/dt. Without guessing how
often authors will get it wrong, I think everyone agrees that (all else
equal) a syntax which is harder to confuse/mistype is better.
2. Only the caption needs to be marked up, the content is implicitly
everything else. While some content may need a wrapping element for
styling, e.g. <img> usually does not.
3. Aesthetics. (My eyes are bleeding, but I can't speak for anyone else's.)
The main difficulty with coming up with something better seems to have
been finding a name for an element which isn't already taken. If that's
the only issue, why not just take some inspiration from <time pubdate> and
use an attribute instead?
<figure>
<img src="bunny.jpg" alt="A Bunny">
<p caption>The Cutest Animal</p>
</figure>
At least to me, it looks clean enough and there are no serious parsing
issues (just use document.createElement("figure") for IE).
The caption is easy to style with "figure *[caption]" or any number of
easy workarounds for browsers that don't support CSS attribute selectors
(IE6?).
I haven't been following the discussions on <figure> closely, so if this
has already been discussed and rejected please link me in the right
direction.
--
Philip Jägenstedt
Core Developer
Opera Software
