Accessible Design – Providing Access to Every User

Why design for Accessibility?

Technology works best when more people use it. Think of it from a statistical POV (point of view): the more people use a product, the more feedback provided on the product, the better the product becomes. And then there’s the part where what you have to offer is so worth sharing that you want everyone to have access to it.

Considerations

There are millions of potential end-users out there, hundreds or thousands or hundreds of thousands of people may visit your website or use your app, but not all will use it in the same way. For example, I, as a computer programmer, prefer to navigate with my keyboard in order to avoid having to constantly switch my hand position to access the mouse – my favorite keyboard command is by far the Alt-Tab function that lets me quickly jump from one open window to the next. My wonderful yet technically-challenged cousin navigates the computer almost exclusively by mouse, glancing down from the screen to the keyboard every time she needs to type. Much of the population is constantly on the go, browsing websites via mobile devices, usually small-screened touch-screen cell phones. In each of these situations, and surely if there are some then there are more, navigation and how each end-user interacts with your interface is going to vary significantly.

Beyond the technical variations of navigation is the human variations in ability, especially in dexterity. Arthritis, cerebral palsy, Parkinson’s, there are many factors that can impact a person’s dexterity, which greatly affects their ability to use a computer mouse, manipulate a touch-screen, and hit the correct key on a keyboard. To ensure ease of navigation, the size of icons, timeouts for dropdowns and hovers, incorrect button presses, and the overall responsiveness of the User Interface must be well thought out, organized, and considerate of how a user will interact with the content.

Organization of content, information, and navigational tools should be at the top of a designer’s list of considerations no matter what the product or who the target audience is in order to attain even general accessibility. Further consideration should be given to navigation via screen-readers, keyboard navigation, and touch-interactions.

Questions To Ask

  • Is the content organized in a logical way, with a proper use of headings (<h1>, <h2>, etc.) and lists so that users with visual impairments can easily find what they want through screen-readers and keyboard navigation?
  • Are icons, buttons, and other interactive elements large enough to see and “hit” if the user has low-vision or impaired fine-motor-skills?
  • How do hover items react in touch-screen environments or if the mouse pointer is unsteady?
  • Are elements, like images, links, and buttons, clearly labeled so that screen-readers can audibly identify the element (aria-label, alt text, longdesc)?
  • Is navigation easy to manage in that, given the cases where navigational components are read by a screen-reader, sub-menu items are only read when requested and the navigation can be skipped or easily accessed as requested?

Testing

The best way to test for accessibility is to interact with the website via the tools your users will be using. This includes testing site navigation with multiple screen-readers (JAWS and NVDA are two of the most widely used), touch-screens, and via keyboard navigation. Run scenarios to see if you can navigate the website and locate information without using the mouse or exclusively via touch-screen, and so on. As you progress through the testing, you will realize the complexity and the give-and-take that comes with Accessible Design. Achieving an accessible website is finding a balance between visual aesthetics and usability. Your design should look nice and exciting but still remain organized, where information is easily found, elements and sections are identifiable, and navigation is simple and direct.

Resources

W3C Web Accessibility Initiative

ARIA Tags

Other Resources