Website or web accessibility means that people with disabilities can understand, navigate and interact with web content. The World Wide Web Consortium (W3C) has developed web content accessibility guidelines to help improve usability and user experience with website content and applications.
WCAG 2.0 Guidelines
Web Content Accessibility Guidelines (WCAG) 2.0 are more focused on the needs of the user than on describing specific technical guidelines. There are also implementation guidelines to describe technical implementation of these guidelines. These Web Content Accessibility Guidelines are separated into four primary groups: Perceivable, Usable, Understandable, and Flexible.
Web Content is Perceivable
Web content and user interface components must be presentable to users in ways they can recognize or sense. Visually impaired users must be able to receive information by sound or touch. Hearing impaired users must be able to receive information by sight.
Guideline: “Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.”
1) Use IMAGE ALT tags and text descriptions for visual components, such as images, videos, animations, 3D models, etc.
2) Use alternatives to visual CAPTCHA elements, such as use of math or logic questions.
Guideline: “Provide alternatives for time-based media.”
1) Use captions or audio transcriptions for pre-recorded audio and video elements.
Guideline: “Create content that can be presented in different ways without losing information or structure.”
1) Use Semantic HTML or website coding to reinforce the meaning and purpose of the content.
This can be accomplished through the use of header tags (h1, h2, h3, etc), form tags (form), image tags (img), navigation tags (nav), Google Rich Snippets (itemtype, itemprop) and others that clearly define what the component is. Non-semantic HTML is not descriptive, such as in the use of the following tags: p, div, and span.
Guideline: “Make it easier for users to see and hear content including separating foreground from background.”
1) Apply contrast between text and background.
2) Ensure content is identifiable independent of color.
3) Avoid automatically playing audio and visual elements. Provide play buttons instead.
4) Use CSS formatting instead of graphics to format text whenever possible.
Web Content is Usable
User interface components must be usable. All users are given enough time to read and use content. Functionality triggered by mouse can also be triggered by keyboard.
Guideline: “Make all functionality available from a keyboard.”
1) Arrows keys can control sliders.
2) Tab keys can be used to navigate between form fields and buttons.
3) Keyboard commands can be used to activate and operate video players.
4) Keyboard commands can be used to close and control windows.
Guideline: “Provide users enough time to read and use content.”
1) User is warned of time limits and permitted to extend time.
2) Scrolling or blinking elements can be paused.
3) Users have the option to block automatic updates.
Guideline: “Do not design content in a way that is known to cause seizures.”
1) Flashing objects should be avoided or limited to 3 flashes per second.
Guideline: “Provide ways to help users navigate, find content, and determine where they are.”
1) Avoid use of HTML frames.
2) Users are given mechanisms to skip repetitive content.
3) Meaningful page title, headers and unique hyperlink text are provided to assist in screen navigation.
4) Multiple paths are provided to navigate through web content.
5) Keyboard users are able to see a cursor or other indicator of position on the screen.
Web Content is Understandable
Web content and user interface components must be understandable. Website is free of unannounced pop ups. Navigation and labels are consistent across the website or application. Text language is identified.
Guideline: “Make text content readable and understandable.”
1) Identify text language with a language code.
2) Identify and define unusual words or jargon.
Guideline: “Make Web pages appear and operate in predictable ways.”
1) Avoid unannounced pop up windows.
2) Avoid disabling the browser’s Back button.
3) Provide a separate Submit button to initiate page changes (versus autosubmit upon selection).
4) Allow automatic slideshows and scrolling or blinking text to be paused.
5) Give users the option to block automatic updates of content.
Guideline: “Help users avoid and correct mistakes.”
1) Provide form validation.
2) Provide clear labels for form and application controls.
3) Provide usable instructions for entering information into forms and applications.
4) Provide clear and usable error messages identifying the location of error and information for correcting it.
Web Content is Flexible
Web content must be flexible enough that it can be interpreted reliably by a wide variety of users and technologies.
Guideline: “Maximize compatibility with current and future user agents, including assistive technologies.”
1) Use validated markup and reduce coding errors.
2) Label the name and role of all user interface components.
3) Identify the value for all data fields, including parameters for interface controls.