How to embed images in a HTML page without ActiveX

-
We have this requirement to ensure that the saved (X)HTML is completely self-contained.
This means that displayed images need to be embedded. Ideally, no additional plugin (e.g. ActiveX, Applet, Flash, etc.) is required.

Therefore, instead of using a img tag with the src attribute that refers to an remote image, the src attribute could actually embed the entire image that is encoded using Base64.

The magic is to use the data URI scheme.

E.g. <img src="data:image/png;base64, <Base 64 encoded data>">

This is supported in Gecko-based (Firefox) and WebKit-based (Android, Safari, Chrome) browsers. Trident-based (IE 8 and 9) are also supported.

Comments

Post a Comment

Popular posts from this blog

Understanding ITIL Service Management the UML way…

-
Image
I originally had a great deal of difficult reconciling the differences amongst ITIL Change Management, Incident Management, and Problem Management. Having researched on the subjects and understanding them better now, I’ve tried to put the concepts together using a UML class diagram to capture my understanding and to keep it imprinted. Similarly, I wanted to differentiate the various categories of changes (Standard, Emergency, Normal) using an easy to understand & self-explanatory manner – a UML Activity Diagram!
Read more

How to depict (Professional-Looking) Logical Network Diagrams in Astah

-
Image
I have always had to create (professional-looking) UML diagrams using Visio-like icons. You’ve got to admit that showing a bunch of boring UML boxes hardly interests anyone less technical (like anyone whose designation has the words “manager” or “director”). This is actually possible in Astah! I’ve created a template for future projects that allows me to produce logical network diagrams that look like the following: To create this diagram, you need to do the following: Assign various icons to stereotypes. I created the following for my use: Create a new UML Deployment Diagram Every element in the diagram is created as a Node The nodes are subsequently assigned the appropriate <<stereotype>>. E.g. Internet is <<internet>>, WebZone FW is <<firewall>>, Web LB is <<loadBalancer>> Ensure the “Icon Notation” is set to “Customized Icon” for each node Instead of the boring boxes, the corresponding icons automatically gets displayed!
Read more