June 19, 2024


Bring Out Techno

Web Accessibility: Web Design for the Mobility-Impaired

Mobility impairment isn’t always as obvious as you might think it is. You don’t have to imagine extremes of disability like paralysis or missing limbs. Try imagining a simple fall or other accident that results in both hands in a cast and unable to use a mouse. Now, with that in mind, open your website in your browser, put an unsharpened pencil in your mouth, and try to use the eraser to push the TAB key till you get all the way to the main content of your page. With a properly placed “skipnav”, one TAB key click gets you to the link, and a click on the ENTER key gets you to the main content. That’s accessibility. It’s the web equivalent of an entry ramp.

A skipnav is a link placed at the very beginning of the page (before any other page content) that allows a user to skip all the top-bar and sidebar navigation links and go straight to the main content. It’s generally a simple text link placed either in the beginning of the header or in a separate DIV prior to the header. It’s one of the very few pieces of page content considered acceptable for cloaking (matching text color to the background color or using CSS to size it or slide it off-screen to make it invisible to the user.) Like most accessibility options, it exists primarily for disabled users and doesn’t have to be visible to be useful.

Web design for limited mobility also includes checking your scripts to see if your behaviors are mouse-centric. Without touching your mouse, try to get around your site. There aren’t perfect keyboard equivalents of all mouse events, but the major ones are pretty basic. If you have a CLICK event, add the same KEYPRESS event. If you have a MOUSEOVER event, add the same FOCUS event. If you have a MOUSEOUT event, add the same BLUR event. Accessibility is about making the page useful to everyone no matter how they get to it or have to get around it.

The ACCESSKEY value of the anchor tag is another good and far underused feature to add to your navigation system. Even though it’s not currently supported in some browsers and browser versions, it’s one of those things that doesn’t hurt your page by being there. Browsers that don’t support it just ignore it. Users hold the ALT key (the CONTROL key for Mac users) and press the specified, single, alphanumeric character to either set focus on or activate a link depending on the browser. It allows you to set keyboard shortcuts for primary site navigation.

Other aspects of mobility impairment related to computer usage may not occur to you initially. These include slowed reflexes, lack of coordination, tremors, ticks, palsy, arthritis, and anything else that might make a user’s hands uncooperative. I, for one, have a hard time double-clicking fast enough (due to nerve damage) for the computer to register it as such. Therefore, avoid page design that relies on a site visitor’s speed and eye/hand coordination-unless, of course, you want your page to feel like a video game. Avoid single character or single digit hyperlinks on a page or image maps with tiny hot spots. (I know, scripted image maps are a whole other issue.)

You would not believe the number of web pages I’ve been to that use words like “I” or the number “1” as important content links. Try to hit that after six cups of coffee. Our goal isn’t to make it harder for site visitors to use our sites; it’s about making it easier and more intuitive. That’s usability. It’s the web equivalent of a well-ordered office directory posted clearly on the wall with neatly labeled signs on every door.

I know that these things will require a little extra time and effort, but they’re worth it. It’s just not that hard to imagine yourself in need of them.