F. Client-Side Image Maps

Checkpoint (F) focuses on providing client-side image maps in an accessible way. Client-side image maps should be used instead of server-side image maps except where the linked regions cannot be defined by geometric shapes. A text equivalent is also required for each hotspot link area of a client-side image map.

Client-Side Image

All client-side image maps requires an alt attribute added to each hotspot area to allow a short text description of where hotspot links to and an alt attribute to the main image that is used as the image map.

Example

Image map of accessibility links. Section A of the site. Section B of the site. Section C of the site. Section D of the site.

<img src="../images/imgmap2.gif" alt="Image map of accessibility links." usemap="#map1" width="162" height="39" />
<map name="map1"> <area coords="0, 0, 39, 39" href="cp_a.htm" alt="Section A of the site." shape="rect" />
<area coords="40, 0, 79, 39" href="cp_b.htm" alt="Section B of the site." shape="rect" />
<area coords="80, 0, 120, 39" href="cp_c.htm" alt="Section C of the site." shape="rect" />
<area coords="121, 0, 161, 38" href="cp_d.htm" alt="Section D of the site." shape="rect" />
</map>

Checkpoint (F) Techniques

See the Checkpoint (F) techniques for HTML and FrontPage instructions on this checkpoint.

Server-Side Image Maps

See Checkpoint (E) for the requirements when using a server side image map.

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