IT News & Technology update

Image inclusion in HTML With Data URLs

Written by IT News on 5:22 PM

All elements in the network has an address, in a URI (Uniform Resource Identifier). The URI can in many ways into the HTML code of a website. For example, a link to an external file, especially a file or a script into an existing and more.

The data URI scheme allows you to view images in HTML documents, without that it is necessary to mention an external file (a link to a certain image file). The pictures must be integrated and base64 encoded in ASCII representation is decoded by the Web browser (HTTP, without an additional query) when the HTML page is determined by the visitors.

Not all Web browsers provide support for data URI: While Firefox and Safari browsers are compatible with this standard, Internet Explorer is not possible, the images in HTML documents by typing the URL data. It seems that, to overcome this problem, a simple technique is available: base64 encoded images can be decoded by a script server, then the Internet Explorer.

In practice, the image source is in the ASCII code corresponds base64, won with a suitable converter. There are many free or open-source converter on the Internet in the form of two desktop applications and scripts on the server.

The following HTML code you can create a PNG image, but the ASCII code must be replaced by ASCII characters order in the converter output (width and height of the values are broadly in line with those for the 'original picture):

The use of images integrated base64 encoding is useful if you have multiple images in one document because the number of connections is reduced and depletion of resources of the network is a low level. With a smaller number of HTTP requests, the browser performance is increased. For maximum compatibility, a server-based decoder solution should be used.