ATRC ARIA efforts in 2008

With funding from the Mozilla Foundation and IBM, in 2008 the ATRC continued to help communities add support for accessible DHTML using ARIA. This meant a whole whack of little things, including frequent emails and chats, and some other things, like code commits, testing infrastructure work, document editing, and committee work.

My primary role was to help make sure Web2.0 communities knew about ARIA, and to help them with any implementation work through what amounted to a mutual-mentorship. I'll discuss deliverables related to this evangelism-ish goal first, and then move on to some more specific community work. Then come back at the end with some brief thoughts on the evangelism aspect.

Initially and iteratively I worked with Aaron Leventhal on strategic ways to spread awareness of ARIA. At some point we realized developers needed a place to go for sample code, and hey, code talks, baby.

codetalks.org

We started to see additional people and communities providing great resources about ARIA. As specification and best practices work continued in the W3C, we realized it would be nice to provide a central hub for all the ARIA activity and evangelism that was happening "in the wild". Together this community created a 'vendor neutral' wiki: wiki.codetalks.org, as well as an svn code repository, and bug database. These sites are hosted by the ATRC, and we plan to continue hosting them as long as they are useful. Aaron created a free-aria google group for, not surprisingly, the free discussion of ARIA. Oh, by the way, any readers good with logo design?

W3C PFWG ARIA team

Given my prior work on Dojo Toolkit Accessibility, and my colleague Joseph Scheuhammer's work on the Fluid Project, we were invited to join the ARIA specification efforts as 'invited experts'. Our input to the discussions came primarily from actually trying things out, and our work on Dojo and jQuery.

DHTML Style Guide

The ATRC continues to attend and contribute to the DHTML Style Guide meetings which address keyboard bindings for DHTML widgets.

jQuery UI

A core contributor is leading the ARIA effort here, and I feel it is in good hands, with a decent community effort; so in a sense, "job done!" The community has not finished of course, but we've got a pretty clear roadmap ahead, and we've made some good progress. As a major redesign (in UI) moves forward so does the opportunity for further ARIA support. We've added the core ARIA support and it takes about a day or two to add ARIA support, with automated tests, to a jQuery UI 'plugin' (think 'widget' or 'component'). Adding polished keyboard interaction can take longer. The ATRC's Fluid Project team, having already worked through a lot of keyboard and navigation issues on top of jQuery, is now moving this know-how upstream and working with the jQuery UI community.

Dojo (Dijit)

We continued to work with the Dojo community on dijit, the mature and accessible widget set, with a focus toward helping sustainability. Joseph was our main resource for this work and initially focussed on grid widget keyboard accessibility (non-trivial) and spent a fair amount of time doing QA, including manual tests. Later he created automated UI tests using a robot currently found in Dojo's test harness: D.O.H. and has worked to move ARIA smarts into Dojo core.

ARIA Evangelism

One thing I've struggled with in the evangelism part of our grant is knowing when we are successful, or even when we are finished. Other browsers and toolkits are adding ARIA support, but how much did the ATRC help make that happen? Did we use the right amount of pressure? Did we help enough? I think we'll never know.

One thing I do know is that the Mozilla Foundation likes to seed activities that fit its wonderful manifesto/mission. I can say that in this respect the Foundation has been very successful here, and that the ATRC continues to pursue and win funding that will allow us to continue to focus efforts on open web accessibility now and into the future.

Finally, all this experience is helping me in my current gecko work!

Using .attr for ARIA in jQuery UI

Last week I found some time to hack on jQuery UI again. After talking to Scott we decided to pull the ariaRole, and ariaState API out of UI core, and put the browser normalization for ARIA right into the popular attr function where it belongs.

At this time, jQuery UI is a dependency for this enhanced attr function. We add the ARIA smarts in ui.core.js via proxy function, like this:

// proxy attr
var attr = $.attr;
$.attr = function () {
    // if aria usage then normalize
    // else
    attr.apply(arguments);
};

See the patch for the real deal. You might notice that we actually only proxy if a naughty browser/version is sniffed. Let's hope this ARIA normalization business won't grow too big and complex when the other browser ARIA implementations roll out. If we can keep it small and tight the attr enhancement really belongs in jQuery core. Or maybe it belongs there regardless? If you are doing Web2.0 development you're probably going to need it.

Here's an example of how one might use chaining to add the ARIA role of "tab" to all elements with a class "ui-accordion-header), and the ARIA state "aria-expanded=false", and add the ARIA role "tabpanel" to the next sibling of each (which happens to be the panels).

$(".ui-accordion-header")
    .attr('role','tab')
    .attr('aria-expanded','false')
    .next()
    .attr('role','tabpanel');

Working with Scott González and others on jQuery has been a very meaningful aspect of my Mozilla Foundation grant. Thanks Mozilla.

Thanks for reading.

WAI-ARIA evangelism, dojo, jQuery

A portion of my time these days is spent evangelizing the Web2.0 accessibility solution: WAI-ARIA (for Accessible Rich Internet Applications). In 2007 I had a lot of fun working with Becky Gibson, Simon Bates, and others to make the dojo toolkit widgets (dijit) fully accessible with keyboard control, high contrast mode support, and ARIA semantics. In the end we ended up doing a most of the code, and the testing, ourselves. We knew even then this was not ideal and what is really needed is to make accessibility part of the core widget design and creation process. If not that, then at least to engage a few core dijit contributors, ones that have been around a while, and will stick around in the foreseeable future. Becky, and another colleague of mine, Joseph Scheuhammer continue the Dojo accessibility effort now. Dojo accessibility is still healthy.

Now it is 2008, and I'm onto a new project, with a role that essentially boils down to: help glue a viable ARIA ecosystem together -- connecting browser, toolkit, and AT (assistive technology) efforts. One piece of this puzzle is helping the jQuery community add ARIA semantics into jQuery UI. In this particular effort I am enjoying working with my colleague Michelle D'Souza who is also busy keeping the Fluid team engine running with her agile-fu. What is different this time is that we are trying our hardest not to dive in and write the code, and to avoid being perceived as the accessibility silver bullet.

Enter Scott González, respected jQuery UI contributor. In tackling ui.dialog we worked with Scott (and to a lesser extent Paul Bakaus), to add keyboard and ARIA support. With Scott's help we put some basic support for ARIA into ui.core, and added a role of "dialog", and aria-labelledby property that points to the dialog's title ID. This means that when focus goes to the dialog, a screen reader will announce that focus is in a dialog, and the user can query for the name of the dialog. Two function calls and we go from zero, to full accessibility. What is important here, is that Scott was keen to jump in on this work, and in the end he came away with an understanding of ARIA (and we came away with a better understanding of jQuery UI).

It would be relatively simple for us to go ahead and add ARIA semantics to the rest of jQuery UI, but we shouldn't. We absolutely must be patient and it is paying off. Scott is helping organize the jQuery ARIA effort, which is awesome! Equally awesome, the filament group is joining... but more on that later.

Thanks for reading.

jQuery UI 1.5 released!

Congratulations to the jQuery UI community on this important milestone (see Paul's post). I'm really excited about the next major milestone being being fully accessible with WAI-ARIA semantics! We'll be chatting with Paul this week about getting this ball rolling again. Anyone who is interested in helping out, please watch (y)our jQuery Accessibility (Google Group). Good things coming.

ARIA News: Marco's Tips, jQuery, dojo

Marco has begun his promised blog series on ARIA tips! Marco, a bright new Mozilla employee is someone to listen to; he's close to the metal with respect to making accessibility work and is respected in the accessibility community.

If you are a DHTML developer you must subscribe to Marco's blog; or perish.

Oh by the way it is about time I did some other name drops. Colin Clark and I are going to be talking to John Resig and Paul Bakaus on Monday to see how we can help their community make jQuery UI rock even more with ARIA and other goodies.

We (at the ATRC) continue to help the dijit community add polish to the dojo toolkit's solid ARIA and keyboard implementation.

ARIA support is growing.