98: Accessibility testing, tools, and QUAIL - meet Kevin Miller

I spoke with Kevin Miller, lead web developer at Cal State Monterey Bay. He's been working with Drupal for more than six years and is making great contributions, especially in the area of accessibility.

On Drupal and Open Source

  • My favorite thing about Drupal, "is that I can take a rough concept and get working prototype together within a few hours. That really helps our clients visualize what they're trying to do rather than doing a lot of handwaving."
  • My favorite Drupal module: Arr!
  • My job, "is to translate what people want into what they actually need."
  • The value that open source brings, "to a university, an institution with a blended environment of both open and closed source ... If you're trying to use a closed-source product in the way that it's intended, then you can probably succeed just fine. But when you're trying to stretch it out or make one project work with another project, unless you're a large client and somebody's going to listen to you, you're probably not going to get heard. Open source gives us the flexibility to take technology and make it work for our unique use-case and not have to go begging to a vendor."

The Conversation Video - 20 min.

Accessibility and Drupal

With "several people in my life who use assistive technology," Kevin became interested and active in web accessibility issues, "not from the web developer's perspective, but from the perspective of the legally blind having difficulty turning homework into a learning management system [LMS]. When I think of accessibility, I always think of that quality of life issue for users who are prevented from doing things that we take for granted because someone was not thinking about accessibility."

Kevin says that many of the proprietary accessibility solutions on the market are more about "CYA for legal requirements and showing sure diligence, but they don't translate will into making a website actually more accessible."

QUAIL Accessibility Information Library

"QUAIL was started because I was angry using one of those traditional tools. I was rage coding, I said, "How hard can it be to select an image that's missing an alt attribute on the page?' QUAIL 1.0 was written in PHP. It was the first attempt to translate accessibility testing into an open source project." PHP at the time was not completely up to all the tasks necessary, "On the train back from DrupalCon in Colorado, I threw everything away and said, 'Let's rewrite this in jQuery!'" This offloaded things like the parsing of the DOM and CSS to the browser, which is better suited to these tasks.

QUAIL 2 has a suite of over 200 tests for things like meaningful image alt attributes, too much flashing in animated Gifs, poor color contrast in CSS, and much more. On top of QUAIL, "Drupal needs a layer that lets site builders select tests and to test content for content authors.

That's where the Accessibility module comes in to play. It has a base API module for developers to use as they see fit [and integrate accessibility testing into their own code and modules] and it has sub-modules for checking content" both on pages a user has edit rights to and during authoring in WYSIWYG editors. "Just like the red, squiggly live for spelling errors, we can do that for accessibility problems."

The Accessibility Themeing module helps themers determine the source of any page element. "Accessibility is also integrated with test swarm, so you can do automated browser testing for accessibility in your site." There is a "nascent reporting module" that surveys your site and can produce a report about accessibility issues. Here's where this gets even more interesting: "If you used it with something like the Statistics module, you could focus your efforts of making the biggest impact" by building a report of the biggest, most common errors on the pages with the most visitor traffic.

The Drupal Accessibility Module in Action

Screenshots of the Accessibility module's workflow. Click the thumbnails to see larger images:

  • thumb_content.png
  • thumb_wysiwyg.png
  • thumb_accessibility_content2.png

Resources & Where You can Help