[whatwg] add html-attribute for "responsive images"
kornel at geekhood.net
Wed Feb 8 14:20:50 PST 2012
On Wed, 08 Feb 2012 09:06:36 -0000, David Goss <dvdgoss at gmail.com> wrote:
>> When browser has a high-quality image the cached already, but media
>> query for "network-connection: gprs" matches, it would be shame to
>> force it to
>> switch to a lousy image.
> True. But that's mostly likely to happen on a phone, where its most
> unlikley to have a high-quality image cached in the first place.
I use RSS reader which preloads all images when I'm on Wi-Fi, but I read
those feeds when I'm on the go, and often even off-line (BTW: which media
query would match off-line?)
I would be disappointed if my phone supported media queries that tell it
to discard high-quality images it has preloaded and spend extra time
downloading worse versions.
> It's not just about size or speed though. For
> example, your layout might be different in landscape than in portrait,
> so you might want a different aspect ratio version of the image.
I agree with that, and I think these may be two distinct use-cases, which
are best served by different solutions.
If image has different ratio and/or is cropped differently for purpose of
page's layout, then it's important for the browser to respect that —
that's part of the design, and that has been an artistic decision by the
But selection between heavily compressed and higher-fidelity version of
the same image (with same ratio, same content) is just an optimisation. It
doesn't require authors' judgement. Selection of the version can be
expressed by an algorithm, and it's fine for the browser to pick
higher-resolution image if it has it in the cache, rather than respect
media queries exactly as written.
It's also orthogonal to the layout issue — you may want to have landscape
and portrait versions of the image for both regular and high-dpi displays
(or slow and fast networks).
So instead of combination of four media queries (which would get quite
verbose if you were going to take into account several factors, not just
network speed) I think it would be better to combine two very simple media
queries for orientation with simple declaration of adaptive image
resolution (that makes browser automatically take into account screen
size/density and network speed, without needing details spelled out by the
regards, Kornel Lesiński
More information about the whatwg