Images and Image Maps

Accessibility Statement: If you use images

View an accessible page using images
View an inaccessible page using images

  1. Use the ALT tag to provide a clear text alternative. ALT text should be used for all images, graphical bullets, and horizontal rules. Descriptive ALT text should let the user know what an image is and the purpose of that image.
     

  2. If understanding a visual image is important to understanding the information on a page, or if it provides important clues to a page's mood and style, you may want to include a more detailed description than what is provided by the ALT text. Typically, Web designers use a "D" as a link to a separate HTML document that contains this more detailed text-based description.
     

  3. If your images are really ASCII art (an image created at the keyboard using standard keyboard characters), provide a link before the image to an anchor after the image so that a user with a screen reader can skip over the ASCII characters. Also, supply a text-based description of the image.
     

  4. If you use image maps, use client-side image maps with ALT text for the linked hotspots. ALT text can be supplied for links in image maps by inserting the attribute in the AREA tag.
     

  5. To evaluate your site, view it in a browser with the images turned off and see if the content remains clear.
     

  6. Check accessibility by viewing your page in multiple browsers and platforms, then verify it with tools like CAST's on-line BOBBY verification tool.

Read the relevant W3C guideline -- 1.1  1.2  9.1
Return to the checklist


Adapted with permission from web accessibility pages at Penn State