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.

Jeremy

P.S. I'm using air-quotes around "Mobile First" and "Desktop First" because 
it's not really about mobile or desktop; it's about small viewports and large 
viewports but the terms are fairly common.

-- 
Jeremy Keith

a d a c t i o

http://adactio.com/


Reply via email to