- From: Kornel Lesiński <kornel@geekhood.net>
- Date: Sun, 13 May 2012 22:31:26 +0100
- To: whatwg@lists.whatwg.org, Odin Hørthe Omdal <odinho@opera.com>
On Sun, 13 May 2012 21:23:58 +0100, Odin Hørthe Omdal <odinho@opera.com> wrote: >> <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@2.jpg"> > > vs. > > <img src="dog.jpg" srcset="dog@2.jpg 2x"> > > is not really all that different, but the second should be more > flexible. Also downscaling: > > <img src="dog.jpg" srcset="dog@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@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@2x when user zooms in). -- regards, Kornel Lesiński
Received on Sunday, 13 May 2012 21:32:14 UTC