[whatwg] Implementation complexity with elements vs an attribute (responsive images)

Kornel Lesiński kornel at geekhood.net
Sun May 13 14:31:26 PDT 2012

On Sun, 13 May 2012 21:23:58 +0100, Odin Hørthe Omdal <odinho at opera.com>  

>>  <picture>
>>       <source src="narrow_low-quality" srcset="narrow_hi-quality 2x"
>>  media="max-width:4in">
>>       <source src="wide_low-quality" srcset="wide_hi-quality 2x">
>>       <img src="fallback" alt="alt">
>>  </picture>
>> Instead of srcset it could be src2x or another attribute that specifies
>> image for higher screen density and/or bandwidth. The point is that
>> media="" would allow author to choose image version adapted to page
>> layout, and another mechanism connected to <source> would allow UA to
>> choose image resolution.
> Seeing it here in code it's actually not such a monster that I'd said
> it'd be. So I like it even more, and it's the obvious way for these to
> interact.
> I think it'd be a mistake to call it src2x though, -- it feels very
> specific. You can scale up to double then, but you can't necessarily go
> beyond that: going down for e.g. mobile.
> OTOH, 2x will be the most common usage at least as far as I can tell.
>   <img src="dog.jpg" src2x="dog at 2.jpg">
>   vs.
>   <img src="dog.jpg" srcset="dog at 2.jpg 2x">
> is not really all that different, but the second should be more
> flexible. Also downscaling:
>   <img src="dog.jpg" srcset="dog at 2.jpg 2x, dog-lo.jpg 0.5x">

Yes, good point.

> Actually, for this to work, the user agent needs to know the size of the
> standard image. So:
>   <img src="dog.jpg" width="960"
>     srcset="dog at 2.jpg 2x, dog-lo.jpg 500w">
> So if you've got the smartphone held in portrait, it's 250 css pixels
> wide, and so 500 real pixels, it could opt to show dog-lo.jpg rather
> than dog.jpg.

But still displayed at 960 CSS pixels or course? That'd be fine (and the  
UA could even download dog at 2x when user zooms in).

regards, Kornel Lesiński

More information about the whatwg mailing list