Object element Example: How to use data attribute

This example is part of the article Add Multimedia to your Web documents, part 2.

The data attribute is not a very well-known feature of the object element. For example, it provides the ability to insert a complete image inside an html document:

<object id="logo"
        data="data:image/png;base64, ...des données en base64...">
		Acme Inc.
	</object>

If we use the W3C logo, it looks like the following, where the image is completely contained in the HTML document:

W3C logo

This can be useful when you have to send a document to someone. You can include all the data in the HTML file and send only one file by email. However, take the care to compress any images before inclusion as this will inflate the size of your document.