[whatwg] Resolutions meta tag proposal

André Luís andreluis.pt at gmail.com
Fri Jul 2 17:10:42 PDT 2010

On 2 July 2010 14:28, Aral Balkan <aral at aralbalkan.com> wrote:
> Hi Marques,
> I'm an interaction designer/developer, not a rocket scientist. :) A
> meta tag, I can easily add. If you start talking about HTTP headers,
> you've lost me.
> i.e., this is meant to be a pragmatic, easy-to-author solution.

I think this point Aral made is very important. This is the kind of
stuff that falls under the sphere of the designer/markup author, who
might not have control on the webserver configuration.

If there is a solution (or solutions), there should exist at least one
in the realm of the markup. That's not to say there can't be more than
one way of doing this.. content negotiation sounds good, too.

I've been musing over this since I read Aral's post... I've been
leaning towards a mixture of media queries and a base tag... to
specify a different folder for each resolution... but, as it's been
pointed out here this would apply to all img tags.

This brings me to another question... shouldn't the same exist for all
kinds of visual media resources? Thinking <img>, <video>, <object> and
possibly <iframe>.

(alt-option 1) Trying to step away from the solution presented, I can
only imagine something along the lines of different src attributes for
different resolutions:

<img src="imgs/standard-def.png" src-2x="imgs/high-def.png">
<video src="movs/sd.ogv" src-2x="movs/hd.ogv">

But this might be pushing the syntax a bit too further... but it
gracefully degrades and can be controlled on a per element basis.

(alt-option 2) Or maybe allow an approach similiar to <video> tag for imgs?

<img> <source src="" media="..insert media query here..">


André Luís

On 2 July 2010 18:22, Aryeh Gregor <Simetrical+w3c at gmail.com> wrote:
> On Fri, Jul 2, 2010 at 8:39 AM, Aral Balkan <aral at aralbalkan.com> wrote:
>> I just submitted a proposal for a new meta tag to flag that
>> high-resolution images are available and should be loaded in place of
>> low-resolution ones for users with high-PPI displays (like the new
>> iPhone 4's Retina display).
>> Please see:
>> http://wiki.whatwg.org/wiki/MetaExtensions#Proposals
> I don't know what the right solution is for this problem (other than
> "use SVG" :) ), but I don't think your proposal is workable.
> Inevitably, some images will be available in different sizes and some
> not, but your proposed meta tag will affect all images on the page.
> Also, the author needs to be able to control the names of the resized
> images to fit their needs -- on a site allowing user-uploaded images,
> for instance, you might not be able to guarantee that there isn't
> already a file named flower at 2x.jpg in the directory.
> The most natural way to do something like this is probably along the
> lines of content negotiation, but as we all know, that doesn't work
> well in practice because it's hard for authors to set up.  Ideally,
> you could have the browser include a Resolution: header or something
> like that, saying what resolution it expects to see, and then the web
> server should automatically try resizing the image to match (using
> appropriate caching).  But this is too hard to deploy and control.
> So I don't have any really good ideas.

More information about the whatwg mailing list