public
Last active — forked from ike/imgtag.html

The New Img Tag (evolved)

  • Download Gist
imgtag.html
HTML
1 2 3 4 5
<img src="large-default-file.jpg" media="screen and (min-width:601px)" alt="this is alternative text for default file" title="this is title for default file">
<source src="smaller.jpg" media="screen and (max-device-width:600px)" alt="this is alternative text for smaller file" title="this is title for smaller file">
<source src="tiny.jpg" media="screen and (max-device-width:320px)" alt="this is alternative text for tiny file" title="this is title for tiny file">
<source src="monochrome.jpg" media="monochrome" alt="this is alternative text for monochrome file" title="this is title for monochrome file">
</img>

I edited this gist (now here: https://gist.github.com/1668965) to improve the syntax and compatibility to common and already used style.
This provides the possibility to use real media-queries as syntax and detect also features like monochrome display (Kindle etc.).
We also could use alt and title text there. Thing is, browser-vendors need to implement it that way so the current alt text and title text is replacing the original one. But I think this isn’t a problem.

And stay updated about the W3C draft proposal here: http://novolo.de/blog/2012/01/19/what-happened-to-responsive-assets/
It will be soon on a W3C mailing list, I hope to get docs finished by end of the week.

Wow... thanks for the fork. I had no idea this was going to go anywhere. Please keep me informed about the status of the W3C proposal.

Thanks a mil,
Isaac

It's a great proposal and along with mine we now have two valid options which I propose to the W3C soon. So I hope to get this real as it's a problem we should face as soon as possible.

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.