Home - Priority 1 Index - Priority 2 Index - Priority 3 Index - Accesskeys - Accessibility Validators - Contact

Web Content Accessibility Guidelines

1.11

Priority 1 Item 11

Make scripts and applets that allow users to interpret or access page content, or any other element that has its own interface, compatible with assistive technologies, and ensure that event handlers are input device-independent.

Ensure input device-independent

Both onfocus and onblur event handlers are device independent, meaning that they can be performed with the mouse, keyboard, or other assistive technology. The actions that are performed as a result of these event handlers must be analyzed to determine if they cause accessibility problems. Typically, these events do not cause accessibility issues unless they are modifying the default behavior of the Web browser or are interfering with keyboard navigation within the Web page.

Using onfocus
(Try tabbing to the links below.)

Number One || Number Two

Number 2

<a href="#" onmouseover="document.the_image2.src='../images/one.jpg';"
onfocus="document.the_image2.src='../images/one.jpg';" 
onmouseout="document.the_image2.src='../images/spacer.gif';" 
onblur="document.the_image2.src='../images/spacer.gif';">
Number One</a> || 
<a href="#" onmouseover="document.the_image2.src='../images/two.jpg';"
onfocus="document.the_image2.src='../images/two.jpg';"
onmouseout="document.the_image2.src='../images/spacer.gif';"
onblur="document.the_image2.src='../images/spacer.gif';">
Number Two</a>

Place your cursor within the following textbox to see an example of the onfocus event handler.

:

<label for="fname">Enter your name</label>: 
<input id="fname" type="text" onfocus="alert('Enter your first name only');" />

 

Why input device-independent?

Interfaces which do not provide flexibility in the type of device used to interact with them are inherently inaccessible. A laptop user may choose to work without a mouse. If this were the case and interactive features on a site required "drag and drop" interactivity as the only means of interaction, the site would be unusable. Similarly, a site delivered through a kiosk or public access terminal with only a touch screen interface would be unusable.

Developing device independent interfaces facilitates porting the site to the widest range of computing devices, including mobile handsets, PCs, and Interactive Voice Response systems (IVRs).

Screen reader users rely entirely on keyboard input and audio output for interacting with websites. Failing to provide support for audio output or the keyboard as an input device will make the site unusable for them. Other users may use voice input for hands-free operation in a busy office, or if they have dexterity limitations.

More Resources

JavaScript event handlers - WebAIM Techniques and Concepts.

Writing directly accessible applets - WAI recommended technique.

Guidelines on accessibility features provided in Java - Sun guidelines

View WAI checkpoint 9.2 - Ensure that any element that has its own interface can be operated in a device-independent manner.

View WAI checkpoint 9.3 - For scripts, specify logical event handlers rather than device-dependent event handlers.

View WAI checkpoint 8.1 - Make programmatic elements such as scripts and applets directly accessible or compatible with assistive technologies.