Writing good alt text

I do quite a bit of quality assurance work, specifically looking at the accessibility and web standards use of websites. In many cases I make remarks about the use of alternative text for images and other graphic elements.

It is, not surprisingly, common for alternative text to be completely absent, but it is probably even more common to see inappropriate use of the alt attribute. In most cases this is caused by well-meaning people using the alt attribute to describe the image itself instead of the function it has or the content it presents.

Two rules of thumb I use when writing alt text for images are these:

If you were to describe the document to someone over the phone, would you mention the image or its content? If you would, the image probably needs an alternative text. If not, it should probably have an empty alt attribute.
Does the alternative text of any images in the document make sense if you turn off the display of images in your web browser? If not, change the alternative text so it does make sense and does not provide redundant information.

These are just rules of thumb and there are exceptions, but as a general rule I have found that they work well.

In practice this means that images should often have empty alt text, alt="". Be aware though that if the image is within a link that does not also contain descriptive text, the image needs an alt text that describes the link.

Much more detailed instructions for writing alt text are available in an article at WebAIM called Appropriate Use of Alternative Text.

Posted on November 11, 2008 in (X)HTML, Accessibility