[whatwg] Problems with width/height descriptors in srcset

[Jason Grigsby]

On May 16, 2012, at 6:45 AM, Jeremy Keith wrote:

> Simon wrote:
>> The width/height descriptors in srcset seem to be difficult for people to get right, even people who read the spec.
>> 
>> * It's not clear from the syntax that it refers to the viewport size rather than the image size.
> 
> Yes, I made this mistake and so did plenty of others. As Matt Wilcox pointed out, we're used to seeing attributes describe the element they are attached to: not as tests for the viewport/device.
> 
>> * It's not clear if it's min-width or max-width.
> 
> Yes, right now the spec contradicts itself about this. This will get resolved I'm sure, but I want to discuss what use cases the srcset draft will work for.
> 
> If I'm taking a "Mobile First" approach to development, then srcset will meet my needs *if* Nw and Nh refer to min-width and min-height.
> 
> In this example, I'll just use Nw to keep things simple:
> 
> <img src="small.png" srcset="medium.png 600w, large.png 800w">
> 
> (Expected behaviour: use small.png unless the viewport is wider than 600 pixels, in which case use medium.png unless the viewport is wider than 800 pixels, in which case use large.png).
> 
> If, on the other hand, Nw and Nh refer to max-width and max-height, I *have to* take a "Desktop First" approach:
> 
> <img src="large.png" srcset="medium.png 800w, small.png 600w">
> 
> (Expected behaviour: use large.png unless the viewport is narrower than 800 pixels, in which case use narrow.png unless the viewport is narrower than 600 pixels, in which case use small.png).
> 
> One of the advantages of media queries is that, because they support both min- and max- width, they can be used in either use-case: "Mobile First" or "Desktop First".
> 
> Because the srcset syntax will support *either* min- or max- width (but not both), it will therefore favour one case at the expense of the either.
> 
> Both use-cases are valid. Personally, I happen to use the "Mobile First" approach, but that doesn't mean that other developers shouldn't be able to take a "Desktop First" approach if they want. By the same logic, I don't much like the idea of srcset forcing me to take a "Desktop First" approach.

Exactly! This is one of the things I was trying to explore yesterday with the use cases around art direction and the incoherent ramblings about difficulties matching breakpoints. Thanks for documenting it in a much clearer fashion.

-Jason