Images

To place an image in your page, use this code: <IMG SRC=”images/someimage.gif”> or if the image is inside your own folder, then <IMG SRC=”someimage.gif”> will do. You can use either gifs, jpegs or pngs. Gifs for line art and graphics, jpegs for photographs and pngs for either, but they are much larger in size.

• The <IMG> part is the image tag
• SRC is an attribute of the IMG tag and tells the browser where the image is and what it is called.

Alt text

To facilitate people not looking at your page through graphic supporting browsers or those using blind readers, use the ALT command to provide an alternate text, like this: <IMG SRC="someimage.gif" ALT="Description of Image">. This text is read out by the screen reading software.

Exercise

Search the Internet for an image and insert it into a HTML page or use this exclusive photo of bigfoot taken by me some years ago.

Note that in XHTML the <img> tag closes itself with a /> at the end of the tag. There is no closing tag for <IMG> in HTML.

Note also, that although quotation marks are not required in HTML, they are required where there are spaces in the content. In this case the alt text is a sentence, so the quotation marks define what exactly is alternative text and what is not. If you forget to put in quotation marks only the first word will appear in the alt text, in this case: Not.

Image Links

To make an image into a link, you first need to copy the image into the same folder or a sub-folder to the one that your web-page is in. The <IMG> tag goes between the <A HREF> and the </A> tags, exactly the same position as the text did in your first link exercise.

Exercise

Make your image into a link.

The next thing to learn is how to create a list.

• AA
• XHTML
• CSS

© ilikecake 2005-2008