The WCAG Standard – Principles, Guidelines & Criteria

With the growing number of lawsuits around website accessibility, it is important to make sure that the products and services your website offers are accessible to visitors that have disabilities. What can make this process difficult is not knowing or understanding what guidelines to follow to make this happen. As of July 2020, there are no official federal guidelines on website usability, however, based on the numerous cases that have been brought to courts across America, the common standard that has been applied for website accessibility is the Web Content Accessibility Guidelines (WCAG) standard by World Wide Web Consortium (W3C). More specifically, the 2.1 standard recommendations were published in June of 2018.

What are the requirements to conform to WCAG?

There are five requirements for conforming to the WCAG standard:

  1. Conformance Level: To meet the WCAG standard, a page must meet all the requirements to achieve a level of conformity (Level A, AA, AAA), which is based on the level of success criteria outlined in the WCAG documentation. As the levels go higher, a stricter set of guidelines must be met. In our experience, most websites must meet at least a AA conformance level in order for the website to be ADA compliant. Some websites may need to go further and meet the AAA standard. This is especially true for government websites.
  2. Full Pages: An entire page must meet one of the levels of conformity to meet compliance. Likewise, to achieve a Level AA or above standard, the entire page must meet that level of success criteria. You may have parts of a page that go above the A or AA compliance criteria, which you can call out in your accessibility statement. There are also workarounds when a piece of a page cannot meet the standard to get the page to conform.
  3. Process Page Conformance: A common type of process is a checkout. Over the course of purchasing a product, there may be multiple pages involved. Each page in the process must conform to at least level A of the standard or better, and all pages must meet the same level to be conforming to that level. For example, if the cart page conforms to level AA, but the billing/shipping information page only conforms to Level A, then the process only conforms to Level A of the standard.
  4. Only Accessibility-Supported Ways of Using Technologies: Technology used on a page or set of pages must be accessible by accessibility-supported technologies. For example, if a page has images, then a screen reader should be able to focus on that element and be able to tell the user what the image is with the use of an alt tag. Assistive technology must be able to access every element on a page that a user not using assistive technology can. If there is a video with buttons for play, pause, captions, etc., the assistive technology must be able to access and interact with those buttons. To meet compliance, all success criteria should be met with the use of assistive technology. The W3C DOES NOT specify which assistive technologies are supported by the standard and there are many kinds of impairment that need to be taken into consideration when assessing whether a certain technology can be accessed by the user. It is recommended that all assistive technologies used during testing be declared within the site’s accessibility statement.
  5. Non-Interference: If a website uses a technology that is not accessibility supported, the element should not block the user’s ability to access the rest of the page. For example, if the site implements the use of a new video technology that is not accessibility supported, but the transcript for what is said in the video is on the page, then the page would conform. However, if the assistive technology being used gets stuck in the video element and cannot access the rest of the content on the page, then the use of the element would interfere with the assistive technology, and the page would fail to meet the compliance standard.

The WCAG Principles of Accessibility

  • There are four major principles that WCAG breaks the guidelines and success criteria down into. These four principles represent the requirements necessary for accessible content.

    1. Perceivable – All elements that are interactable or can be seen by those without disabilities should be seen as presentable to all users. A piece of content that can be read by someone with vision cannot be inaccessible to someone who is blind, for example.
    2. Operable: User interface components and navigation must be available to everyone. A clickable menu must be accessible to someone using keyboard tabbing.
    3. Understandable – Content and user interface elements must not be too complex and easy to follow. The site must have a clean and easy-to-understand design. A medical site that contains complex content may have a separate section that is easier for users with cognitive or learning disabilities to understand.
    4. Robust – Site content should be varied enough that the content can be understood by assistive technologies, and the content should continue to be updated based on new assistive technologies, as they evolve).

    The WCAG 2.1 standard organizes each individual guideline and success criteria into one of the 4 principles below. If one of the principles are not met, then a website is not truly accessible to all. Again, based on the type of website, the actual practical steps to take to make a website compliant will be different, however all accessible websites will need to succeed at each of these requirements.

What are the WCAG Levels of Compliance and Standards?

When the WCAG came up with the Accessibility standard, they based their success criteria on issues of access that were vital to people with disabilities and how much greater a problem was that accessibility issues for users with a disability vs. non-disabled. This concept differentiates itself from websites that are inaccessible to everyone (a badly designed or broken website) vs. a website that works well for non-disabled users, but is inaccessible to those with a disability.

Another important condition for inclusion as success criteria for WCAG Standards is the testable nature of the criteria. If a success criteria is impossible to test to ensure the website meets or fails to meet those criteria, then it would be impossible for the webmaster or anyone else to know if pages on their website are accessible to the disabled. Every concept in the WCAG 2.1 standard is testable by human and machine evaluation to determine whether the success criteria are met.

The WCAG levels of compliance can be broken down into three levels, based on the relative amount of disabled users that would be helped. (WCAG A AA AAA)

Level A: This criterion consists of changes to the website that are the least intrusive to site design, and are generally made up of concepts that are considered the easiest to implement. The changes at this level will benefit the most amount of users.

Level AA: This criterion consists of changes to a website that may be more substantive to the overall look and feel of the website. This would include changes to the colors of the website to meet certain contrast ratios, as well as changes to navigation, etc. Criteria at this level are more intricate and may need the help of a web designer.  This is the recommended level for most websites.

Level AAA: This criterion is the most strict. WCAG does not recommend this level for most websites as “it is not possible to satisfy all Level AAA Success Criteria for some content.”  Unless your website is specialized with a need for accessibility, we do not recommend this level of compliance.

We mentioned earlier that a page should meet at least the AA level of conformance. Many of the lawsuits we’ve seen have referenced and used Level AA as the standard for whether a website is or is not ADA compliant.

To understand what is meant by WCAG guidelines and success criteria, let’s look at one. The first guideline underneath the Perceivable principle in the WCAG 2.1 standard is:

“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”

To meet this guideline, the WCAG lays out a list of success criteria to meet:

  • Controls, Input: If non-text content is a control or accepts user input, then it has a name that describes its purpose.
  • Time-Based Media: If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content.
  • Test: If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content.
  • Sensory: If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content.
  • CAPTCHA: If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.
  • Decoration, Formatting, Invisible: If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.

This is a Level A guideline, which means that if the page is going to meet the minimum standard of WCAG, the page must pass this guideline.

Examples of Meeting this WCAG Guideline

All non-text content should have a text alternative. For example, if you have an image of the company’s CEO shaking hands with a world leader, add a text alternative that says something like “CEO shakes hands with the president of the country”.

If you have a video or audio segment on the page, add a transcript so that users with hearing disabilities can understand the content.

If you have content that is complex and uses large words, add a section that defines complex words or a summary.

Each guideline contains it’s own set of success criteria and ways to meet those criteria. Based on the Level of accessibility that you choose to implement on your website, the number of success criteria needed to ensure that the guideline is met will vary. Only when the guidelines are met, and the principles achieved, can a website meet the accessibility stand of WCAG and be seen as ADA compliant.

Why is WCAG 2.1 AA Important?

WCAG 2.1 AA is important because it is a standard for guidelines on making website content more accessible to users with disabilities. Adhering to these web guidelines can help ensure that individuals with disabilities, such as those with visual impairments, auditory impairments, or mobility impairments, are able to access and use the information and functionality provided by a website. Additionally, following WCAG 2.1 AA guidelines can also benefit a wider range of users, such as those using small screens, poor connectivity, or older technologies.

Need help getting your website to meet WCAG standards?

If you need help implementing the WCAG 2.1 standard on your website or want an audit of a website to ensure ADA compliance of work already done, CaliNetworks can help make sure that your site becomes compliant. We have years of experience applying the standards of WCAG 2.1 AA to a number of websites of different types (e-commerce, legal, education, etc.) and can help you make sure your website is compliant so that users of all disabilities can use your website and avoid a costly lawsuit.

If you are looking for an experienced ADA compliance team to help your site, contact us now by phone at 805-409-7700, or through our contact form.

CaliNetworks Reviews

Kim JonesKim Jones
17:57 23 Dec 22
I've worked with several stellar social media companies in the past, and CaliNetworks is by far the best of the best! What sets them apart is not only their full-suite of digital media offerings (social, SEO, and graphic design), but also their exceptional service, focus on exceeding their clients' expectations, and creative solution offerings. I can't recommend them enough!
Stella JamesStella James
13:02 09 Dec 22
Calinetworks has been amazing to work with. They helped me move and host my website, as well as fix all of the issues I was having. Support has been great and I'm looking forward to improving my online business with them.Always available very detailed oriented & never misses a beat!
Chloe CarsonChloe Carson
04:29 20 Nov 22
Calinetworks has helped me with my website and ADA compliance. They have been super helpful with the setup and hosting of the website, as well as the website updates. The customer service is top notch. I highly recommend this company if you’re not happy with your current marketing company.
Bradley LeeseBradley Leese
01:34 31 Oct 22
Ty Carson, the president of CaliNetworks, is about as sharp as they come. I had the great privilege of working with Ty many years ago, and I am a much better SEO Analyst because of his leadership and wealth of knowledge. Considering Ty has consulted with some of the largest companies in the world, I recommend taking advantage while prices are low because demand for his services is on the rise.