W3C home > Mailing lists > Public > whatwg@whatwg.org > March 2015

[whatwg] scrap the srcset attribute

From: Michael A. Peters <mpeters@domblogger.net>
Date: Mon, 02 Mar 2015 08:46:35 -0800
Message-ID: <54F493EB.8060007@domblogger.net>
To: "whatwg@whatwg.org" <whatwg@whatwg.org>
Dear WHATWG,

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 
array.

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 
ridiculous.

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:

[picture]
   [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]" /]
[/picture]

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

This archive was generated by hypermail 2.4.0 : Wednesday, 22 January 2020 17:00:29 UTC