picture element solution adds too much markup. The whatwg proposal is just ugly as heck and doesn’t leverage any existing valid attributes. The meta tag/mediaquery technique seems close, but I think that can be improved.
Let look at the
1 2 3 4
What about other valid attributes we can add to that:
1 2 3 4
rel associates a relationship to that mediaquery and is valid.
media is a new value.
type attribute is also valid, but the value is not implemented.
This can be used in
img elements as such:
lowsrc, remember that? Why not
tvsrc? It would be up to browsers to only pull the correct src based on the alternate link. Browsers look for hooks for alternate now. This also has the benefit or not dealing with paths, unless you need to.
With a path in the href attribute, maybe we can do this:
1 2 3 4 5 6
I believe that this method gives the greatest control, smallest footprint, provides backward compatibillity and the smoothest path to adoption of any techniques that have made the rounds lately. The picture element is just too much verbosity and I can’t imagine what a page with 20 images would look like. The srcset syntax is a joke and not leveraging media queries at all. Thoughts?