[whatwg] <imgset> responsive imgs proposition (Re: The src-N proposal)

[Timothy Hatcher]

On Nov 15, 2013, at 3:23 PM, Tab Atkins Jr. <jackalmage at gmail.com> wrote:

>>> The simplest one isn't much worse, granted.  It suffers from the "put
>>> an id on it" that makes working with <label>/<input> a minor chore,
>>> but otherwise is mostly just shifting things around.
>> 
>> Sure you can use ids. But the idea behind the CSS proposal was to allow
>> better sharing of the breakpoint media queries.
> 
> Not really.  PreloaderCSS gives you two choices, both bad:
> 
> 1. Put the image sources in a <style> next to each <img>, thus
> repeating your layout breakpoints in the MQs multiple times. (This
> weakness is shared by src-N.)

Addressed by attr() as mentioned in other replies already.

> 2. Or put all your image sources in a single <style> block somewhere
> in the page, requiring people to look in two places for image sources
> and virtually guaranteeing that the fallback url in <img src> will be
> ignored and fall out of sync.  You still have your breakpoints in at
> least *two* places though - once in your in-page <style> block, and
> once in your external CSS.
> 
> I think #1 is better, as we can solve it with Custom MQs/MQ
> Variables/whatever, which the CSSWG is already kosher with (and I'll
> be writing up soon).  Once that's solved, much of the problems of this
> approach disappear for both src-N and PreloaderCSS.

> The repetition is in the MQs, and that's solveable quite directly and
> generically with custom MQs.


And those custom MQs would need to be declared in a <style> inline to be useable by the preloader. So they will need to be declared inline and used in external CSS already. So why not take a more CSS approach instead of src-N if you already need to use a <style> to reduce repetition of MQs?

— Timothy Hatcher