W3C home > Mailing lists > Public > whatwg@whatwg.org > May 2012

Re: [whatwg] Media queries, viewport dimensions, srcset and picture

From: Florian Rivoal <florianr@opera.com>
Date: Thu, 24 May 2012 09:43:21 +0200
To: "Markus Ernst" <derernst@gmx.ch>
Message-ID: <op.wesyej2j4p7avi@localhost.localdomain>
Cc: whatwg@lists.whatwg.org
On Wed, 23 May 2012 21:48:39 +0200, Markus Ernst <derernst@gmx.ch> wrote:

> Am 23.05.2012 17:21 schrieb Florian Rivoal:
>> Here's what I think we should do:
>>
>> 1) simplyfy srcset to only accept the *x qualifier
>>
>> 2) add support for srcset as an attribute of the <source> sub-element of
>> the <picture> element (in addition to src, or instead of it? I am not
>> sure).
>>
>> Then you could do stuff like this:
>> <picture>
>> <source media="(orientation:landscape)" srcset="long.jpg 1x, long2.jpg  
>> 2x">
>> <source media="(orientation:portrait)" srcset="tall.jpg 1x, tall2.jpg  
>> 2x">
>> <img src="fallback.jpg" />
>> </picture>
>
> Yesterday I made a similar proposal in an other thread:
> http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-May/036143.html

Yes, indeed, this seems to be exactly the same proposal. Sorry for
not noticing you had already made it.

> I'd like to suggest that @srcset in this form would also be suitable for  
> the <img> element, to address the optimization use case (without art  
> direction) without the verbosity of <picture>.

Sure, sorry for not being very clear about that. In my mind, @srcset
would apply to both <img> and <source>. If you need media queries (to
detecte portrait vs landscape, the viewport size, color depth...),
you go with:

  <picture>
   <source media="..." srcset="...">
   <source media="..." srcset="...">
   <source media="..." srcset="...">
   <img src="...">
  <picture>

But if you don't need media queries, and only want images that adapt to the
resolution and bandwidth, you do this one:
  <img src="..." srcset="...">

  - Florian
Received on Thursday, 24 May 2012 07:44:00 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Wednesday, 30 January 2013 18:48:08 GMT