Many people set their browser so that it won't load any images when
it retrieves a web page. This means they don't have to wait for
images to download. Also, blind people who are using the web cannot
see the images. You can add a “caption” to your images for
the convenience of these users. These captions are officially referred
to as alternate text, and you add it via
title attribute in the
The alternate text will be read by text-to-speech converters, and, in the latest browsers, the title will appear as a tooltip when you hover over the image.
Here is a picture of Tabitha, the cat. <img src="tabitha.jpg" alt="Picture of cat" title="Picture of cat" />
While the code above is perfectly good HTML, the
text is worse than useless, as it adds nothing new to the text; you
already knew it was a picture of a cat!
Slightly better is this
alt text, which is what you will
often see inserted automatically by programs such as Front Page:
Here is a picture of Tabitha, the cat. <img src="tabitha.jpg" alt="tabitha.jpg (5122 bytes)" />
This is a minor improvement, as you now have an idea how long the picture will take to download if you decide to view it–but you still have no idea what the cat looks like!
alt text intelligently, answer this question:
How do I describe the most important part of the image to
someone who can't see it? Answering this question for the
example above, we can come up with this useful alternate text:
Here is a picture of Tabitha, the cat. <img src="tabitha.jpg" alt="Black domestic shorthair" title="Black domestic shorthair" />
Note: if you're writing XHTML, the
isn't just a good idea; it's required for a document to be valid.