[whatwg] image captions

[Mihai Sucan]

Le Tue, 27 Jun 2006 17:50:36 +0300, Michel Fortin  
<michel.fortin at michelf.com> a écrit:

> Le 27 juin 2006 à 6:00, dolphinling a écrit :
>
>> What's wrong with
>>
>> <div>
>>   <img src="">
>>   <p>This is the caption.</p>
>> </div>
>>
>> ? That's how I think of it semantically, and I don't see it as being  
>> common enough to warrant a separate element of its own.
>
> The problem is that this means nothing. The paragraph could be the  
> caption as much as it could be an the excerpt of an article with a small  
> category logo at the top, or it could be an image inserted for  
> presentational purpose or something else. There is no way to  
> disambiguate any of this with your markup. The fact that they are  
> together does not mean that it is a caption, it somewhat convey that the  
> two are related, but in what way?

Exactly.

There's no explicit association between the two. That specific markup is  
way too general.

> I think something like:
>
>      <aside>
>         <img src="...">
>         <p>This is the caption.</p>
>      </aside>
>
> would already be more appropriate than what you suggested as it removes  
> the paragraph from the main flow of the document and thus implicitly  
> link it with the image.
>
> But I think illustrative figures sould be disambiguated a little more,  
> as they are not always appropriate as asides[1] in the sense of  
> "tangentially related to the content around", they are usually tied to  
> the content, they're not really "separate from that content".
>
>   [1]: http://www.whatwg.org/specs/web-apps/current-work/#the-aside

True.

Using <aside> is better than <div>.

<...>
>
> By setting a standard for such things, an explicit association between  
> the caption and the illustration would help image search engines, it  
> could enable the automatic creation of a figure index for a page and the  
> creation of assistive tools capable of handling illustrations better. I  
> think the use case is huge.

Very good point. Aural web browsers, braille web browsers, other assistive  
tools and parsing scripts (like search engines) would benefit from an  
improved markup of associating captions to images.

That's why I came with the suggestion of <img caption="caption-element-id"  
/>. It does not require the isolation of the image and caption in another  
tag. Thus, the markup is less verbose, without losing the benefit of image  
and caption elements association. Another benefit would be that the <img>  
and <p> can both be optionally isolated with <aside>, <div> or anything  
else (if the author considers this required, for styling or other  
purposes).


-- 
http://www.robodesign.ro
ROBO Design - We bring you the future