Summary

ALT text recommendations, and notes on viewing situation.

The ALT text provides alternative or substitute text, for use when the image is not being displayed. The most common mistake (apart from not using it at all) is to provide a description of the image, without considering what job the image was doing on the page, giving results which range from the incongruous to the absurd. The ALT text should be composed as an appropriate textual alternative to the image: sometimes that might turn out to be a description of the image, but in practice that seems to be wrong more often than it's right.

The advice here is offered as a good compromise that works in all three types of viewing situation, with notes on the consequences for the different types. "Type I: graphics enabled" users aren't discussed in detail: some browsers will display the ALT text while waiting for the IMGs to load, for which the suggested ALT texts seem at least adequate.

  ALT recommendation: Type II:
those browsing in text mode, but having image viewing available if required
Type III:
text mode only (e.g character mode terminal, blind readers etc., and indexing robots)
a) Page decorations Code ALT="" in most cases;
for bullets ALT="*" etc.
Avoid using an IMG of a fancy rule with "ASCII art" as its ALT text: better to use HR, and supply discretionary decorative image via CSS.
Reader is unlikely to want to view the image. Don't use an ALT text that is a description of the image ("Fancy rule", "Left filler pattern" etc). "ASCII art" decorations can be intrusive on a speaking browser, so use ALT="" if you possibly can. Don't rely solely on image shape or colour to convey significant information content.
b) Navigation icons ALT="Next", "Previous" etc. ALT="Foo Corp. Home Page" ("To: Foo Corp. Home Page", if you must, but not "Back to.." or "Return to.."). Think about graphical browsers which chop or suppress the text display if the IMG's HEIGHT/WIDTH is too small. It's helpful to some kinds of reader if you can arrange it so there will be no more than one anchor per displayed line.
c) Supplemental or interesting Sometimes a brief description of the image is appropriate: more often it's better to state what it was that the image was intended to illustrate. You may want to mention the image file size, if it's substantial. The text helps the reader to decide whether they want (or need) to load the image. Don't frustrate the reader by claiming that they must load this image.
d) Essential, critical for understanding Be honest with your readers, tell them frankly (e.g in the ALT text) that this image is essential to your presentation. Don't do this unless you have to, though, or readers might go to extra trouble (blind readers enlisting the help of a friend, say) and then be disappointed (see previous entry).

These recommendations originally pre-dated the availability of TITLE and LONGDESC in browsers. Some of the earlier compromises, in which the ALT text was trying to do duty for a number of competing purposes, can be avoided by exploiting those attributes to provide the relevant accessibility features, leaving ALT to do the job for which it was intended, i.e alternative text.


To: the article "Use of ALT texts in IMGs"


|Previous|Up|More|Next | |RagBag|About the author|