7 Principles of Universal Design Flashcards
There is a set of principles and guidelines for universal design, written in 1997 that is worth knowing about.
List the
7 Principles of Universal Design
- Equitable Use
- Flexibility in Use
- Simple and Intuitive Use
- Perceptible Information
- Tolerance for Error
- Low Physical Effort
- Size and Space for Approach and Use
Goal and guidelines
1 | Equitable use
The design is useful and marketable to people with diverse abilities.
- 1a. Provide the same means of use for all users: identical whenever possible; equivalent when not.
- 1b. Avoid segregating or stigmatizing any users.
- 1c. Make provisions for privacy, security, and safety equally available to all users.
- 1d. Make the design appealing to all users.
Examples
1 | Equitable Use
Examples in the physical world:
* Power doors with sensors at entrances that are convenient for all users.
* Integrated, dispersed, and adequate seating in assembly areas such as sports arenas and theaters.
Examples on the web:
* A web site uses semantic markup in all the appropriate places (headings, landmarks, table structure, form labels, etc.) and creates a single design that works well for users who are sighted as well as for users who are blind.
Bad examples on the web:
* A web site with a separate version for people with disabilities. Even if the intention is to make that second version more accessible than the main version, it’s a bad idea.
* Creating two versions is kind of like building a restaurant with a flight of stairs in front and an accessible ramp around back, past the trash cans and down the alley. It’s stigmatizing to have to enter the back door. It’s not an equivalent experience.
* Maintaining two versions of the same web site is logistically difficult. It’s likely that the accessible version will soon become neglected and out of date, because developers hardly use it themselves.
* A web site for booking hotel rooms is inaccessible to screen reader users, but prominently places information about a phone number that people who are blind can call to book a room by phone. The phone experience is technically accessible, but it is not an equivalent experience to an accessible web site, and operators are not available after certain hours.
Goal and guidelines
2 | Flexibility in Use
The design accommodates a wide range of individual preferences and abilities.
The design of the product or environment should provide people with a variety of options for use of its features. The environment or product should be adaptable to an individual’s preferences and abilities.
- 2a. Provide choice in methods of use.
- 2b. Accommodate right- or left-handed access and use.
- 2c. Facilitate the user’s accuracy and precision.
- 2d. Provide adaptability to the user’s pace.
Eamples
2 | Flexibility in Use
Examples in the physical world:
* Scissors designed for right- or left-handed users.
* An ATM that has visual, tactile, and audible feedback, a tapered card opening, and a palm rest.
Good examples on the web:
* A JavaScript drag-and-drop widget is designed to work with any of the following: a mouse, a touchscreen, or a keyboard.
* A bank web site warns the user 2 minutes before the session is about to expire and gives the user the option of extending the session. The warning itself is fully accessible to keyboard and screen reader users and is easy to respond to quickly.
Bad examples on the web:
* A mobile web site has three superscripts after a word, each linked to a footnote at the bottom of the page. Each superscript is tiny, and all of them are very close to each other, making it almost impossible to activate the correct link accurately.
Goals and guidelines
3 | Simple and Intuitive Use
Use of the design is easy to understand, regardless of the user’s experience, knowledge, language skills, or current concentration level.
The purpose of the product or environment’s features should be easy to understand. A person’s background, language, or experience should not hinder his or her understanding of how to use the product or navigate the environment.
- 3a. Eliminate unnecessary complexity.
- 3b. Be consistent with user expectations and intuition.
- 3c. Accommodate a wide range of literacy and language skills.
- 3d. Arrange information consistent with its importance.
- 3e. Provide effective prompting and feedback during and after task completion.
Examples
3 | Simple and Intuitive Use
Examples in the physical world:
* A moving sidewalk or escalator in a public space.
* An instruction manual with drawings and no text.
Good examples on the web:
* A news web site includes a simplified summary of the important points at the beginning of the story, to make it easy to get the main points without having to read the whole story.
* A form validation script provides clear success confirmation messages when the form is submitted successfully, and clear error messages when there is a problem with the data. The focus moves to the error messages, ensuring that keyboard and screen reader users get the full benefit of the messages.
* A web site uses native HTML widgets that are familiar to users.
* Content is organized with headings that clearly mark the important sections of content.
* Advertisements are clearly marked as such and are placed out of the main flow of the content so they won’t be confused with the content.
Bad examples on the web:
* An e-commerce site requires many detailed steps to complete a purchase, making the process unnecessarily complex.
* A web site uses advanced or uncommon vocabulary.
* A web site uses custom JavaScript widgets that are new in design and concept, and unfamiliar to users.
* A form validation script highlights a field with an error but does not explain what the error is or how to fix it.
Goal and guidelines
4 | Perceptible Information
The design communicates necessary information effectively to the user, regardless of ambient conditions or the user’s sensory abilities.
Information about the product or environment’s design should be communicated effectively and should be perceivable to everyone. A person’s sensory abilities should not hinder him or her from receiving information. Information should be presented in different formats to increase effective communication to individuals with diverse abilities.
- 4a. Use different modes (pictorial, verbal, tactile) for redundant presentation of essential information.
- 4b. Maximize “legibility” of essential information.
- 4c. Differentiate elements in ways that can be described (i.e. make it easy to give instructions or directions).
- 4d. Provide compatibility with a variety of techniques or devices used by people with sensory limitations.
Examples
4 | Perceptible Information
Examples in the physical world:
* Tactile, visual, and audible cues and instructions on a thermostat.
* Redundant cueing (e.g. voice communications and signage) in airports, train stations, and subway cars.
Good examples on the web:
* A tutorial on how to tie your shoes is presented in text, illustrations, and video with narrated instructions.
* ARIA live announcements are used to announce to screen reader users the number of available options in a custom ARIA/JavaScript autocomplete drop-down list (e.g. “There are three cities that start with ‘SAN.’ Use the down arrow key to navigate the options”).
Bad examples on the web:
* A video tutorial on how to tie your shoes is shown with no narration, making the video useless for a person who is blind.
* A low contrast color scheme on a web site makes it difficult for people with low vision to read the text or distinguish buttons from the surrounding text.
Goal and guidelines
5 | Tolerance for Error
The design minimizes hazards and the adverse consequences of accidental or unintended actions.
The design of the product or environment should reduce the chances of accidents or hazards from occurring. The design should also anticipate any unintentional actions that may occur during use.
- 5a. Arrange elements to minimize hazards and errors: most used elements, most accessible; hazardous elements eliminated, isolated, or shielded.
- 5b. Provide warnings of hazards and errors.
- 5c. Provide fail safe features.
- 5d. Discourage unconscious action in tasks that require vigilance.
Examples
5 | Tolerance for Error
Examples in the physical world:
* A double-cut car key easily inserted into a recessed keyhole in either of two ways.
* An “undo” feature in computer software that allows the user to correct mistakes without penalty.
Good examples on the web:
* On a financial web site, a script confirms “Are you sure you want to transfer funds?” before funds are transferred, in case users had pressed the button by accident, or before they were sure they wanted to do it.
* A content management system places “deleted” items in a recycle bin and allows users to recover them later if they change their mind.
* A search feature performs a spell check on submissions and suggests corrections.
Bad examples on the web:
* A web site responds to a “delete account” request without confirming with the user, resulting in the irreversible loss of the account.
* A search feature searches only for the literal string of text and doesn’t take into account variations in word order, spelling, etc.
Goal and guidelines
6 | Low Physical Effort
The design can be used efficiently and comfortably and with a minimum of fatigue.
The design of the product or environment should require little to no physical effort to use. A person should be able to use the product or navigate the environment comfortably without feeling fatigued during use or after use.
- 6a. Allow user to maintain a neutral body position.
- 6b. Use reasonable operating forces.
- 6c. Minimize repetitive actions.
- 6d. Minimize sustained physical effort.
Examples
6 | Low Physical Effort
Examples in the physical world:
* Lever or loop handles on doors and faucets.
* Touch lamps operated without a switch.
Good examples on the web:
* A web site has a “skip to main content” link at the top, allowing keyboard users to avoid tabbing through all of the links in the header and navigation.
* A web site has good heading and landmark structure (importantly, the content starts with an <h1> heading, inside a <main> landmark, among others), allowing screen reader users to navigate by headings and landmarks to the part of the page they’re interested in.
Bad examples on the web:
* A sign-up process on a web site requires typing a large amount of information, which can lead to fatigue in people with motor disabilities.
* A web site is designed with many links in the header and navigation section, and no headings, landmarks, or “skip to main content” link to allow users to jump to the main content.
Goal and guidelines
7 | Size and Space for Approach and Use
Appropriate size and space is provided for approach, reach, manipulation, and use, regardless of user’s body size, posture, or mobility.
Sufficient space should be provided in the design so that it allows anyone to use the design features regardless of physical build or physical abilities.
- 7a. Provide a clear line of sight to important elements for any seated or standing user.
- 7b. Make reach to all components comfortable for any seated or standing user.
- 7c. Accommodate variations in hand and grip size.
- 7d. Provide adequate space for the use of assistive devices or personal assistance.
Examples
7 | Size and Space for Approach and Use
Examples in the physical world:
* Controls on the front and clear floor space around appliances, mailboxes, dumpsters, and other elements.
* Wide gates at subway stations that accommodate all users.
Examples on the web:
* This particular principle doesn’t apply to the web quite so readily as the other principles do, because this principle is more relevant to hardware and physical environments than it is to virtual environments or interfaces.
