go to previous page   go to home page   go to next page        



Images in Web Pages

As are all Internet resources, a digital image is a collection of bit patterns stored as a disk file. So the fundamental electronics and communications is the same for images as for any other resource. To include an image in a Web page use the img tag:

<img src="petrock.jpg" alt="Pet Rock" />

img is the HTML tag type; src stands for "source" and is followed by the relative pathname to the image or the full URL of the image. For example, the above tag will cause this image to be loaded:

Pet Rock

The slash / at the end of the img tag is required by XHTML in order to follow the rule that all tags have a closing tag. But instead of two tags, <img> and </img>, a single combined tag <img /> is used instead. For compatibility with older browsers put a space in front of the slash, although usually this does not matter.

alt stands for "alternate". Its value is a phrase that is displayed if the browser cannot display the image. This might happen if the image fails to be sent to the browser, or if the browser is a small device and image display has been turned off.

Image files follow particular formats, and use various schemes to compress their data. Only three types of image files can be used in Web pages: "gif" files, "jpg" files, and "png" files. These types of image files are used by most image processing programs. Some high-end commercial programs (like Adobe Photoshop) use specialized formats, but can save a version of the image in one of the above formats.


Move your mouse pointer over the above image and leave it there for a few seconds. What happens?