Image Tips

Screen readers, or reviewers, are for people who are blind. These aids make on-screen information available as synthesized speech or a refreshable Braille display. They can only translate text information.

Images can be translated, if there is alternative text describing the image.

Tips on using the alternative text (ALT) attribute in image tags:

  • To add alternative text to an image, simply include the "ALT" attribute in your image tag
  • Consider adding a period at the end of the ALT attribute text, so that someone hearing the page can tell where one image stops and another starts
  • Consider numbering your image or image map links with a number at the start of the "ALT" attribute text; this helps to orientate the person hearing the page
  • If you have text links next to each other, separate the links with a space and a period, or a vertical bar; this way, someone hearing the page can tell where one link stops and another starts

Standard Images

Always include alternative text attributes in image tags.

For example:

<IMG SRC="logo.gif" ALT="company logo">

If the image is not important, set empty alternative text attributes.

For example:

<IMG SRC="dot.gif" ALT="">

Animated Images

Include alternative text to describe each frame of an animated image.

If you use Internet Explorer, hover your mouse pointer over the button, and a small text box should appear displaying the alternative text message.

After 3 loops, the animated button will stop rotating. Click "refresh" on your Web browser to restart the animation.

Image Links

When images are used as links, include alternative text that states the exact label contained in the image. For example, if the image link says "Search," the alternative text should also be "Search."

Do not include additional information. For example, for the image link that says search, do not use the phrase "Click here to search."

Submit and Input Images

When images are used as submit buttons on forms, include equivalent alternative text.

For example:

<INPUT TYPE="image" NAME="Submit" SRC="submit_button.gif" ALT="Submit">