Tag Archives: assistive technology

Do you think about accessibility when designing a website?

Over the course of a typical web design project how often does the term accessibility come up? My guess is not at all or that if it does, it’s as an afterthought or “nice to have” feature which can be tacked on if time and budget allow.

Why is this? Because most designers and developers don’t have a disability and neither do the majority of web users. That, however, does not mean that the large, global population of visually, aurally, physically, cognitively or otherwise impaired people aren’t interested in the content or products you’re presenting.

Why is it important to change this all too common approach to accessibility? There are several key reasons. One is human rights. Everyone regardless of their abilities should have equal access to the content and communities available online. In some jurisdictions this is required by law, which leads into the second reason. You could get sued! Several high visibility cases from recent history have brought this issue to light. Finally, if with some planning and a little bit of extra work you can expose your content and even more importantly your products to a wider audience why wouldn’t you?

So what about the extra work? There are a few things you can do to make you’re site accessible to most people. First is build your site semantically. No tables for layout, proper use of heading tags, order your content in your HTML the same way it appears in your browser, give all images concise alt tags and make sure the copy inside anchor tags describe what the link leads to. (as opposed to “click here”)

An extremely simple and useful element you can add to any site is a skip menu. This is a short navigation element hidden from regular users via CSS which let’s those using a screen reader skip directly from the top of the page to the navigation, main content, footer, sidebar or other blocks of content in the page. The need for this may not be immediately obvious to typical web users but imagine using the tab key to move link by link to the main content of the page. If there is a large site navigation at the top of the page the user might have to click 20 or 30 times just to move through the nav bar. Now imagine someone using a screenreader and having to listen to all those links! The skip menu, using anchor tags would let them jump right to the main content and over the site navigation in 2 clicks.

Providing alternate content for Flash, video, image and audio is also important. Flash can be made accessible but it may be easier to provide an HTML version of the content instead. Videos can have subtitles added for those who cannot hear and images can have alt tags or long descriptions added to describe what the image represents.

There are special labeling and attribute schemes which make tables and forms usable by those relying on assistive technologies. This is especially relevant for sites with e-commerce capabilities.

Above I have briefly outlined some basic strategies for making your site more accessible. There is a lot more to be learned and there are a lot of great resources out there to help you get started. The W3C has it’s WAI-ARIA guidelines.

To really get going you’ll have to do some reading and research on your own but I do plan to make further postings on this topic as I expand my own knowledge. Your comments are welcomed.

Over the course of a typical web design project how often does the term accessibility come up? My guess is not at all or that if it does, it's a...

Over the course of a typical web design project how often does the term accessibility come up? My guess is not at all or that if it does, it's as an afterthought or "nice to have" feature which can be tacked on if time and budget allow. Why is th...

More