- From: Jason Grigsby <jason@cloudfour.com>
- Date: Wed, 16 May 2012 06:58:38 -0700
- To: Jeremy Keith <jeremy@adactio.com>, WHATWG List <whatwg@whatwg.org>
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
Received on Wednesday, 16 May 2012 13:59:18 UTC