Skip to main content

What is WCAG?

The Web Content Accessibility Guidelines (WCAG) are international standards that ensure websites are accessible to everyone, including people with disabilities.

Commons Kit is WCAG 2.2 AA Compliant

Understanding WCAG

WCAG stands for Web Content Accessibility Guidelines. Developed by the World Wide Web Consortium (W3C), these guidelines provide a single shared standard for web content accessibility that meets the needs of individuals, organizations, and governments internationally.

The current version, WCAG 2.2, was published in October 2023 and builds upon previous versions (2.0 and 2.1) while adding new success criteria that address mobile accessibility, people with low vision, and people with cognitive and learning disabilities.

Many countries have adopted WCAG as the basis for their accessibility laws, including the Americans with Disabilities Act (ADA) in the United States, the Accessibility for Ontarians with Disabilities Act (AODA) in Canada, and the European Accessibility Act.

Conformance Levels

WCAG defines three levels of conformance to meet the needs of different groups and situations.

A

Level A

The minimum level of accessibility. Addresses the most critical barriers that would prevent users from accessing content at all.

All images have text alternatives
Videos have captions
Content can be accessed with a keyboard
Pages have descriptive titles
AA

Level AA

Recommended Standard

The recommended standard for most websites. Addresses major barriers and is the target for most accessibility laws and regulations.

Sufficient color contrast (4.5:1 ratio)
Text can be resized up to 200%
Consistent navigation across pages
Form inputs have visible labels
AAA

Level AAA

The highest level of accessibility. Provides enhanced access but may not be achievable for all content types.

Sign language for video content
Enhanced color contrast (7:1 ratio)
No timing limits on content
Section headings organize content

The Four Principles of Accessibility

WCAG is organized around four core principles, often remembered by the acronym POUR. These principles ensure web content is accessible to everyone.

Perceivable

Information must be presentable to users in ways they can perceive. This means providing alternatives for non-text content and making it easier to see and hear content.

1.1Text Alternatives

Provide text alternatives for non-text content

1.2Time-Based Media

Provide alternatives for audio and video

1.3Adaptable

Create content that can be presented in different ways

1.4Distinguishable

Make it easier to see and hear content

Operable

User interface components must be operable. Users must be able to navigate and use your site with various input methods, not just a mouse.

2.1Keyboard Accessible

Make all functionality available from a keyboard

2.2Enough Time

Provide users enough time to read and use content

2.3Seizures and Physical Reactions

Do not design content that causes seizures

2.4Navigable

Provide ways to help users navigate and find content

2.5Input Modalities

Make it easier to use inputs beyond keyboard

Understandable

Information and user interface operation must be understandable. Users must be able to understand both the content and how to use the interface.

3.1Readable

Make text content readable and understandable

3.2Predictable

Make pages appear and operate in predictable ways

3.3Input Assistance

Help users avoid and correct mistakes

Robust

Content must be robust enough to be interpreted by a wide variety of user agents, including assistive technologies like screen readers.

4.1Compatible

Maximize compatibility with current and future user agents

Who Benefits from WCAG?

Approximately 1 in 4 adults in the United States has some type of disability. Accessible websites ensure everyone in your community can access the information and services they need.

People with Visual Impairments

Including those who are blind, have low vision, or are color blind

  • Screen reader users
  • Users who magnify content
  • Those who need high contrast

People with Hearing Impairments

Including those who are deaf or hard of hearing

  • Users who rely on captions
  • Those who need visual alerts
  • Sign language users

People with Motor Impairments

Including those with limited mobility or dexterity

  • Keyboard-only users
  • Voice control users
  • Switch device users

People with Cognitive Disabilities

Including those with learning disabilities, attention disorders, or memory issues

  • Users who need clear navigation
  • Those who need extra time
  • Users who benefit from consistent layouts

Older Adults

Who may experience changes in vision, hearing, motor skills, or cognition

  • Users with declining vision
  • Those with reduced dexterity
  • Users who need larger text

Everyone in Certain Situations

Accessibility features help everyone in various contexts

  • Watching video without sound
  • Using a phone in bright sunlight
  • Navigating with one hand

How Commons Kit Helps You Stay Compliant

Commons Kit is built from the ground up to meet WCAG 2.2 AA standards, so you can focus on serving your community without worrying about accessibility compliance.

Built-In Accessibility

  • Semantic HTML structure for screen readers
  • Keyboard navigation throughout
  • Proper color contrast ratios
  • Focus indicators on interactive elements
  • Skip navigation links

Compliance Tester in Page Builder

  • Real-time accessibility checking as you build
  • Automated detection of common issues
  • Suggested fixes for accessibility problems
  • Color contrast analyzer
  • Alt text reminders for images

Accessibility Without the Complexity

With Commons Kit, you don't need to be an accessibility expert. Our platform handles the technical requirements automatically, and our built-in compliance tester helps ensure your content meets WCAG standards before you publish.

WCAG 2.2 AA Quick Reference

Here are the key requirements for WCAG 2.2 Level AA compliance, organized by principle.

1. Perceivable

  • 1.1.1 Non-text content has text alternatives
  • 1.2.1 Audio/video-only content has alternatives
  • 1.2.2 Videos have captions
  • 1.2.3 Videos have audio description or text alternative
  • 1.2.4 Live videos have captions
  • 1.2.5 Pre-recorded videos have audio descriptions
  • 1.3.1 Information and relationships are programmatically determinable
  • 1.3.2 Meaningful reading sequence is preserved
  • 1.3.3 Instructions don't rely solely on sensory characteristics
  • 1.3.4 Content doesn't restrict display orientation
  • 1.3.5 Input fields identify their purpose
  • 1.4.1 Color is not the only visual means of conveying information
  • 1.4.2 Audio can be paused, stopped, or volume controlled
  • 1.4.3 Text has at least 4.5:1 contrast ratio
  • 1.4.4 Text can be resized to 200% without loss of content
  • 1.4.5 Images of text are avoided when possible
  • 1.4.10 Content reflows at 400% zoom
  • 1.4.11 Non-text content has 3:1 contrast ratio
  • 1.4.12 Text spacing can be adjusted
  • 1.4.13 Hover/focus content is dismissible and persistent

2. Operable

  • 2.1.1 All functionality is keyboard accessible
  • 2.1.2 No keyboard traps
  • 2.1.4 Character key shortcuts can be disabled
  • 2.2.1 Timing is adjustable
  • 2.2.2 Moving content can be paused, stopped, or hidden
  • 2.3.1 No content flashes more than 3 times per second
  • 2.4.1 Blocks of content can be skipped
  • 2.4.2 Pages have descriptive titles
  • 2.4.3 Focus order is logical and meaningful
  • 2.4.4 Link purpose is clear from text or context
  • 2.4.5 Multiple ways to find pages
  • 2.4.6 Headings and labels are descriptive
  • 2.4.7 Focus is visible
  • 2.4.11 Focus is not obscured (minimum)
  • 2.5.1 Multipoint gestures have single-pointer alternatives
  • 2.5.2 Pointer activation can be cancelled
  • 2.5.3 Visible labels are in accessible names
  • 2.5.4 Motion-based functions have alternatives
  • 2.5.7 Dragging has single-pointer alternatives
  • 2.5.8 Target size is at least 24x24 CSS pixels

3. Understandable

  • 3.1.1 Page language is identified
  • 3.1.2 Parts in other languages are identified
  • 3.2.1 Focus doesn't cause unexpected changes
  • 3.2.2 Input doesn't cause unexpected changes
  • 3.2.3 Navigation is consistent
  • 3.2.4 Components are identified consistently
  • 3.2.6 Consistent help is available
  • 3.3.1 Errors are identified and described
  • 3.3.2 Labels or instructions are provided
  • 3.3.3 Error suggestions are provided
  • 3.3.4 Legal/financial submissions are reversible
  • 3.3.7 Redundant entry is avoided
  • 3.3.8 Accessible authentication is available

4. Robust

  • 4.1.2 Custom components have proper names, roles, values
  • 4.1.3 Status messages are announced to assistive technology

Build an Accessible Website for Your Community

Commons Kit makes WCAG compliance effortless. Our platform is built with accessibility at its core, so every site you create meets the highest standards.

What is WCAG? | Commons Kit