- From: Florian Rivoal <florianr@opera.com>
- Date: Thu, 24 May 2012 09:55:32 +0200
- To: whatwg@lists.whatwg.org
On Wed, 23 May 2012 20:56:29 +0200, Matthew Wilcox <mail@matthewwilcox.com> wrote: > I think this is a good step forward, however nless I am > mis-understanding something (entirely possible given how much has been > going on over this recently) there are problems still... > > Resolution of an image and a device is not a guarantee of suitability > of an image at a given physical size. This solution seems to take the > art-directed aspect out of the equation. Just because there's enough > resolution on the device does not mean that the image itself is > suitable at the size the device is outputting the image. Without some > form of other qualifier you end up in a situation where an iPhone 4 > with it's retina display will load an image intended for a device > twice as big. Now, unless you've got perfect eyesight that image will > be displayed at the correct resolution, but *half the size* on an > iPhone 4. That's going to be a problem for some users, especially > older users. > > There needs to maintain an art-directed aspect, and it doesn't seem > possible for a device to have the required intelligence to know which > image is appropriate based solely on the device's pixel density and a > collection of images at given dimensions. Maybe I am misunderstanding you, but if I am not, my proposal addresses this need. You'd write it something like this: <picture> <source srcset="normal.jpg 1x, highres.jpg 2x"> <source media="(max-width:768px)" srcset="ipad.jpg 1x, ipad3.jpg 2x"> <source media="(max-width:320px)" srcset="iphone.jpg 1x, iphone4.jpg 2x"> <img src="normal.jpg"> </picture> You would use the media attribute of the source element to create arbitrarily complex media queries for your art-directed decisions, and use the srcset on the same element to provide various resolutions. - Florian
Received on Thursday, 24 May 2012 07:56:07 UTC