[whatwg] add html-attribute for "responsive images"

Bronislav Klučka Bronislav.Klucka at bauglir.com
Wed Feb 8 02:12:33 PST 2012



On 8.2.2012 10:59, Anselm Hannemann - Novolo Designagentur wrote:
>> Hi,
>> I think that while talking about responsive image, introducing element that would choose image based on media-query, we should explore more generic approach... any media
>>
>> <media media="all">
>> <video media="support: video">
>> <source src="blabla.ogg" type="video/ogg" media="min-resolution: 300dpi" />
>> <source src="blabla_small.ogg" type="video/ogg"  media="max-resolution: 150dpi" />
>> <source src="blabla.mp4" type="video/mp4"  media="min-resolution: 300dpi" />
>> <source src="blabla_small.mp4" type="video/mp4" media="max-resolution: 150dpi" />
>> </video>
>>
>> <picture>
>>    <src href="small.jpg" alt="a headshot of Bob Flemming"media="min-width:320" />
>>    <src href="medium.jpg" alt="a head and shoulders shot of Bob Flemming" media="min-width:480" />
>>     <src href="large.jpg" alt="a full body portrait of Bob Flemming" media="min-width:640" />
>> </picture>
>>
>> <img src="blabla.png" alt="blabla" />
>> </media>
>>
>> I can imagine e.g. car presentation using this approach, with preferences based on tree position of media content.
>>
>> BTW adding media attribute to video (video ->  source) element might be useful as well... type tells a lot, but not all regarding responsive media content
> Why do we actually need this new wrapper element? I don't see any reason for this.
How else would you know what the alternatives are? Imagine previous 
example without the media envelope? how would you know that img is 
ultimate fallback and picture should be taken into consideration only if 
not video? Without the envelope, the only way to process that would be 
to display all 3 media (video and 2 images)
> And what should support: media be? A new media query? Then this is up to CSS.
> And as far as I understood you correct you want the video to those who support video (btw which device wouldn't as it's only about the tag, not the feature itself?)
We already have media queries which do not describe capabilities of 
media but state of media (width, height, orientation), one might be on 
low level bandwidth or costly bandwidth, or less capable device... I can 
imagine settings in UA that would turn off certain browser capabilities 
based on users choice.
> and a fallback responsive image?
Sorry, I do not understand this question.

Brona



More information about the whatwg mailing list