The Web Content Accessibility Guidelines (WCAG) 2.2

A Comprehensive Guide To WCAG 2.2

Today, making web content more accessible to people with disabilities is more important than ever. The Web Content Accessibility Guidelines (WCAG) 2.2 provide standards for web designers and developers to improve the accessibility of their web content.

What Is WCAG 2.2?

WCAG 2.2 is the second major revision of the Web Content Accessibility Guidelines. The guidelines are developed by the World Wide Web Consortium (W3C) — the main international standards organization for the internet.

Why These Guidelines Change

There are many reasons why the Web Content Accessibility Guidelines (WCAG) require regular updates. These include:

The Evolution of Technology

When Web Content Accessibility Guidelines was first published in 2008, the web was a very different place than it is now. Technologies have changed and evolved, which has led to changes in how people use and access the web.

The Need for International Standards

As the internet has become more globalized, there is a greater need for international standards. This is especially true when it comes to web accessibility.

Changes in the Law

There have also been changes in the law that affect web accessibility and WCAG. For example, the European Union has passed a number of laws that require websites to meet certain accessibility standards. As a result, WCAG has to be updated with new success criteria and guidelines to reflect these changes in the law.

Changes in User Needs

Finally, the needs of users have also changed over time. As more people with disabilities start using the internet, there is a greater need for websites to be accessible to them.

WCAG 2.2: The 4 Layers Of Guidance

There are four different parts to the WCAG 2.2. These include the Principles, Guidelines, Success Criteria, and Sufficient and Advisory Techniques.

Principles

WCAG 2.2 is based on the following four principles. These provide the foundation for web accessibility.

Perceivable

The information on the web should be presented in a way that users can perceive it. This means that users should be able to see, hear, and touch the information on the web.

Operable

The interface of the web should be easy to use for all users. This means that users should be able to navigate, interact, and understand the information on the web.

Understandable

The information on the web should be easy to understand for all users. This means that users should be able to read, write, and speak the information on the web.

Robust

The web should be able to work with a variety of technologies. This means that users should be able to access the information on the web using a variety of technologies.

General Web Accessibility Guidelines

There are many guidelines in WCAG 2.2, but some of the most important ones are:

Clear and Simple Language

The text on the web should be easy to read and understand.

Easy Website Navigable

The website should be easy to navigate, and users should be able to find the information they are looking for.

Colour

The colours on the website should be easy to see, and they should not interfere with the ability of users to see the information on the web.

Assistive Technology

Assistive technology should be able to read the site and be used easily. These include screen readers, screen magnifiers, text-to-speech software, speech recognition software, and alternative keyboards or pointing devices.

Captions and Transcripts

Videos on the web should have captions and transcripts should be available for all audio content.

Page Break Locators

Page break locators are essential in helping people with disabilities know where web pages end. Use a specific page break locator for every web page and you will help users with different abilities to easily access your site.

Navigation Without a Mouse

The website should be navigable without the use of a mouse. It should also have a clear and logical structure so that users can easily find the information they are looking for.

Alternative Text

Images on the web should have alternative text so that users can understand the content of the images should they be unable to see them. There are many authoring tools that can help you achieve this.

Headings and Labels

The website should use headings and labels to help users navigate the website and to understand the content on the web.

Audio Descriptions

Videos on the web should have an audio description so that users who are blind or have low vision can understand the digital content of the video.

Error Messages

When there is an error on the website, an error message should be displayed to help users understand what went wrong.

Valid Code

The code on the web page should be valid so that it can be used by a variety of browsers and devices.

Web Accessibility Success Criteria

Each guideline has a number of success criteria that help web developers create websites that meet the needs of all users. The success criteria are divided into three levels:

Level A

This success criteria level is the most basic level of digital accessibility. All websites should meet this level. It includes criteria that are necessary for some users to be able to use the website.

Level AA

This is the level that most organizations should meet. It is also the level required by many government agencies.

Level AAA

This is the highest level of conformance. Very few sites will be able to meet all Level AAA Success Criteria, due to the demands they place on both users and authors. You need to invest time, effort, and resources to reach the Level AAA conformance.

Techniques

WCAG 2.2 details a wide range of techniques that site owners can use to create accessible content. Some are specific to particular technologies, while others are general in nature and can be applied across technologies.

Sufficient Techniques

These are the techniques that you must use in order to meet the Success Criteria. If there is more than one sufficient technique for a Success Criterion, then you can choose any one of the techniques to implement.

Advisory Techniques

Advisory Techniques are informative only and do not directly impact the conformance of web content to WCAG. They are generally used as guidance to understand how website owners can meet the Success Criteria in WCAG or to offer information about digital accessibility features that may not be obvious from the Success Criteria themselves.

Failure Techniques

The Failure Techniques are used to determine if the content fails WCAG. If any of the Failure Techniques apply, then it means that the website does not meet the Success Criteria for web accessibility.

WCAG 2.2 vs WCAG 2.1

WCAG 2.2 is an improved version of WCAG 2.1. This new version has been made to continue the good work of promoting digital accessibility for people with disabilities. With it, users with low vision, cognitive or learning disabilities, deafness or hearing loss, and physical disabilities will have an easier time accessing the web.

What’s New With WCAG 2.2?

As mentioned, there are three levels of conformance with WCAG: A, AA, and AAA. The main difference between WCAG versions is the addition of new Success Criteria at each level.

The New Success Criteria

The WCAG 2.2 comes with nine new success criteria. We outline these below:

Success Criteria 2.4.11, “Focus Appearance (Minimum)”

Success Criteria 2.4.11 is a Level AA Success Criterion. It outlines the requirements for focus indicators for user interface components when they receive keyboard focus. A focus indicator is a small graphical cue that shows which element on the page has focus. It includes things like the dotted outline around a form field when it is selected or a clearly visible cursor to help someone navigate a webpage.

Success Criteria 2.4.12, “Focus Appearance (Enhanced)”

This is a Level AAA Success Criterion and is similar to the previous one, but with a few additional requirements. The main difference is that, in addition to the element being distinguishable when it receives focus, it must also be visually distinguishable when it does not have focus.

Success Criteria 2.4.13, “Fixed Reference Points”

This is a Level A Success Criterion that addresses the need for website content to be presented in a way that is not solely dependent on visual cues. When people with low vision zoom in on content, they can lose their place if there are no fixed reference points.

Success Criteria 2.5.7, “Dragging Movements”

Success Criteria 2.5.7 is a Level AA criterion in WCAG 2.2. It requires that users be able to complete a dragging movement using a single pointer, without having to hold down a modifier key. If possible, doing away with a dragging operation altogether is the best solution. But if you must have one, make sure it can be completed using a single pointer.

Success Criteria 2.5.8, “Pointer Target Spacing”

This is a level AA criterion that requires the target space of every single pointer to be at least 44 by 44 CSS pixels. This means that, at the default font size, there should be four characters horizontally and four lines vertically between targets. This is to prevent the inadvertent selection of targets that are close together, especially when using a touch screen or trackpad.

  • The target is inline a sentence.
  • The spacing for information is not a target minimum size.

How To Meet This Criterion

  • Increase the size of targets. This is probably the easiest way to meet the criterion, especially if you have a lot of small targets on your page.
  • Reduce the amount of space between targets. If you have a lot of targets that are close together, you can try reducing the amount of space between them.
  • Increase the contrast between targets and the surrounding content. This will make it easier for people with visual impairments to see your targets.
  • Use a different pointer style for your targets. The WCAG guidelines suggest using a closed hand single pointer style for targets that are close together.
  • Make your targets touch-friendly. If you are targeting mobile devices, make sure that your targets are large enough to be touched easily.
  • Add a border around your targets. Doing this will make your targets easier to see and will also help people with visual impairments to see them.
  • Use a different color for targets. The WCAG 2.2 guidelines suggest using a color that has good contrast with the surrounding content. This will make your targets easier to see for people with visual impairments.
  • Add labels to targets. This will help people with cognitive impairments to understand what they are selecting.
  • Use icons instead of text. This can be helpful for people with cognitive impairments who may have difficulty understanding the text.

Success Criteria 3.2.6, “Consistent Help”

This Level A criterion requires website owners to provide users with the ability to find help content when they need it, without having to go through complex navigation.

  • human contact mechanism
  • self-help functionality
  • a fully automated contact mechanism

To pass this criterion, websites must provide one of the following:

  • A search function: This can be a simple search bar on the homepage or a more robust search functionality that includes an index, search results pages, and the ability to filter and sort results. Make sure there are no hidden controls that prevent users from accessing the search function.
  • Links to supporting documents: These links can be included in the header or footer of the site, or embedded within individual web pages as needed. The important thing is that they are easily accessible from anywhere on the site.
  • Contact information: This can be a simple email address or phone number, or a more robust contact page with multiple methods of communication.

Success Criteria 3.2.7, “Visible Controls”

Success Criteria 3.2.7 is a Level AA criterion that is all about making sure that user interface components, such as forms, text fields, and buttons, are visible to everyone.

Success Criteria 3.3.7, “Accessible Authentication”

This Level AA criterion requires websites to provide alternative logging-in methods.

  • Allow the user to choose from a set of options, including an audio option
  • Provide an accessible alternative to the CAPTCHA, such as a link to an email address or phone number where the user can request assistance

Success Criteria 3.3.8, “Redundant Entry”

Success Criteria 3.3.8 aims to simplify website forms and make it easier for people with disabilities, as well as those without, to submit their information online.

  • the information is necessary to ensure security
  • previously information isn’t valid anymore

What Are The Changes For Websites?

The Success Criteria above fall under four general guidelines in WCAG 2.2 for making websites more accessible to people with disabilities. These guidelines are outlined below:

Guideline 2.4 Navigable

This is a guideline that has been in place in previous WCAG versions. In WCAG 2.2, however, it is being promoted from Level A to Level AA.

Guideline 2.5 Input Modalities

This new guideline in WCAG 2.2 requires that content can be operated using a variety of input methods beyond keyboards, such as voice, switches, and touch. This is in addition to the existing requirement for full keyboard accessibility.

Guideline 3.2 Predictable

The WCAG 2.2 guidelines stipulate that web content should be presented in a way that is predictable. This means that users should be able to predict what will happen when they interact with web content.

Guideline 3.3 Input Assistance

Forcing users to enter information in a certain format can be frustrating and may cause them to abandon your site altogether.

How Will WCAG 2.2 Benefit The User?

WCAG 2.2 is an update that comes with a plethora of benefits to the user. These include the following:

Enhanced Accessibility

WCAG 2.2 will help to improve digital accessibility for people with disabilities, by providing updated guidelines and new Success Criteria for all websites to follow.

Better Compatibility with Assistive Technologies

WCAG guidelines are designed to be compatible with a wide range of assistive technologies.

  • An improved understanding of how assistive technologies work and how they are used by people with disabilities
  • Improved guidance on the use of colour, contrast, and other visual design elements

Improved Readability

The updated WCAG success criteria will help to improve the readability of website content. This will make it easier for people with cognitive disabilities to understand and use websites.

Requiring the Use of Clear and Simple Language

WCAG 2.2 will require the use of clear and simple language in web content. This will make it easier for people with cognitive disabilities to understand and use web content.

Improving the Structure of Web Content

WCAG 2.2 will provide guidance on how to improve the structure of web content, making it easier for people with cognitive disabilities to find the information they need.

Providing Alternative Versions of Web Content

WCAG 2.2 will require the provision of alternative versions of web content, such as audio or video, to make it accessible to people with different disabilities.

Enhanced Usability

WCAG guidelines are designed to improve the usability of web content and services.

Providing Guidance on How to Design User Interfaces That are Easy to Use

WCAG will provide guidance on how to design user interfaces that are easy to use, making it easier for all users to find and use the information they need.

Improving the Navigability of Website Content

WCAG will provide guidance on how to improve the navigability of web content. This enhances the ease of use, making it possible for people with disabilities to make the best out of their favourite sites.

Requiring the Use of Consistent Design Elements

WCAG will require the use of consistent design elements. This makes it convenient for them to find the value they are looking for in a site.

Reduced Barriers to Entry

WCAG guidelines are designed to reduce barriers to entry for people with disabilities. The updated guidelines will further reduce barriers by providing guidance on how to design web content and services that are accessible to people with different disabilities.

  • The design of user interfaces that are easy to use: WCAG 2.2 details how to design user interfaces that are easy to use, making it easier for all users to find and use the information they need.
  • The provision of alternative versions of web content: WCAG will require the provision of alternative versions of web content, such as audio or video.

The Benefits Of WCAG 2.2 For Businesses And Website Owners

Apart from users with disabilities, businesses can also benefit from WCAG 2.2 in many ways.

Expand Customer Base

Using WCAG guidelines can help businesses to expand their customer base by making their web content and services accessible to people with disabilities.

Improve Search Engine Rankings

Adhering to WCAG guidelines can also improve a business’s search engine rankings. Search engines, such as Google, give preference to accessible websites.

Reduce Legal Risk

Businesses that make their web content and services accessible to people with disabilities can also reduce their legal risk.

Better Customer Relationships

By making their web content and services accessible to people with disabilities, businesses can also improve their customer relationships.

What Are The Penalties For Non-Compliant Websites?

Penalties for non-compliance with WCAG vary between countries. In Canada, the Accessible Canada Act became law in 2019. Its goal is to help improve accessibility within information, communication, and digital technologies.

Pro Tips For Implementing WCAG 2.0

There are a few things businesses should keep in mind when implementing WCAG guidelines:

Have a Workable Plan

They say failing to plan is planning to fail. The same can be said for implementing WCAG 2.2 guidelines.

  • A timeline: Businesses should create a timeline for implementing WCAG guidelines. This will help you to track your progress, and ensure that you are on track to meet your goals.
  • A budget: Businesses should create a budget for implementing WCAG 2.2 guidelines. By doing so, you can allocate resources in a more efficient manner and ensure that you do not overspend.

Get Stakeholder Buy-In

Implementing WCAG guidelines can be a daunting task. So, it’s important to get buy-in from all stakeholders and involved parties before starting.

Test, Test, Test

After making changes to the website, it’s vital to test them thoroughly. This will ensure that the changes are effective and that they do not adversely affect the user experience.

Monitor and Evaluate Progress

After implementing WCAG guidelines, it’s important to monitor and evaluate progress. This will help businesses to identify any areas where they need to make improvements.

Make Continuous Improvements

WCAG guidelines are constantly evolving. As new technologies are developed, businesses should make sure that they are keeping up with the latest guidelines. This will ensure that their website is always accessible as possible to all users.

Final Thoughts

Making sure your website is accessible to everyone is incredibly important. Complying with WCAG ensures that you give everyone the equal chance to use or access your site and get the information they need.

--

--

Parachute Design Group Inc. is a boutique Toronto web design agency specializing in beautiful hand-made website design, custom logo design and branding.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Parachute Design

Parachute Design Group Inc. is a boutique Toronto web design agency specializing in beautiful hand-made website design, custom logo design and branding.