Images

In the days before the World Wide Web (WWW) really took off, most Web pages were filled with just text. No pictures. No graphics. No images of any kind. Just text. It was a little boring to say the least. One of the problems of the Internet before the WWW was created that HTML remedied, was the capability to add images to Web pages. Suddenly the Web exploded. That was partially because many people (read: non - techies) would never be caught dead staring at a screen of just words. With the addition of pictures, the Web became even more exciting and was used by many more people.

So how do all those images get onto all those Web pages? Simple. The image tag <img>, does all the heavy lifting. For example, to add the ITarama logo to this page we just add the following markup:

<img src="logo_v7.gif" align="center" height="75" width="750" alt="Thanks for visiting IT-arama" border="0">

This is one of the few HTML tags that does not have to be closed using a </img> tag. Using XHTML standards you can close an image tag by adding a space and a forward slash just before the trailing greater than sign like so:

<img src="logo_v7.gif" align="center" height="75" width="750" alt="Thanks for visiting IT-arama" border="0" />

What does all that mean?

It means that the logo image is named "logo_v7.gif" which is the source of the image (src), it is aligned in the center via align="center", and it is 75 pixels high (height="75") and 750 pixels long or wide (width="750"), it has no border (border="0") and its alternate (alt) text that is displayed if a user has images turned off is "Thanks for visiting IT-arama" via the alt="Thanks for visiting IT-arama" attribute.

What all that really means is that the image is not actually contained in the Web page but is fetched into the page by the instructions in the <img> tag. One thing to know is that the <img> tag as written above, requires the image to be in the same folder or directory as the page calling it.