- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Sun, 10 Nov 2013 09:53:03 -0800
- To: Markus Ernst <derernst@gmx.ch>
- Cc: WHATWG <whatwg@whatwg.org>
On Sun, Nov 10, 2013 at 9:36 AM, Markus Ernst <derernst@gmx.ch> wrote: > Am 08.11.2013 16:47 schrieb Yoav Weiss: >> >> [1] http://tabatkins.github.io/specs/respimg/Overview.html > > > Having a look at the proposal, and reading the thread especially with regard > to complexity and verbosity, I got the impression that @src-n shares a main > objection with @srcset and <picture>, that it mixes up content and design to > some extent. > > Thus I suggest a modified approach which moves the distinction of viewing > situations, or breakpoints, to the head of the document, creating some > variable-like references to be used instead of numbers. Some kind of src-var > instead of src-N. Therefore, a new element for the head would be necessary; > I call it <situations>, it could also be <breakpoints> or whatever is > considered more appropriate: > > <html> > <head> > <situations> > small: (max-width: 400px); > small2x: (max-width: 400px) 2x; > medium: (max-width: 1000px); > medium2x: (max-width: 1000px) 2x; > large2x: (min-width: 1000.01px) 2x; > </situations> > </head> > <body> > <img src-small="pic-small.jpg" > src-small2x="pic-medium.jpg" > src-medium="pic-medium.jpg" > src-medium2x="pic-large.jpg" > src-large2x="pic-x-large.jpg" > src="pic-large.jpg" > alt="Obama talking to a soldier in hospital scrubs."> > </body> > </html> > > The variable names are free, instead of "small", "small2x" etc. the author > could also use "1", "2" etc. or "foo", "bar" etc. or whatever. Beyond that, > it would work the same as src-N, using the resource in @src when none of the > defined situations apply. > > Rationale: > > Moving the distinction of viewing situations to the head would have some > advantages IMO: > - Verbosity is centralized, thus has not to be repeated in every <img> > element > - The UA does not need to evaluate the same MQs again for every <img> in the > content > - In order to achieve a consistent handling of "responsivity", the situation > variables may be reused in other content elements, such as <video>, and also > in the <link> element as an alternative to todays @media attribute > - Easier handling of redesigns when breakpoints change; no modifications > needed in the page content > > This proposal is not thoroughly thought-through, but I hope it shows the > idea. This proposal does not address Variable-Sized Images; handling the difficulty and verbosity of that is indeed centralized to the <situations> element, but that doesn't make it much better. I'm aware that src-N's reliance on explicit MQs is a weakness. I expect to address it through the general mechanism of custom MQs, which I'll be proposing in a little while when I get around to writing the spec for it. One mechanism I'll propose for defining custom MQs will be a <meta> value, which'll make the custom MQ available to the preloader, at which point src-N can use them as well. ~TJ
Received on Sunday, 10 November 2013 17:53:48 UTC