W3C home > Mailing lists > Public > public-respimg@w3.org > May 2012

Re: Is algorithm for selecting based on media query defined?

From: Scott Jehl <scott@scottjehl.com>
Date: Thu, 17 May 2012 21:40:05 +0545
Cc: Kornel Lesiński <kornel@geekhood.net>, public-respimg@w3.org, Matthew Wilcox <mail@matthewwilcox.com>
Message-Id: <011A2329-1B6D-4480-A345-63101A829211@scottjehl.com>
To: Aaron Gustafson <aaron@easy-designs.net>
Fwiw, when working on the picturefill prototype/polyfill, we decided that the last source element that matched would be used. 
And they would be reassessed on resize, orientation change, etc.

I guess since it's a media query feature, it seemed like mimicking CSS cascade/overriding felt natural there.


On May 17, 2012, at 8:46 PM, Aaron Gustafson wrote:

> On Thu, May 17, 2012 at 7:47 AM, Kornel Lesiński <kornel@geekhood.net> wrote:
>> On Thu, 17 May 2012 15:22:04 +0100, Aaron Gustafson <aaron@easy-designs.net>
>> wrote:
>> 
>>> Traditionally, the first to match is the one picked. In the video
>>> element, this is why we put WebM before Ogg: the same browsers support
>>> both, but WebM is smaller, so we put it first so it is the one that’s
>>> downloaded.
>> 
>> 
>> Is that the case for <picture> as well? It doesn't seem to match examples.
>> 
>> How is interpreted source without media? (media="all"? media="none"?)
>> 
>> 
>> http://www.w3.org/community/respimg/2012/03/07/14/
>> 
>> <picture alt="Alt tag should accurately describe the image represented by
>> all sources, though cropping and zooming may differ.">
>>  <source src="mobile.jpg" /> <!-- Matches by default. -->
>>  <source src="high-res.jpg" media="min-width: 800px" /> <!-- Overrides the
>> previous source over 800px before any assets are fetched, resulting in a
>> single request. -->
>>  <img src="mobile.jpg" /> <!-- Fallback content, in the event the <picture>
>> tag is completely unsupported by the user’s browser. -->
>> </picture>
>> 
>> In that case I'd expect <source src="mobile.jpg"> to always match and
>> <source src="high-res.jpg"> be impossible to use.
> 
> 
> You are correct that it doesn’t match up with the examples. This is
> one thing that will have to worked through from an implementor’s
> perspective. We need hard and fast rules for precedence. The model
> picture is now using seems more like the cascade of style sheets than
> the way video and audio sources are handled.
> 
> In terms of the source element, media queries are evaluated after the
> media type in the process (see "resource selection algorithm":
> http://dev.w3.org/html5/spec/single-page.html#concept-media-load-algorithm
> step 6’s else flow #6) and failure to apply a given source (based on
> media query or otherwise) results in a move to the next source.
> Picture would need to function the same way lest we cause confusion
> for either element type.
> 
> Cheers,
> 
> Aaron
> 
> ----
> Aaron Gustafson
> Principal
> Easy Designs, LLC
> +1 877 EASY 313 x101
> aaron@easy-designs.net
> @aarongustafson
> 
> === OUT NOW ===
> Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement
> http://adaptivewebdesign.info
> 
Received on Saturday, 19 May 2012 05:41:24 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Saturday, 19 May 2012 05:41:33 GMT