WeCo Digital Accessibility

by

Web Content Accessibility Guidelines (WCAG) 2.1 Overview

Since its release in 2008, WCAG 2.0 has continued to be a viable standard for digital accessibility. However, known gaps existed in WCAG 2.0 that needed to be addressed due to the evolving needs of digital accessibility. In June of 2018, WCAG 2.1 became the official recommendation of the World Wide Web Consortium (W3C) as its first attempt to fill some of the gaps. The WCAG 2.1 includes new success criteria as well as the WCAG 2.0 standards.

Image with the text WCAG 2.1 and icons of an eye, a cell phone, and a brain.

New WCAG 2.1

The WCAG 2.1 includes 17 new success criteria.

WCAG 2.1 A Criteria

  • SC 2.1.4 Character Key Shortcuts: If a website supports keyboard shortcuts that use a letter, punctuation, number, or symbol character, then at least one of the following must be true:
  1. The shortcut can be turned off,
  2. The shortcut can be changed to use one or more non-printable keyboard characters (Ctrl, Alt, etc.), and/or
  3. The shortcut for a component is only active when that component has focus.
  • SC 2.5.1 Pointer Gestures: Complex actions, such as pinching for zooming or swiping, should also be able to be performed through simpler actions like taps or long presses.
  • SC 2.5.2 Pointer Cancellation: At least one of the following must be true for an action such as a click, tap, or long press:
  1. A down-event is not used to complete a function;
  2. If a function is triggered by an up-event, a user can cancel or undo the action afterward;
  3. Up-event cancels when triggered on down-event; and/or
  4. Completing the function on the down-event is essential.
  • SC 2.5.3 Label in Name: The visible text of a label in a user interface component must match the accessible name or programmatic label.
  • SC 2.5.4 Motion Actuation: Actions that can be completed by a motion, such as shaking your phone, must also be able to be completed by a user interface component. Accidental motions must be turned off unless the motion is essential for functionality, or is supported through an accessible interface.

WCAG 2.1 AA Criteria

  • SC 1.3.4 Orientation: Websites/applications should support both landscape and portrait display orientations. They should not restrict to a single display orientation unless essential.
  • SC 1.3.5 Identify Input Purpose: A program, such as an assistive technology, must be able to determine what the user is expected to enter in a field or what the meaning of the information entered is.
  • SC 1.4.10 Reflow: Websites must be responsive. Users shouldn’t have to scroll horizontally to view content. Websites should be able to fit a 320-pixel wide screen.
  • SC 1.4.11 Non-Text Contrast: Active interface components (buttons) and non-text content (infographics) must have a contrast ratio of 3:1.
  • SC 1.4.12 Text Spacing: Users must be able to increase the distance between paragraphs, rows, words, and characters without losing content or functionality.
  • SC 1.4.13 Content on Hover or Focus: If a user triggers content that appears in a modal window, tooltip, or a similar component, the user must be able to:
  1. Dismiss the content without using the mouse or keyboard focus,
  2. Move their mouse over the content without making it disappear, and
  3. Dismiss the content when the user wants to.
  • SC 4.1.3 Status Messages: If new content is added to a page, the users of assistive technologies must be alerted without interrupting their work.

WCAG 2.1 AAA Criteria

  • SC 1.3.6 Identify Purpose: A program must be able to identify the purpose of interface components, icons, and sections. HTML code should provide context, purpose, and meaning of symbols, regions, buttons, links, and fields.
  • SC 2.2.6 Timeouts: Users are informed when a period of inactivity could lead to data loss, unless the data is preserved for more than 20 hours.
  • SC 2.3.3 Animation from Interactions: Users are allowed to turn off animations, unless the animation is essential to the functionality or information being conveyed.
  • SC 2.5.5 Target Size: A clickable element must be at least 44 by 44 CSS pixels.
  • SC 2.5.6 Concurrent Input Mechanisms: Users should be able to add, remove, or switch between different input mechanisms like a mouse, keyboard, stylus, touch input, or voice input.

View What’s New in WCAG 2.1 for additional information on learning and implementing WCAG 2.1.

 

Further reading from WeCo’s Accessibility Blog about Web Content Accessibility Guidelines (WCAG):

Layers of Guidance: How to Use the Web Content Accessibility Guidelines (WCAG) 2.0

WCAG 2.0 AA a Global Accessibility Measure? A WeCo Client Question