Web Design/Advanced HTML Tutorial

Now that you have completed your first HTML page lets move on to some advanced HTML. Lets start off with Headers.

To add images to your web documents you need to use the image tag. Unlike other tags however, the image tag has no end tag (But you should end it with /&gt; as per standard rules). In order to use the image tag we will have to go over attributes. Attributes are subsections that get added to a beginning tag to add functionality. Attributes DO NOT get added to end tags.

Insert the &lt;img&gt; tag where you want your image to go. Now in the tag add the "src" attribute and specify the path to the image file on the server (or local directory) that your document is on. Eg. &lt;img src="images/image.gif/&gt;. True HTML 4.01 requires that the image tag also have height, width, and alt, attributes.  But what do these do?

The height and width attributes specify the size of your image. Most browsers will determine this on their own but specifying them allows for faster download times. You can also change the values to something other than the original dimensions of the image. This, however, will NOT change the size of the file. You can even distort images by only changing 1 dimension.

The  attribute specifies the alternative text that comes up if the image can't be displayed. You would be surprised how often this is needed. If an image get corrupted, deleted, or moved without changing the path a graphical browser can't display it and instead will attempt to use alternative text. There are many text-only browsers that can ONLY display alternative text for images as well. A common example is Lynx. Alternative text should either say the text on an image or describe the image. E.g. An image that links to a downloads page says "Downloads" the alternative text should say "downloads" as well. E.g.(2) An image of a cat has no text should have alternative text that describes the cat.

Rami Reddy multimedia designer