The Web Content Accessibility Guidelines (WCAG) are the de facto industry standard for website accessibility. The WCAG details what criteria you need to meet in order to make your site accessible to all users. Well-known recommendations include adding alt text to images and closed captions or transcripts for videos.
The WCAG 2.1 is the latest iteration of the standards, introduced in June 2018. WCAG 2.1 has become the industry standard due to the 17 additional usability and accessibility considerations. WCAG 2.1 offers the two important benefits for users of assistive technology over 2.0.
- Enormous focus on mobile, which was a big gap in WCAG 2.0 even though it’s a fundamental channel with major developments from both iOS and Android
- Specifically addresses issues for users with motor and dexterity disabilities, individuals with low vision, those with vestibular disabilities, and people with cognitive disabilities.
Following the WCAG 2.1 guidelines is the best way to ensure that your digital content and environments (including your website and apps) are usable and accessible for people with disabilities. In addition, based on recent legal trends, adhering to WCAG 2.1 is the safest bet to protect your business from accessibility lawsuits and liabilities.
In discussing WCAG 2.1, we’ll touch on why the W3C decided to update the standard, what’s different compared to WCAG 2.0, why you should be following these recommendations, and how you can get started making these changes.
Why the Change?
There are many reasons that the W3C decided to create the WCAG 2.1 in lieu of a brand new standard (such as the upcoming WCAG 3.0 AG Working Group). According to the W3C, WCAG 2.1 was initiated with the goal to improve accessibility guidance for three major groups: users with cognitive or learning disabilities, users with low vision, and users with disabilities on mobile devices. Although a WCAG 3.0 is very much in the works, they felt a need to address these critical user groups in an agile way.
Ultimately, the W3C created WCAG 2.1 to help people; users with disabilities that needed clarity on the existing standards to ensure a seamless experience on websites, apps, and other applicable digital content.
The Differences Between the WCAG 2.0 and 2.1
There are seventeen new criteria that differentiate the WCAG 2.0 and the WCAG 2.1. But the biggest difference is the advanced considerations for mobile users.
WCAG 2.1 has a larger occurrence on mobile usage and the preferences of those with low vision and those with cognitive disabilities. Mobile was overlooked in past accessibility guidelines like WCAG 2.0.
In today’s world, many of us, including people within the disability community increasingly rely heavily on mobile for everyday tasks. This makes moving to the standards outlined in WCAG 2.1 all the more urgent.
All of the mandates from 2.0 are included in 2.1, so if you were previously up to date, you can build on the changes you already made and simply incorporate the new requirements.
These are the new criteria that you’ll need to include:
- Orientation. The site or app must work regardless of the orientation of the device. If a wheelchair user has a tablet attached to their device and can’t rotate it horizontally, they should still be able to use the site.
- Identify Input Purpose. Auto-fill or auto-correct suggestion text for input fields, including for things like customer addresses.
- Identify Purpose. The purpose of UI components, icons, and regions should be programmatically determined in content using markup languages.
- Reflow. Content can be presented without requiring scrolling in two dimensions. (See specific dimensions here).
- Non-Text Contrast. Presentation of UI components and graphical objects must have a contrast ratio of at least 3:1 against adjacent colors.
- Text Spacing. No loss of content or functionality happens by setting text spacing and changing no other property in content implemented using markup languages.
- Content on hover or focus. When receiving and removing pointer hover or keyboard focus to reveal additional content, you need the additional content to be dismissible, persistent if the user is still hovering, and still available once the pointer moves over the additional content.
- 4 Character Key Shortcuts. Mechanisms must be available to turn shortcuts on or off, to remap a shortcut, or to only become active when the component has focus.
- Timeouts. Users are warned about the duration of inactivity that could cause data loss unless data is preserved for more than 20 hours.
- Animation from Interactions. Motion animation triggered by interaction can be disabled unless it’s essential to the functionality or information being conveyed.
- Pointer Gestures. All functionality using multipoint or path-based gestures can be operated with a single pointer without path-based gestures unless they’re essential.
- Pointer Cancellation. For functionalities that can use a single pointer, there must be either a no-down event, an up reversal, an abort or undo option for down-events unless they’re essential.
- Label in Name. UI components with text or images-of-text labels, the text must be presented visually.
- Motion Actuation. Functionality operated by device or user motion can also be operated by UI components, and the motion can be disabled except in a few particular use cases.
- Target Size. The size of the target for pointer inputs is at least 44x44 CSS pixels, barring a few particular exceptions.
- Concurrent Input Mechanisms. Web content can’t restrict the use of input modalities available except where restriction is essential to ensure security or respect user settings.
- Status Messages. Status messages can be determined through properties so they can be presented with assistive technologies without receiving focus on content implemented using markup languages.
Why Adopt WCAG 2.1 Recommendations
The WCAG 2.1 recommendations are the most thorough and up-to-date. It has become the updated industry standard because it’s best for app users and site visitors.
In addition to allowing for greater accessibility and usability so that all users have a positive experience with your brand, it’s worth pointing out that fully integrating these standards into your website and mobile apps, your business will be better protected from accessibility lawsuits.
Some key info informing our recommendation to all clients and partners to make the switch to WCAG 2.1:
The WCAG are often referenced in ADA complaints, and more than 75% of all federal claims currently reference WCAG 2.1 (level AA)
- The California Consumer Privacy Act drafted regulations based on the WCAG 2.1, and it’s the standard there for all sites and vendors
- Section 508, US DOT ACAA, AODA from Ontario Canada are all still requiring the WCAG 2.0AA for now
- Countries within the European Union needed to make their public digital environments and content WCAG 2.1 accessible by September 23 of this year
- Certain vendors do require the WCAG 2.1 in their MSA. Companies like Verizon, for example, include accessibility and AD providers in their standard terms for vendors, requiring vendors to provide full documentation of measures taken to ensure that the regulations have been met
WCAG 2.1 is Today’s standard for ADA Compliance
The WCAG 2.1 is the industry standard across the globe, even if your country, state, or region doesn’t yet have specific laws requiring it.
Interested in updating your site’s accessibility? Talk with a UsableNet team member about WCAG 2.1 or read more about WCAG and ADA Compliance in our new free resource, The Ultimate Guide to ADA Compliance.