Built-in Accessibility in GWT 1.5 Applications

Posted by Andrew Bowers - Friday, September 05, 2008 at 10:42:00 AM

As websites and applications become more interactive, users relying on assistive technology can find navigation difficult. Dynamic web applications are often written in ways that screen readers -- which interpret visual interfaces by speaking out loud or producing braille -- have difficulty interpreting. A developer building a tree widget, for example, might use a list element that has been altered to behave like a tree control. By default, a screen reader would present the control as a list, making the tree unusable for blind or visually impaired users. Screen readers also generally treat HTML span or div elements as regular static text elements, regardless of the presence of JavaScript event handlers for user interaction. You can easily imagine how this causes problems.

However, there's hope on the horizon in the form of WAI-ARIA, a specification for making web applications accessible via a standard set of DOM attributes. Currently a work-in-progress at the W3C, WAI-ARIA describes how to encode the purpose and function of a widget so browsers and screen readers can work together to properly identify widgets made up of DOM elements.

To make applications built with GWT more easily accessible, we've added accessibility support to the GWT library by baking ARIA roles and states into our widgets. With the accompanying ARIA support in Firefox and Opera (and soon, WebKit and Internet Explorer), applications built with the latest release of GWT will provide the information needed by screen readers such as JAWS, Window-Eyes, and FireVox. The ARIA support in the end-user tools is a bit of a moving target, but we've documented what works and what doesn't at present, so your application can evolve with the web.

If you've built your own widgets, you can make them accessible with the new Accessibility class, and to test out your newly-accessible widgets, you can watch for the ARIA attributes with a DOM inspector like Firebug. To check for the appropriate accessibility events, you can use a tool like Microsoft's Accessible Event Watcher -- or just install FireVox and listen to your application read aloud.

For more on ARIA and how to make sure your GWT application is easily accessible, you can read up on Accessibility in the GWT Developer's Guide.

No comments: