UX Recorder: Screen capturing software for iOS. Learn more.

Principles of Accessible and Universal Design

“Accessible Design” calls for design that includes the needs of people whose physical, mental, or environmental conditions limit their performance. “Universal Design” aims to extend standard design principles to include people of all ages and abilities, but remains at the level of generality, so it does not address all the specific needs of any particular disability.

But even for people who do not have any specific physical or mental characteristics that affect computer use, it has been found that adopting universal design principles can reduce fatigue, increase speed, decrease errors, and decrease learning time for all users. In many ways, universal design addresses the larger issues of usability by making things easier for everyone.

General Principles

Allow for flexibility

  • Provide choices in features and ways that tasks can be accomplished
  • Accommodate right- and left-handed use
  • Allow the user to customize settings whenever possible
  • Keep in mind that people may be using adaptive technologies

Be simple and intuitive

  • Do not design something differently from user expectations just to be different
  • Eliminate unnecessary complexity
  • Provide feedback

Minimize errors

  • Provide warnings
  • Build fail-safe features when possible
  • Do not establish patterns when you want people to pay attention

Include redundant modalities

Redundancy provides flexibility for different user preferences, system configurations, or user abilities. This can be accomplished by using more than one way to represent, display, and enter data, such as:

  • using both a beep and a menu bar flash to notify a user of an error
  • using text to label images
  • redundantly allowing a user to issue commands by typing or selecting something with a pointer

Avoid side effects

Side effects are actions that occur as the result of user actions that do not seem to the user to be related to the primary goal of the action. For instance, when starting a program that changes system configurations (such as screen and sound settings) it should change them back when the program is not being used.

Side effects should be avoided because they cause particular problems for novice users and disabled users who may have difficulty detecting or correcting certain types of side effects.

Web accessibility

The principles of design listed above apply to both software and web design. Below are more web-specific tips.

Tips for building accessible websites

Labeling and markup

  1. Provide a text equivalent (ex: ALT text, <LONGDESC>) for all non-text elements, especially those related to navigation. Provide NULL values for unimportant graphics (such as divider bars).
  2. Conform to current web standards: XHTML 1.0, HTML 4.01, CSS 1.0.
  3. Use cascading style sheets (CSS) to control presentation and layout rather than presentation elements and attributes, but organize documents so they can be read without style sheets.
  4. Identify row and column headers for data tables.
  5. Use the <LONGDESC> tag to summarize graphs and charts.
  6. Provide captions or transcripts and descriptions of multimedia used.
  7. Provide alternate content for scripts, applets, and plug-ins to compensate for the potential loss of information.
  8. Use the <LANG> attribute for screen readers that support it.

Formatting

  1. Use relative units in CSS—em or % instead of cm, pt, or px.
  2. Use ordered lists or number the lists on your web pages.
  3. When using tables, do not use structural markups for visual formatting.
  4. Validate your work either using a validation and/or correction tool.

Providing alternatives

  1. Provide ways to skip over navigation links and get to the main content of your web pages.

Linking

  1. Create logical tab order through links.
  2. Avoid hyperlinks longer than 10 words.
  3. Use descriptive links rather than “click here” to insure that links make sense out of context.
  4. Clearly identify the target of each link.

Displaying

  1. Provide enough contrast between text and background color.
  2. Make sure that tables make sense when read left to right, top to bottom, as this is how screen readers work. Identify row and column headers, and use the <CAPTION> and/or summary attribute and headers to describe the contents.
  3. Provide a <NOFRAMES> option and use meaningful page titles if using frames.
  4. Use client side rather than server side image maps and provide redundant text links.
  5. Avoid blinking, flickering, or moving elements on your web pages.
  6. Provide closed captions for all audio content that contains useful information or provide transcripts for all audio content.

Tips for checking the accessibility of your website

  1. Turn off graphics
  2. Turn off sounds
  3. Check the contrast by viewing the page in grayscale
  4. Turn off style sheets
  5. Turn off scripts, applets, or other programmatic objects
  6. Use the largest font size allowed by a browser
  7. Resize the browser window
  8. Select all text and copy it into a word processor to make sure it makes sense
  9. Use an automated accessibility tool to check your website

↑ Back to top