It's possible to include images in your web page without any
additional HTTP requests by using the
data: URL scheme. Although this approach is
not currently supported in Internet Explorer, the savings it can bring
to other browsers makes it worth mentioning.
We're all familiar with URLs that include the
http: scheme. Other schemes include the
mailto: schemes. But there are many more
schemes, such as
urn:. Some of these are officially registered;
others are accepted because of their common usage.
data: URL scheme was first
proposed in 1995. The specification (http://tools.ietf.org/html/rfc2397) says it "allows
inclusion of small data items as 'immediate' data." The data is in the
URL itself following this format:
An inline image of a red star is specified as:
<IMG ALT="Red Star" SRC="data:image/gif;base64,R0lGODlhDAAMALMLAPN8ffBiYvWW lvrKy/FvcPewsO9VVfajo+w6O/zl5estLv/8/AAAAAAAAAAAAAAAACH5BAEA AAsALAAAAAAMAAwAAAQzcElZyryTEHyTUgknHd9xGV+qKsYirKkwDYiKDBia tt2H1KBLQRFIJAIKywRgmhwAIlEEADs=">
data: used only for
inline images, but it can be used anywhere a URL is specified, including
The main drawback of the
data: URL scheme is that it's not supported in Internet Explorer (up to and including version 7). Another drawback is its possible size limitations, but Firefox 1.5 accepts inline images up to 100K. The base64 encoding increases ...