WebA11y

• Managed a SLOW 1.5 mile jog, walked the 2nd half. Will see how hip tendinitis is. Gotta start somewhere! #
• Sitting on the deck sipping sangria! Finally some nice weather! #
• off to tackle making drag and drop icons for dojox.DataGrid column reordering visible in high contrast mode - a11y job security, I guess! #
• keyboard navigation of hidden columns checked into the dojox.DataGrid as well as keyboard navigation into grid with hidden headers. #Dojo #
• trying to implement accessible bubble help - finding it is more difficult than I anticipated. Using Dojo dijit.TooltipDialog seems easiest! #

Powered by Twitter Tools.

• just checked in updates for Dojo drag and drop low vision accessibility http://tinyurl.com/dz2mzc #Dojo #A11y #
• making good progress implementing keyboard navigation past hidden columns in Dojox DataGrid - wondering what I missed! #Dojo #

Powered by Twitter Tools.

• just checked keyboard column resizing into dojox DataGrid. Still some bugs to work out but making keyboard a11y progress! #Dojo #
• Hey, I made the IBM Human Ability and Accessibility Center Events page! http://tinyurl.com/5vpcgl #
• interesting discussion of ARIA role=presentation in Free ARIA google group: http://tinyurl.com/cbzz86 #
• trying to fix dijit unified event handler to deal with space, enter and click in one place- differing browser behavior is frustrating! #Dojo #
• ARIA support for Google Calendar, Finance and news: http://tinyurl.com/dlfpmy #
• ARIA support for Google Calendar, Finance and News: http://tinyurl.com/dlfpm #

Powered by Twitter Tools.

Say you have a set of invitations to connect to colleagues in your favorite social networking software. These might be listed one after another with an accept and reject button associated with each request. But, if someone is using a screen reader to just tab through the buttons on the page, how would you know which button is associated with each invite? Certainly the designers are not likely to want to put the user name within the button text, so how can we make this easier for the person using a screen reader or screen magnifier to access the page?

There are several different ARIA properties you could use. I created a sample page using 4 different strategies aria-labelledby, aria-describedby, aria-label, and the title attribute. See Augmenting Button Text with ARIA. I’ve included code snippets so you can see exactly how the techniques were implemented.

The first approach was to use aria-labelledby to label the button using text containing the associated user name placed within a span that is placed offscreen using CSS. Since the text is positioned offscreen it will not be seen but will be spoken by the screen reader. This seems to work the best with the various screen readers and ARIA supported browsers. However, it does require additional text and the use of CSS to place it out of view.

The next approach uses aria-describedby on the button to point to a span containing the User name text . This would augment the Accept and Reject button with the user name. This requires no additional text, you just need to include an id on the span (or other element) containing the user name text. This was not consistently supported in the browsers and screen readers.

Adding an aria-label onto the button element with the label for the button is easy enough. It does require the extra text as the value of the aria-label attribute but is easy enough to implement. Unfortunately, there is no current browser support for aria-label but it is coming in the next release of Firefox.

And lastly, just adding a title attribute on the button with the additonal information about which invite user it is associated with. This has fairly good support but does depend upon the user screen reader settings.

I compiled the results of testing with Firefox 3.0.8, a daily Firefox/Minefield build, and IE8 with JAWS 10, Window-Eyes 6.1 and NVDA 0.6p32 so you can compare the results and draw your own conclusions.

Hopefully the ARIA examples are helpful as well - I’ll try to do more!

• just read interesting viewpoint article on Computing as a Social Science in April issue of Communications of ACM: http://tinyurl.com/cu5pqf #
• first pass implementation to make Dojo Dnd icons accessible to low vision: http://tinyurl.com/co9×7t and http://tinyurl.com/cullxt #Dojo #
• sure glad I didn’t tweet about the 200K+ hits on my slideshare posting http://tinyurl.com/cztxmg #
• Just blogged about A11y Improvements to the 1.3 Dojo DataGrid http://tinyurl.com/dhcecq #Dojo #
• Just updated the a11y docs for the dojox.grid.DataGrid http://docs.dojocampus.org/dojox/grid - see the accessibility section. #Dojo #
• Just added myself to the http://wefollow.com twitter directory under: #accessibility #webdeveloper #photography #

Powered by Twitter Tools.

Well, better late than never sharing my thoughts on SXSW! Thanks to Sharron Rush of Knowbility.org for organizing, I have been able to participate with her on accessibility related panels for the past two years. This year Sharron and I presented Ajax Accessibility: An ARIA Duet and I was also able to do a short presentation on WAI-ARIA at the More Secrects of JavaScript Libraries Panel. Presenting at the More Secrets panel gave me access to a large audience of JavaScript programmers to introduce them to WAI ARIA and explain how they can make their Web apps more accessible. I also got to show how Dojo has implemented ARIA and how other toolkits are adopting it as well. I think this introduction enabled us to pull more people into the Ajax Accessibility panel on the next day!

SXSW is a “cool” conference that combines the Web, Film, and Music and is thus very “youth” oriented with what seems an audience predominantly under 35 years old. Although, I was happy to see many faces in the over 40 and over 50 category as well! I heard that the attendance was up from last year which is a bit surprising but I guess indicates that perhaps tech hasn’t been hit quite as hard by the economic downturn. I was happy to see several panels and discussions that included accessibility:

Making Web Widgets Accessible: Tools and Techniques
Accessible Flash and Flex Applications
No Web Professional Left Behind: Educating the Next Generation
2009 WaSP Annual Meeting
Universal by Design
Deafness and the User Experience
Hack Ability: Open Source Disability Tech
Universal Design for Web Applications: Web Applications That Reach Everyone

I didn’t get to all of these, but I did my best! It is hard to get to all of the interesting talks at SXSW. I did attend Presenting Straight to the Brain and found it fascinating. I present code related topics often and do use many bullet points. The presentations by these folks were much more compelling and eliminated the bullet point overload. However, it did make me think how I would present something with less text, more talk and more pictures to a hearing impaired audience or to those who might rely more heavily on written words. I think the moral of the story is to have handouts with the full notes
for the session available to those who need it at the beginning. I’m hoping I can incorporate some of what I learned in my future presentations!

The Core conversation on Getting Things Done the Simple Way was packed - too many people squashed into a tiny room! I understand the idea behind conversations but when they get so large it kind of defeats the purpose. I know that Getting Things Done is popular but I guess I never realized just how popular and almost cult-ish it is! The misery of striving to say organized loves company, I guess!

There were plenty of “accessibility folks” at SXSW and it is nice to get a chance to see so many of my colleagues and meet new ones at parties and over drinks! There is a big Technology & Persons with Disabilities Conference the following week which may folks also attend (this was my first time not attending after 5 consecutive years). Thus, some of the folks from other countries combine the travel and attend both SXSW and the technology conference (referred to as CSUN since it is hosted by the California State University at Northridge - CSUN).

The podcast to the More Secrets of JavaScript Libraries Panel has been published. I’ve transcribed my part and posted more info at SXSW 09 Presentations.

FYI: I’ll be speaking at Knowbility’s John Slatin Access U in May, 2009. This is a great way to gain Accessibility and Design Knowledge! Check it out - early registraton discounts end April 10!

I joined the ranks of twitter recently but I feel more like I quack rather than tweet! It was fun at first to post what I was doing or where I was going but then I realized twitter is much more than just social. I decided to use twitter to increase my knowledge of accessibility and started searching for, finding and following folks in the accessibility field. Many of these are people I already know and I was relieved that they wanted to follow me, as well. I have already found some great folks to follow to keep me up to date on new a11y developments as well as users of all sorts of assistive technologies. Certainly twitter can be a great learning tool!

However, my problem lies in learning to tweet. I wonder how and where these folks find all the interesting things to tweet about? For some it is things they learn at conferences; for others it is the daily frustrations of using an inaccessible Web, for many it is sharing knowledge from their daily work. I, however, seem to fall short. Even when something interesting gets delivered to my mailbox I don’t seize the opportunity! For example, my colleagues in the Human Ability and Accessibility Center just released a new version of AccProbe - a tool for examining and testing Web sites for accessibility. I got an email, as did others in a subscription list, but I didn’t even think to send a tweet - someone else beat me to to it! Right now I am working on the dojox DataGrid code to make it more accessible. While I could probably tweet on the details of the DataGrid code, I’m not sure many folks would be very interested in the JavaScript details! Maybe I don’t spend enough time surfing or checking my RSS feeds, although I certainly don’t seem to have extra time in my day to do any more Web crawling. Then, I thought, I must just waste too much time on other non-work stuff but, I don’t think that is it either - after all, one must have some balance in life.

At any rate, this post hasn’t contained all that much about accessibility - other than I’ve found a new tool to keep me up to date in the a11y world. I guess eventually I’ll learn to tweet better or else I’ll just have to enjoy the benefit of learning from the wonderful songs of others!

Great interview with Stevie Wonder from Click - BBC’s Technology Programme. The video interview is 15 minutes long but there is also a written synopsis. It was interesting to hear Stevie’s use of technology and also his opinion on surgery to restore eyesight. I was pleased so hear the interviewer bring up the issue of manufacturers not wanting to make products accessible due to increased costs in order to accommodate a small market. Stevie was right back at him with a reasonable response.

The interview was held at the Consumer Electronics Show in Las Vegas in January 2008. I think it is great that Stevie goes to this show and engages with the manufacturers. He also visits the product showcase of the Technology & Persons With Disabilities Conference each March in Los Angeles (I’ve seen him there each of the 5 years I have attended). He is great about stopping to talk with folks and pose for pictures. Whether you like his music or not, he is certainly a role model!

Added February 12, 2008: Here is an additional story and interview from NPR (National Pubic Radio):

Those in the accessibility field have probably already seen this survey from WebAIM: Screen Reader Survey. If you haven’t seen it yet, it is worth a review. It is a survey of about one thousand screen reader users of varying ability levels. The most interesting information to me was the consistent trend that flash content can be difficult to negotiate. This is a bit disturbing given how many sites are now using flash to implement extra “pizazz.” It was also insightful that there were not strong trends about the use of alt text or link text. I think that many web developers struggle with how detailed to make alt text. I know that I’m never quite sure whether to add more detail at the risk of too much chatter. Give it a look and form your own opinions!

A colleague pointed me to the new whitehouse.gov site on the day of the inauguration. I was proud that he had already noticed that the site wasn’t particularly accessible - that means my a11y message is getting through! With all of the talk on the news about the new administration embracing the internet I expected a more accessible site. However, I was disappointed. That first day, I found an accessibility statement on the site that stated that folks has tried to make it as accessible as possible and the work was on going. I visited the site on Jan. 28, and I can’t find that statement, even via search. Updated, February 2: It seems that the search will not work in Firefox 3.0.5 when images are turned off. Normally when I search I am taken to a new page with the results. In Firefox with images turned off a new page does not load. It works ok with images on and in IE8 with images turned off. Thus, I was eventually able to find the accessibility statement.

While the site is usable with the keyboard and probably with a screen reader with a bit of coaching, the low vision support is pretty dismal. While the images seem to have alt text, there are CSS background images used for the main navigation bullets on the first page and the contrast is pretty low. I guess a low vision person could find the links at the bottom of the page but the site is very hard to use with images turned off.

I will admit that I never tested the whitehouse.gov site under the old administration - it may have been equally as bad. However, for an administration that used the internet during the campaign and that touts the inclusion of all in government provided by the internet, not providing an accessible site is very disappointing. I hope the developers and designers make a concentrated effort on accessibility. After all, they should have to adhere to US Section 508, too!