Making <switch> useful

Hi all,

this is just something I'm mulling over and not a properly baked idea. 
Read with salt.

As far as I can tell from testing, <switch> is pretty well supported 
across the board. As I know from experience, it is not very far from 
completely useless in practice (I know that some authoring tools use it, 
but I'm not convinced they use it well — certainly not when it's to 
include a complete copy of the same content in another format).

I was wondering if we might not turn it into something useful. If you 
look at http://picture.responsiveimages.org/, you will see examples like 
this:

<picture width="500" height="500">
    <source media="(min-width: 45em)" src="large.jpg">
    <source media="(min-width: 18em)" src="med.jpg">
    <source src="small.jpg">
    <img src="small.jpg" alt="" lazyload>
    <p>Accessible text</p>
</picture>

In many ways, that's not very different from:

<svg>
   <switch>
    <image media="(min-width: 45em)" xlink:href="large.jpg" width="500" 
height="500">
    <image media="(min-width: 18em)" xlink:href="med.jpg" width="500" 
height="500">
    <image xlink:href="small.jpg" width="500" height="500">
   </switch>
   <title>Accessible text</title>
</svg>

I've therefore been wondering if there be interest in adding a @media 
test attribute for <switch>. I realise that it makes it dynamic; though 
I would hope that that has relatively minimal impact on implementation 
(given that the DOM is there and live anyway). A somewhat clearer 
processing model for <switch> might have to be written, but it seems 
manageable.

For backwards compatibility, it would currently be necessary to polyfill 
@media — but that's doable. If this proves useful for responsive images 
though, I have to admit that I'll it would be rather tempting to just 
highjack this into HTML :)

Thoughts?

-- 
Robin Berjon - http://berjon.com/ - @robinberjon

Received on Monday, 9 September 2013 19:49:05 UTC