accessible-design

“If I were to tell you that I know of a relatively untapped market that, in the USA alone, accounts for over 12% of the entire population, what would you say? This same market has an aggregate income that tops $1 trillion and includes $220 billion in discretionary income. Would you want to know more? Would you want to know who this group is and how you could serve them?”
[Source: Website Accessibility: The Untapped Global Income Stream]

While decision makers and UX designers usually say “yes” and profess a commitment to accessible design, all too often these intentions are lost in the rush to get products to market.

In this post, we’ll describe the history and foundations of accessible design before citing useful tools and techniques to help you and your team create widely accessible designs.

Accessible Design: A Brief History

In 1990 Congress passed The Americans with Disabilities Act. This act addresses both physical and mental medical conditions.

In 1997 the World Wide Web Consortium (W3C) launched the Web Accessibility Initiative (WAI).

As Alex Yampolsky writes in Web Accessibility Explained, “The W3C is a global organization, comprised of member countries and organizations. A first of its kind, the W3C WAI became one of the major significant steps toward the goal of achieving digital equality.”

Yampolsky reminds us of the 1998 amendment to the Rehabilitation Act of 1973. This amendment required federal agencies to make electronic information available to individuals with disabilities.

Guidelines and Checklists

The WAI working groups have long worked to address web accessibility by issuing opinions and technical specifications and guidelines.

The W3C publishes and updates these Web Content Accessibility Guidelines. The guidelines outline three levels of conformance, A, AA, and AAA and the criteria for meeting each level. These success criteria checklists include an understanding criteria section with examples and recommended solutions for adhering to each guideline.

Accessible Design Principles

Accessible design principles “define the most effective, clear and accessible ways of presenting information to the human user,” writes Yampolsky. In other words, the goal is to present information in a way that all people can understand, no matter the format, tool, or assistive technology they use. Yampolsky defines these core principles:

  • Perceivable: This principle addresses the fundamentals of information and content presentation, such as compositional sequence, colors, contrasts, contextual relationships and display of text, among others.
  • Operable: The focus here includes elements such as navigation, headings and labels, keyboard-only navigation and avoiding dangerous and undesirable physical reactions to the content, such as seizures. The latter can occur when the screen flickers at a certain rate.
  • Understandable: The goal is to structure content in a way that is easy to grasp. The principle of understanding also addresses a number of interactive considerations, such as on-focus and on-input, as well as navigation patterns.
  • Robust: Robust content refers to content that can be interpreted by a wide variety of user agents, including assistive technologies.

Design Techniques to Help

Often, articles about accessible design explain how to design a site for users with limited vision. This is important, and we list such techniques below.

Designers must also address disabilities such as:

accessible-design

  • Users who are deaf or hard of hearing. Solutions include alternatives to multi-media and hearing assistive technologies such as captioning software and written transcripts.
  • Users with limited mobility: Solutions include designs that allow access via mouth sticks, head wands, sip and puff switches, adaptive keyboards, eye movement, voice recognition software, and laser pointers.
  • Users with cognitive challenges: Solutions include dividing complex tasks into smaller steps, instructional videos, employing short, simple, unambiguous terminology.

Some of these practices, such as using simple terminology are best practices for design generally.

Design Techniques to Help The Visually Impaired

Accommodate keyboard-only mapping out the tab flow. Dashiel Neimark provides a useful example in Vital Accessibility Design Principles. If a user is currently in a search field and presses tab, the cursor should land on search filters not the search button. If the tab sequence skips the filters, anyone using a keyboard won’t have the ability to narrow the search.

After you’ve tested this flow by tabbing through your design, revise accordingly. Then, share this tab flow with the development team.

Jenna Erickson lists additional techniques for making a site accessible to the visually impaired:

  • Pay close attention to color and contrast. Do not rely solely on color to convey information.
  • Use a font size of at least 12 points, and avoid thin, light fonts. Not only will this technique help the visually impaired, it will make text easier for everyone to read.
  • Turn your article into audio. As with font size, this technique will help those who have trouble seeing as well as those who do not but might prefer to absorb your content while working out or caring for small children.
  • Don’t ignore screen readers. Screen readers cannot interpret images or text on images. They rely on alt text.
  • Use explicit alt text to clearly convey the meaning and purpose of each image on your site.

The Importance of Accessible Design

Designers should consider the following when striving to make their designs accessible to all users:

  • With the population aging in many countries, accessible design will only become more important.
  • A second, and often overlooked, consideration is users who are temporarily disabled. For example, if you break your dominant hand while playing basketball, your ability to type or use a mouse or touch pad will be limited until you heal.
  • Technology can pose barriers to access. Users in places with low bandwidth might disable images to increase download speed. Without alt text, the images will be meaningless.

Expert and thought leader Whitney Quesenbery deftly summarizes the moral and practice case for accessible design:

“Most of all, it means embracing the need to create things that provide a good user experience for everyone. This may sound like loading too much complexity onto a design, too early in the process, but you might be surprised at the innovative ideas that working with extreme interaction styles and human needs can produce.” [Source: User Experience and Accessibility | Working with Visual Designers]

In short, the goal is barrier free design that allows access regardless of browser, device, or disability.