Reinhard Stebner provided an engaging talk on Web Accessibility this evening at MICA. This post contains a few of my favorite highlights. I’d like to note here that Bill Mill is a good sport.
I’ve read and thought a lot about Web Accessibility. I’ve used JAWS to test sites and worked to make Flash more accessible in client projects. Yet, it’s so valuable to watch a skilled, unsighted user like Mr. Stebner navigate a system. Just as no two people will use Microsoft Excel the exact same way, there are many ways to use JAWS and Windows Eyes. And just as each Web browser handles CSS slightly differently, accessibility software varies from product to product.
Jaws will ignore display:none;
in css and Windows Eyes will not. Instead, Mr. Stebner suggests using positioning to handle things we don’t want to be visible (top:0; left:-9999;
) and then dealing with the hidden items contextually with labels.
He emphasized usability vs. accessibly and demonstrated how sites can be technically accessible and yet hardly usable. Having a highly usable site is a win for everyone. That’s common sense and therefore not always achieved. Headings should be used appropriately, as many people will navigate a page through its headings. They should be meaningful and used correctly. Specifying a tab-index is a bad idea, as it makes the arrow-key functionality not work and many people use arrow keys to navigate content. Documents shall be organized so they are readable without requiring an associated style sheet.
The item that gave me the most to think about is the idea of using lists to organize links. In HTML, a list is a collection of things. Putting a navigation structure, which is just a collection of hyperlinks, in a list is supposed to allow screen readers to pause between each link instead of reading all the links as a sentence. Semantically, this makes sense. We use HTML to apply meaningful mark-up to content – making things lists seems like a good idea. Yet, there’s no easy way to identify a list as a set of links, so a page with 12 sets of links can be very confusing. He demonstrated this with Jaws.
We touched on ARIA as a way to help deal with some of this, and instead of using lists for links, he would like to see more <div> and <spans> used.
I’m really glad I had a chance to see some examples of what works well and doesn’t with JAWS. And, I didn’t know about a JAWS feature called Virtual View, which allows the visitor to access extra information about the DOM, like class and id names. This supports the notion that class and id names should be as semantic as HTML itself.
It was a great talk. Please note that Mr. Stebner also provides accessibility consultations, should anyone want to hire him for his services.