Infinite Web Design

(via Boing Boing)

Valour-IT is a non-profit that is providing wounded U.S. soldiers with laptops loaded with voice recognition software. These laptops help soldiers who are struggling to cope with new disabilities to communicate with family and friends and empowers them by providing a tool they can use even without the use of their hands. This is a great cause and well worth your support if you have even a few dollars to spare. You can donate online or by sending a check through the mail.

This is a great opportunity to bring up again the topic of accessibility and how important it is that the web sites and software we build be made as accessible as possible to help out those who can’t use a keyboard, mouse, and monitor effectively due to disabilities. Accessibility on web sites is often talked about only in terms of working with screen readers for visually impaired people, however there is a wide range of disabilities such as motor impairments as a result of injury that can keep someone from using a web site. While it’s not sexy or even very interesting to most customers, focusing on accessibility is good business because it opens doors to customers, and it is simply good, by helping out those who are already struggling to overcome a disability.

(Cartoon from Cox & Forkum, purveyors of fine political cartoons)

Bobby van der Sluis has been making a great many inroads into the world of unobtrusive JavaScript. I recently adapted one of his scripts for use on a project and thought I’d share a couple of simple modifications that I found useful.
Continue reading Unobtrusive Tabbed Content

(via Jonathan Snook) Roger Hudson has posted a nice primer on using tables in HTML to display data. We quotes the W3C specifications and walks through some clear examples on how to properly use tables in HTML. It’s good to see resources like this that explain how to create data tables that are accessible for all users.

Hudson links to a number of resources at the bottom of the page but he leaves out a very useful post by Roger Johansson at 456 Berea Street. I’ve drifted away from posting basic HTML and CSS instructions here of late, hopefully these resources of of some interest.

I recently went to try online banking with National City only to come face to face with the following error message:

Alert - browser does not meet requirements

Your browser does not meet minimum security requirements for Online Banking. If your browser does not support 128-bit encryption, you will not be able to enroll in Online Banking. In addition, your browser version must be Microsoft® Internet Explorer 5.0 or higher, or Netscape Navigator® 7.0 or higher

I am browsing using Firefox 1.0.3, which shares a rendering engine with Netscape 8.0. However, the developers behind National City’s website have chosen not to recognize this browser. I’m guessing Safari, Opera and other modern browsers are also locked out of the online banking fun. Please note that this isn’t meant to be an attack on National City, they are only one of many sites that lock out users based on their browsers and I’m sure they are not malicious or bad people. I am disapointed that the bank I bring my money to has a substandard website and that got me thinking about the larger problem of locking people out of sites based on their choice of browsers.
Continue reading Missing the Point: Web Applications

IBM and Montrose Secam have partnered to release an adaptor for a computer mouse that will help users with hand tremors use pointing devices. The devices cost approximately $100 (US) and are available for sale online.

The adaptor plugs into the PS/2 post and the mouse then plugs into the adaptor. If the computer lacks a PS/2 port there is a PS/2 to USB adapator available. The adaptor compensates for the tremors by filtering unintended hand motions, sending only the intentional hand movements on to the computer. It also compensates for difficulties with double clicking. This project was started by an IBM researcher named James Levine.
Continue reading Mouse Adaptor Compensates for Hand Tremors

Ajax is a set of technologies that is used to rewrite part of a web page without a complete page refresh. Jesse James Garret coined the term to describe a set of technologies currently coming into their own. This happens by using JavaScript to send a request to the server for information and then using DOM based JavaScript to rewrite a portion of the web page with the data that is returned.

Using this method allows for complex form validation while the user is filling out the form in stead of and in addition to validation following submission. This means that a user can enter their ZIP code for their shipping address and see the shipping charges added to the form before they move on or they can see that the username they want is already taken and have some suggestions shown to them as they type.
Continue reading Using Ajax Wisely

One area where there is a lot of confusion in accessibility is the use of alternate content. There are questions about where it belongs, what form it should take, and whether it is acceptable or not. I’ll be addressing a few of the basics here. We’re going to leave more advanced questions like what to do with multimedia content for a later entry.
Continue reading Alternate Content

I’ve been looking into Flash Accessibility for a number of projects and I’ve been cautiously pleased by what I’ve seen. It looks as though the Flash player version 6+ and Flash MX 2004 have incorporated a bunch of new accessibility features that allow them to work better for average users as well as for users with serious disabilities. The Flash player now hooks into the MSAA in Windows to work with screenreaders. Flash is also good for such things as text zooming (and image zooming) and you can actually outdo browser support for accesskey attributes by using keylisteners to provide keyboard shortcuts within your .swf.

It looks as though Flash is headed strongly toward being capable of delivering highly accessible content that will work for users with a range of disabilities.

A few things to keep in mind when building Flash movies:

1) Don’t keep everything moving, especially if users have to interact with it. While swirling navigation may seem cool as a concept it can be a nightmare for users with visual or motor impairments.

2) Make sure that motion and sound are turned on by users rather than turned off. Start video or audio after they hit the play button and make sure it can be turned off. Turn off animations until triggered by a deliberate user action.

3) Clearly mark what links keep users inside the .swf and which ones take them outside of it within your site or to an external site.

4) Always provide a child element in the object tag when placing a .swf in an (X)HTML page that serves as alternate content in case users can’t or don’t have the Flash plug-in.

5) Make sure that you set the tabIndex for everything in the movie and make sure it makes sense.

6) Turn accessibility features on for all elements, except for animated text tat will cause screenreaders to keep going back to the start of the page. Provide names and descriptions that will be useful when read to a user.

7) Use keylisteners to simulate accesskey functionality. You can create shortcuts to navigation and functionality in the .swf. Be sure to tell users what the shortcuts are early in your movie or your effort won’t really help anyone.

8) Make sure that all of the functionality works from the keyboard, if you use inaccessible components like sliders be sure to provide a keyboard interface for users with severe visual or motor impairments who cannot use a mouse.

These are just a few of the ways that you can make your .swf more accessible and usable for all users. If you have further suggestions feel free to add them in the comments.

I’m removing the entry on the W3CAG due to a mistake on my part regarding the scope of a non-disclosure agreement. I had thought that the material would be okay to post since it was taken from the W3C guidelines, not realizing that I had transformed it into an internal process that was protected under my contract. This was an unintentional breach of professional ethics and should serve as a lesson on how a little ignorance can harm others. To compensate for my mistake I promise to create a new tutorial on accessibility on my own time (using my own material) that will go up here this week. I apologize for any inconvenience this mistake may have caused.

In the meantime you may go to www.w3c.org to read their accessibility guidelines.

If you are looking for the information on validation go to validator.w3.org.

After reflecting on this for a little while I think it is important to note that, while such an error could seem trivial in this instance, it is important to be aware of your commitments to those you do business with and to always hold to your promises, particularly those regarding confidentiality. Trust and credibility can be lost through a seemingly small action and can be impossible to restore once they are lost.

As information professionals we must always try to be aware of the confidence placed in us by our employers and clients to safeguard their private information. In order to do our jobs effectively we must have access to a great deal of information, often of a sensitive or proprietary nature. Even unintentional slips like mine undermine the trust that has been placed in us. I hope that my story can serve as a cautionary tale for those of you who, like me, believe in the freedom of information and the sharing of knowledge but also bear a responsibility to those who you do business with to protect their private information.

I’ve started work at Ford in the Creative Design & Usability group. I’m working on ensuring a number of websites comply with the W3C Accessibility Guidelines (W3CAG). I’m going to try to post about my experiences without violating any NDAs that I’ve signed so please understand if I sometimes avoid getting too specific about my projects.

Anyhow, I’m also trying to follow up on the request for more information on process so I’ll try to kill two birds with one stone by describing the process I am currently putting together for testing web sites for compliance with the W3CAG. I’ll be posting a step by step process that will walk you through the relevant guidelines, the (mostly free) tools you can use to conduct the analysis, and the format for reporting the information to a developer if you aren’t making the changes yourself.

I should be completing these reports in the next day or two and I’ll try to get them up here so you can use them or discuss them. I’m pretty confident that since they simply discuss how to use the W3C guidelines and a bunch of widely available tools I can post it here without a problem.

If you have conducted a similar accessibility analysis in your work I’d certainly like to hear about how you went about it, what tools you used, what your process was, and what sort of results you had in the end.