1. Accessibility & Legislation
  2. Common Issues
  3. Testing & Tools
  4. Analysing Your Site

2.02.01 JavaScript usage: Overview

JavaScript Accessibility Issues

JavaScript allows developers to add increased interaction, information processing, and control in Web-based content. However, JavaScript can also introduce accessibility issues. These issues include:

A Web page containing JavaScript will typically be fully accessible if the functionality of the script is device independent (does not require only a mouse or only a keyboard) and the information (content) is available to assistive technologies.

Unfortunately, there is no easy fix that can be applied to solve all accessibility problems associated with JavaScript. The only way to ensure JavaScript accessibility is by evaluating each individual script and devising a unique solution to the accessibility problem it poses.

JavaScript that does not impact accessibility

JavaScript is sometimes used to create visual interface elements that do not affect accessibility. JavaScript is commonly used for image rollovers, where one image is replaced with another when the mouse is placed above it; for example, when a navigation item changes to display a shadow, glow, or highlight when the user mouse-overs it.

Place your mouse over the following image to see a JavaScript example that does not impact accessibility.

Up arrow

Problems

None. In this example, there is no important content or functionality introduced by the JavaScript. The swapping of images is purely cosmetic.

Solution

No additional accessibility techniques are required. Remember, the image itself must have alternative text (i.e., <img alt="up arrow"...>).

These days image rollovers can be better accomplished using CSS. See image rollovers without using JavaScript for further details.

Question 1

True of False? It is improper to modify an image cosmetically (i.e., adding a drop shadow or border) using JavaScript?