F. HTML Techniques

There are two processes to fix a client-side image map in HTML: adding a alt tag to the image and adding alt tags to each hotspot. The alt tag for the image should mention that the image is a navigation image and describe briefly what type of links it provides. The alt tags for the links should explain where the link goes to.

So:

<IMG SRC="../images/imgmap2.gif" USEMAP="#map1" BORDER=0 width="162" height="39">
<MAP NAME="map1">
  <AREA COORDS="0, 0, 39, 39" HREF="a.htm" shape="rect">
  <AREA COORDS="40, 0, 79, 39" HREF="b.htm" shape="rect">
  <AREA COORDS="80, 0, 120, 39" HREF="c.htm" shape="rect">
  <AREA COORDS="121, 0, 161, 38" HREF="d.htm" shape="rect">
</MAP>

Would become:

<IMG SRC="../images/imgmap2.gif" ALT="Image map of accessibility links." USEMAP="#map1" BORDER=0 width="162" height="39">
<MAP NAME="map1">
  <AREA COORDS="0, 0, 39, 39" HREF="a.htm" ALT="Section A of the site. " shape="rect">
  <AREA COORDS="40, 0, 79, 39" HREF="b.htm" ALT="Section B of the site. " shape="rect">
  <AREA COORDS="80, 0, 120, 39" HREF="c.htm" ALT="Section C of the site. " shape="rect">
  <AREA COORDS="121, 0, 161, 38" HREF="d.htm" ALT="Section D of the site. " shape="rect">
</MAP>

This page adopted from the Curriculum for Web Content Accessibility Guidelines 1.0, Copyright © 2000 W3C (MIT, INRIA, Keio), All Rights Reserved.