EPUB 3 Accessibility Guidelines

An image map, as its name suggests, is a kind of context-sensitive image that, depending on where the reader clicks, touches or otherwise actives it, results in a unique operation being performed. Image maps are commonly used to make two-dimensional images dynamic, to provide more information about points on an infographic, etc.

Client-side v. Server-side

There are two ways to create maps: locally using the usemap attribute to reference a map element that defines the clickable region; and remotely by enclosing the image in an a tag and setting the ismap attribute on the img tag.

Server-side maps are inherently less accessible, both because they require that the reader be able to see the image to discern the regions and also because they require that the reader be able to click on the image in an exact spot.

Client-side maps make use of an associated map element to define the clickable regions. Each region is specified in an area element, and each area should include an alt attribute that indicates its purpose so that non-visual readers can easily discover the functionality. Assistive technologies allow readers to iterate over these areas, making them a much friendlier option than server-side maps, and without requiring intrusive fallbacks.

In fact, server-side maps provide no additional functionality, so their use is never recommended. If one must be used, a set of links corresponding to each clickable region should be provided so that readers who cannot interact with the map have equal access to the functionality.

Note that maps of either kind should never be used when a better alternative is available (e.g., to make an image of text linkable).