ARIA Plugins for YUI Widgets

By Todd KlootsOctober 2nd, 2008

For YUI 2.6, a handful of widgets have examples illustrating how to use new YUI ARIA plugins. These
plugins make it easy to use the
WAI-ARIA Roles and States to make each widget
more interoperable with assistive technologies (AT), such as screen readers, and in turn,
more accessible to users with disabilities. For example, the following video illustrates how the
YUI ARIA Plugin for Carousel improves the user experience of the new Carousel widget for users of
screen readers:

Using the ARIA Plugins

Using the YUI ARIA Plugins is easy. Simply include the source file(s) for the ARIA plugin after the
widget source file(s) as indicated on the widget’s landing page. That’s it. Currently, the source
files for each plugin are available in the
YUI 2.6 package on SourceForge, and can
also be downloaded from the YUI blog
sandbox. In a future release of YUI, the plugins will be served from our CDN.

Browser Support

All YUI ARIA Plugins require the user’s browser and AT support the WAI-ARIA Roles and States.
Currently only Firefox 3 and
Internet Explorer
8 have support for ARIA and are supported by several screen readers for
Windows that also offer ARIA support. Opera also has support for ARIA as of version 9.5, but
unfortunately isn’t supported by any screen readers. For this reason the YUI ARIA Plugins are only
enabled by default for Firefox 3 and IE 8. To enable the ARIA plugin for other browsers, simply the set
the usearia configuration property to true. For example:

var oMenu = new YAHOO.widget.Menu("menu-1", { usearia: true });

Why Plugins?

Rather than integrate ARIA directly into a widget, we chose to deliver this functionality as a
plugin for two main reasons:

• Performance: We’ve got many extremely byte-conscious users. And while we certainly
  don’t want users opting out of a more accessible interface, we need to be respectful of those
  developers that need to make tough choices on KB weight.
• The right fit: For most widgets (like Menu) there is an ARIA role that is a perfect match.
  For some, like Carousel, or AccordionView, there either isn’t a clear match, or there are several
  different roles that could work depending on the circumstances. For widgets that fall into this
  category we can offer several different ARIA plugins that meet the desired use case.

Widgets with ARIA Plugin Support

The following table illustrates which YUI widgets currently have an ARIA plugin, along with their
corresponding WAI-ARIA Roles.

Screen Reader Testing

We’d love the community to help us test these plugins, find bugs and suggest enhancements. As mentioned above, each plugin requires AT that supports ARIA. Two of the leading screen readers for Windows, JAWS and Window-Eyes, support ARIA. Free, trial versions of both are available for download, but require Windows be restarted every 40 minutes. For that reason, the open-source NVDA Screen Reader is the best option for developers looking to test the YUI ARIA Plugins as it is both free and provides excellent support for ARIA.