Re: The picture element: complexity

On 12.09.2013, at 17:35, Reinier Kaper <rp.kaper@gmail.com> wrote:
> 
> 
> Why can't we do something like <img src="some-lowres.jpg,
> somewhat-higher-res.jpg, very-high-res.jpg" > and then use CSS selectors to
> decide which src to apply?
> Very rough example:
> @media (min-width: 18em) {
>   img {
>     src: 1 // This would be an index based number and if not found, default
> to 0
>   }
> }
> 
> Because browsers want to start downloading the correct image before stylesheets have been downloaded and parsed.
> 
> That's why I proposed that browser download only the first source file by default. This will create extra overhead for when the CSS has been parsed (and an alternative source needs to be downloaded) of course, which might be an issue, but at least there's no tie-in between mark-up and CSS and there will always be an image to display.
>  

Just on the last: This is what we need to avoid. Double-download is a no-go for a responsive images solution and in such a case wouldn't solve the attempt to reduce image load and improve performance.