A client recently asked about "accessibility" and where we stood on compliance. This is not a question I hear very often, and it made me realize how much of an afterthought accessibility is for most designers and developers. Even though it has been a topic of discussion for years, accessibility still sits ignored at the kiddie table while grown up features battle over who gets the next piece of pie.

The reality is that disabled users make up a significant portion of the general surfing public and are as relevant as many of the visual browser compatibility issues we unquestionably toil with day-in and day-out.

Consider the following:

Roughly one in twelve people have some form of visual impairment (most commonly colour-blindness). That's 8% of your target audience! I have two family members with colour blindness, so I know how it impacts day-to-day life. UIs must take this into account and implementations must further support users with all types of vision impairment (especially those with little or no sight at all). Here are some useful resources:

  • Colour Filter
    Allows you to see your site through the eyes of a vision-impaired user by entering the URL of any publicly accessible site and choosing the type of colour blindness you want to test.
  • Color Vision
    Interactive color charts show the range of colours visible to users with varying degrees of colour blindness.
  • JAWS
    A popular screen reader that parses a website and reads the content aloud.
  • Lynx
    A popular text-only browser.

We have an ever-aging, increasingly computer-literate population that will experience deteriorated vision and mental capacity as they continue to age. The most common effects will be loss of sight, hearing, and memory. This makes a stronger case for having simplified interfaces and easy to understand instructions (e.g., OpenID is working towards creating user-centric digital identities, which will be a huge step forward for accessibility, as they will allow the aging population to keep one password instead of twenty). We have to stay in tune with these kinds of advancements and incorporate their eventual existence into our applications TODAY.

There are other disabilities that prevent individuals from using traditional web browsers for surfing the Internet. Some people have perfect vision, but have other physical conditions that may require them to use screen readers and/or text-based browsers.

Some of the things you can do:

  • Create a solid information hierarchy. Strip away the CSS on your site, download a screen reader, close your eyes and see if you can successfully navigate and understand its content. As long as your content is rendered in an ordered, sensible manner then users with readers and text-only browsers should be OK.
  • Do not rely on images, embedded objects, or colour to exclusively communicate to the user. Be aware, for example, that using green for good and yellow for caution will show up exactly the same for someone with dichromacy (moderate to severe colour blindness) or monochromacy (total colour blindness). If you feel that images are a necessary part of the workflow, ensure you provide a textual equivalent or supplement (such as a title tag, caption, etc).
  • Watch out for "Web 2.0" because it can wreak havoc in a screen reader. AJAX, dynamically populating elements, and moving text/graphics can all have issues for disabled people. If you use AJAX to populate content on-demand, a screen reader may not pick it up, and it will certainly not be displayed by a text-only browser unless it is already pre-rendered somewhere else on the page and hidden (which kind of defeats the purpose of on-demand). Dynamic sites are great to look at, interactive, and just fine to have, but if it gets too hairy sometimes the best option is to provide a separate, accessible alternative that presents your information hierarchy in a simple and concise manner.
  • Take into account that a mouse is the most common, but not the ONLY way to navigate a website. Try to build and actually use your site with JUST a keyboard. Most input devices on the market are designed to mimic keyboard actions, so ensure that your site has appropriate tab orders and even uses the "accesskey" attribute to assign shortcuts to key elements on your page.
  • Sometimes the path of least resistance is to create an entirely separate version of your site that does not use CSS, JavaScript, images, and embedded objects. It should also relay a clear, structured information hierarchy to users with easy-to-follow links to text-based interior pages.
  • Build with empathy. This is UE in its purest form and putting yourself in the shoes of disabled users isn't just a state of mind; it's a physical barrier that you have to simulate in order to be truly successful in engaging the bulk of your disabled audience.

Relevant links: