1.13 Provide text links to emulate server-side image maps
Contents
WAI Checkpoint 1.2
Full WAI text: "Provide redundant text links for each active region of a server-side image map."
Image maps are images which are made up of many parts, each of which is a separate graphical button or link. To follow a link on a server-side image map, the user clicks on a point on the image with the mouse. The geometric co-ordinates of the point are sent to the server where the web page is hosted and the user is directed to a page corresponding to a link associated with that point.
Server-side image maps are divided into portions called 'active regions'. These regions correspond with links to different destinations and are often irregular shapes. For example, a map of Ireland could be presented to the user who would then have to click on a county to see more information about that area. In this case, the map of Ireland is a server-side image map and each county is an active region on the image map.
Redundant text links are presented in text format and correspond to the links contained in the active regions of the image map.
Rationale
Server-side image maps do not provide adequate support for alt text as it can't be provided for each active region. Alt text is only applied to the map as a whole, which means that they can't be used on non-graphic web browsers or if images are disabled on a graphic browser, thereby preventing users from accessing any of the links.
Also, server-side image maps rely on -point and click' interaction with a mouse, making them unusable by keyboard only navigation, i.e. for users of laptops without a mouse, screen readers, touch screens or special pointing devices.
Directions and Techniques
Provide an alternative list of links after the IMG and indicate the existence and location of the alternative list
Consider these WAI recommended techniques for providing alternative links when using the OBJECT element
If you use the OBJECT element, include redundant text links
WAI recommended technique on providing alternative links when using the OBJECT element
Ensure that redundant text links have meaningful titles
Redundant text links should make sense when read out of context, e.g. if you were to present population figures for counties in Ireland through an image map in the shape of the map of Ireland, where each county is an active region, the redundant text links should provide a clue about the consequence of following the link. You might say "Population of Limerick" as opposed to just "Limerick". This provides people who can't see the image map with helpful contextual information.
If a list of text links is not appropriate, provide the list in a combo-box
If a long list of text only links does not seem appropriate on the web page, consider using a combo box but ensure that it is programmed in a way that makes it accessible.
Provide alt text for all active regions in a client side image map
When you provide alt text for the active regions, remember that they should make sense as link titles when read out of context. A user who has to rely on the alt text to use the image map will need helpful contextual information from the link titles. CAST recommended techniques for alt text and client side image maps
How you could check for this:
Try using the site with the mouse plugged out
If you can't navigate the site with the mouse plugged out, you will need to insert redundant text links.
Test the site with a text only browser
A text only browser, such as Lynx, cannot recognise images and will present the text only. Pages with server-side image maps will be unusable unless redundant text links are provided.
Guidelines for Web Accessibility - Priority 1- 1.1 Provide a text equivalent for every non-text element
- 1.2 Ensure that information does not rely on colour perception
- 1.3 Avoid causing the screen to flicker
- 1.4 Provide an auditory description of the visual information in multimedia presentations
- 1.5 For multimedia, ensure that timing of alternative descriptions is synchronised with the presentation
- 1.6 Use the clearest and simplest language appropriate
- 1.7 Identify language changes in text
- 1.8 Ensure that equivalents for dynamic content are updated when the dynamic content changes
- 1.9 For data tables, identify row and column headers
- 1.10 For complex data tables, use mark-up to associate data cells and header cells
- 1.11 Add titles to frames
- 1.12 Ensure that documents can be read without style sheets
- 1.13 Provide text links to emulate server-side image maps
- 1.14 Use client-side image maps rather than server-side image maps where possible
- 1.15 Ensure that scripts and applets that provide the only source of important functionality are directly accessible or compatib
- 1.16 Ensure that pages are usable without support for scripts, applets, or other programmatic objects
- 1.17 If you cannot make a page accessible, provide an equivalent accessible page
