data: URI scheme

the data: URI-scheme allows you to embed any type of external file inline into your HTML. it is defined in IETF standard RFC 2397. it is useful for one time captchas and can also be used to save connections and bandwidth. the possibilities are widespread. most modern browsers, like Firefox (and other Geckos), Opera, Konqueror (KDE) and Safari support this. unfortunately the Internet Explorer 7 still does not support it, but some forums announce that it could be possible in IE7 SP1 or IE8.

example: this link shows a little 80*15 stefanjelner.de-banner:

data:image/gif,GIF89aP%00%0F%00%B3%00%00%FE%FF%FC%7F%7F%7F%00%99%FF%00%00%00%0FF%A5%FF%FF%FF%0F%9F%FF%00%7F%E5%00X%BD%00%98%FE%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00!%F9%04%00%00%00%00%00%2C%00%00%00%00P%00%0F%00%00%04%C60%C8I%AB%BD8%EB%CDg%F9%60(%02%01%60%9Eh%AA%AEl%EB%AARA%CCt%5D%93o%AE%EFo%8C%FC%C0%60%10%C7%2B%1As%B1%83r%C9d%12%8F%D0%A8)%96%A8Z%AFW%E2%60%0B%D8%0E%BA%5C%2F%F8%2B%A6%01%CC%84%13zvf%9B%B8%E3i%A0%20%A8%DB%EFw-%EA%DB%3D%F1%FBd%7D%26ii%83jg%88%86%85%80%82rtx%90uZp%7Cb%96a%8D%84l%8B%84m%9A%7B%80p1%91%91O%82%95~%A9%81%7F%9D%86%8A%89%88%8B%AB(%A3%A4x%93%A8q%7F%B3_nk%9D%9A%C0%A1o%A2s%B6%B7%25R%CAF%B5%C7%92%C9%CB%D1Hs%06%D5%D6%D7%D7%A6%D2%DB0s%22%DF%20%DA%DC%E3%24%1D%E6%E7%E8%E9%15%11%00%3B

click here to test it

you can also put HTML inline into such link, so you can "inject" HTML into the page loaded when the link is clicked.

to close this, let's dream of the future, where we can manipulate images created with the data: URI scheme or create new images with javascript. isn't that sounding great?

related:
Wikipedia-entry
the data: URI kitchen (used to generate the link)
DataURLMaker
forum post about Internet Explorer support

Sunday, 11. March 2007 • trackback url

Add Comment

( to reply to a comment, click the reply link next to the comment )

Comment Title:
Your Name:
Email Address:
Make Public?
Website:
Make Public?

Comment:


Allowed XHTML tags : a, b, i, strong, code, acrynom, blockquote, abbr. Linebreaks will be converted automatically.


Captcha:

captcha image

please type the content of the above image into the following form-field: