[whatwg] scrap the srcset attribute


Scrap the srcset attribute.

Traditionally in HTML, and in every instance of XML I have personally 
worked with, an element's attribute is a key=value pair.
Okay the type attribute for source node in audio and video, sometimes it 
has codecs specified there too - but that's the only example I can think 
of, and even there, it is rarely actually used. Usually it is just 
simply used as a key=value pair with the mime type, even by me and I 
know how to specify the codec.

But srcset is a multi-level array. The first array is a , delimited 
string - and each element between the commas is itself a space delimited 

When has that kind of attribute ever been previously used in HTML ??
I suppose the type attribute with audio and video where you can 
optionally specify codec, but that's all I can think of, and there it 
isn't multi-dimensional.

srcset is a mistake. A mistake that will result in errors on the web 
because it is much more difficult to understand than the traditional 
key=value pair that is traditional in HTML and XML.

key='multi level array of values' is just plain conceptually wrong.


Secondly, you are doing the source child of the picture element wrong.

Who the hell am I to tell you that you are doing it wrong?

I'm a user that thinks what you currently have is over-complicated and 

When in the history of HTML has an element's legal attributes been 
dependant upon what the parent element is?

I can't think of a case until the picture element.

The picture element should have the source element as a child, and this 
is how it should be done:

   [source src="ImageHD.webp" type="image/webp" media="(min-width: 
1024px)" /]
   [source src="ImageHD.jpg"  type="image/jpeg" media="(min-width: 
1024px)" /]
   [source src="ImageHD.webp" type="image/webp" media="(min-width: 
800px)" res="2x" /]
   [source src="ImageHD.jpg"  type="image/jpeg" media="(min-width: 
800px)" res="2x" /]
   [source src="Image.webp"   type="image/webp" media="(min-width: 
800px)" /]
   [source src="Image.jpg     type="image/jpg"  media="(min-width: 
800px)" /]
   [source src="Image.webp"   type="image/webp" res="2x" /]
   [source src="Image.jpg"    type="image/jpg"  res="2x" /]
   [source src="ImageMobile.webp" type="image/webp" /]
   [source src="ImageMobile.jpg"  type="image/jpg"  /]
   [img src="Image.jpg" alt="[cow patty in field]" /]

The client selects the first image where it matches all type, media 
query, and resolution attributes that are specified.

Notice that it keeps the simple to understand key=value pair for the 
attributes, and it keeps compatability with source tag as it has already 
been used with audio and video for years now.

Received on Monday, 2 March 2015 16:47:04 UTC