Changes in WCAG 2.0 from WCAG 2.1 and 2.2

In 2018, the Web Content Accessibility Guidelines (WCAG) version 2.1 was released. It enhanced - but did not replace - version 2.0, released in 2008. By conforming to the guidelines prescribed in version 2.1, you were also automatically in compliance with version 2.0. 

There were several additions to version 2.1, but nothing was removed from version 2.0. However, unlike version 2.1, version 2.2 is not fully backward compatible because it is expected to remove a guideline for the first time. 

What was added to 2.1?

A total of thirteen new guidelines were added to version 2.1, mostly to expand on mobile services, which were lacking in version 2.0. In addition to existing guidelines, these guidelines add structure to the growing mobile market. 

• Orientation. This success criteria aims to prevent a website author from restricting content to a specific orientation or direction on the screen of a device is turned. This is due to the fact that some devices are mounted in a fixed position, such as on a wheelchair arm, and cannot be rotated. Those devices must also have the same access to the website as everyone else. 
• Identify Input Purpose. This success criteria states that input fields, such as in forms for addresses or other information-collecting services, can be programmatically determined. Software can use assistive technologies to fill in blanks, such as auto-completing addresses. For this success criteria to apply, the input field must serve a purpose as outlined here, and the technologies are supported in determining the meaning of the inputted data.
• Identify Purpose. This success criterion allows elements on a page to be replaced by symbols for people who use symbols instead of words. While there isn't a universal language of symbols, there are programs that find and replace words with a user's preferred symbols, and this success criterion makes that process easier.
• Reflow. As well as scrolling up and down, this success criteria refers to scrolling right to left. To meet this criterion, content should be accessible without scrolling right to left by adjusting the page size or some other measure. Dimensions to achieve this are 320 CSS pixels for vertical scrolling and 256 CSS pixels for horizontal scrolling.
• Non Text Contrast. For this success criteria, the following visual aspects must have a contrast ratio of 3:1.
  • User interface components or controls of a page (like arrows, buttons, etc.) 
  • Graphics
• Text Spacing. This success criterion refers to the spacing between lines of text. When people override the set text style to make it more readable, no text should be lost due to this change. The minimum baselines for text spacing are as follows:
  • Line height to at least 1.5 times the font size
  • Spacing the following paragraphs to at least 2 times the font size
  • Letter spacing to at least 0.12 times the font size
  • Word spacing to at least 0.16 times the font size
• Content on Hover or Focus. This success criterion is all about when a pointer, or mouse, triggers additional content on a page to become visible, like a link. When this happens, the following must be true under this success criteria:
  • It must be dismissable, without moving the pointer or keyboard focus, unless the message conveys an error or does not cover up important content.
  • It must be able to be hovered on without disappearing. 
  • It must remain until it is dismissed, either by removing the pointer, by the user, or by the information expiring.
• Character Key Shortcuts. Under this success criteria, if a keyboard shortcut exists using only letter, number, punctuation, or symbol characters, the following must also be true:
  • It has to be able to be turned off
  • It has to be able to be changed to another key, like command or control
  • It has only to be active when the keyboard is in focus mode
• Timeouts. This success criterion states that users must be warned when any inactivity on their part will cause them to lose data, such as on a job application. The only exception to this is if the data is preserved for more than 20 hours. 
• Animations from Interactions. As part of this success criteria, all animations on a webpage must be disabled, unless it is necessary for the website, page, or information to function. Using this success criterion can help prevent seizures caused by motion from animation. 
• Pointer Gestures. This success criteria requires that any multipoint gestures on a page, such as zooming with two fingers or tapping with two fingers, can also be accomplished using a single pointer or something that operates with a single point of contact with the screen, such as a stylus. Some people cannot utilize multipoint gestures or rely on single pointers to operate touchscreens, and this success criterion aims to make operating webpages on mobile devices with a touchscreen more effective. 
• Pointer Cancellation. This success criterion states that for anything that can be operated using a single pointer, the following must also be true:
  • Pressing down on a button, like on the end call button, doesn’t complete the action. Only releasing it does. 
  • There must be a way to stop the action after it’s started
  • Finishing the action of the down-event is essential
• Label in Name. For this success criteria, the text on screen for buttons must match what’s programmed. For example, the “send” button in an e-mail must also be programmed with the word “send” to match assistive technology. 
• Motion Actuation. This success criterion refers to mobile apps that use motion, like shaking the phone to activate something. If a motion is required, this success criteria states that the same thing must also be achievable through another means in case a person cannot physically do the needed movement. The only exceptions are:
  • The required motion is accessibility-supported and used to support the functionality of accessible technology
  • The required motion is essential
• Target Size. For this success criterion, the part of the screen you click on must be a certain size. Specifically, 44 by 44 CSS pixels, except when:
  • There’s another area to click on that meets this standard,
  • The area to click is within a block of text,
  • The user determines the area,
  • The presentation of the area is essential to the information being conveyed. 
• Concurrent Input Mechanisms. This success criteria specifies that web content can’t restrict how a user uses the site – specifically, with what devices they use it. For example, a person may switch between assistive devices, and a website can’t block one.
• Status Messages. This success criterion refers to messages users get after they do something on a page, like send an email or sign up for a newsletter. It makes users aware of changes in a way that doesn’t interrupt their work, usually in the form of a sound or text. 

What was removed for 2.2?

Success criteria 4.1.1, Parsing, is leaving the guidelines. It’s the first time the WCAG has removed a success criteria from the guidelines. This doesn’t mean it’s not important – parsing has to do with HTML, and misusing it will fall under other guidelines. Due to rapid Internet and assistive technology changes, this success criteria is no longer as crucial as it once was.

A constantly changing digital landscape requires pruning back what isn't needed anymore so that new and emerging technologies, which are accessible, can take their place.

Conclusion

WCAG 2.1 added 13 new success criteria and was backward compatible with 2.0. However, 2.2 is not expected to be backward compatible with eliminating one success criterion. Becoming compliant with the new version of WCAG will likely be a harder journey, but well worth it in the name of accessibility