Accessibility Guidelines

Four Principles of Accessibility

Perceivable

Information and user interface components must be presentable to users in ways they can perceive (e.g., alt tags that say what the item actually does, like ‘Submit form Button’).

Operable

User interface components and navigation must be operable (e.g., you must be able to navigate the site using a keyboard as well as a mouse).

Understandable

Information and the operation of user interface must be understandable, (e.g., error messaging on a form should make sense; instead of ‘Invalid field’ messaging, use ‘The Email field must be in a valid format’).

Robust

Content must be robust enough so it can be interpreted reliably by a wide variety of user agents, including assistive technologies. In other words, don’t use tags or code that only certain browsers understand.

Guidelines Checklist

  • Text Alternatives

    Provide alternatives for non-text content (e.g., images) so that the content is accessible for all users.

  • Time-Based Media

    Provide an alternative (e.g., transcript) for time-based media (e.g., audio/video) that presents equivalent information, or link to textual information with comparable information for non-prerecorded media).

  • Adaptable

    Create content that can be presented in different ways without losing information or structure.

  • Distinguishable

    Make it easy for users to see and hear content, including separating foreground and background, by using readable fonts, larger font sizes, and highlighted link styling for example.

  • Keyboard Accessible

    Make all functionality available from a keyboard.

  • Timing

    Provide enough time for users to read and use content.

  • Seizures

    Do not include design elements that are known to cause seizures (e.g., rapid flashing).

  • Navigable

    Provide multiple ways to allow users to navigate content including obvious/prominent links and other techniques.

  • Readable

    Make text content readable and understandable via styling and other techniques. Consider the accessibility best practices of certain text symbols before using them in text content. For example, avoid ampersands in order to prevent conflict with screen readers.

  • Predictable

    Make web pages appear and operate in predictable ways.

  • Input Assistance

    Assist users with web experience, correct mistakes and describe errors in text.

  • Compatible

    Maximize compatibility with current and future user agents, including assistive technologies.

(PDF link) A Checklist for UX and Web Designers

Resources