WCAG 2: Your guide to a more inclusive web

The internet should be a place for everyone, regardless of ability. This becomes even more crucial when considering that an estimated 1 billion people worldwide have disabilities. These individuals are potentially underserved by today's digital products if accessibility isn't a primary concern.

Bridging the digital divide

In alignment with the mission of Global Accessibility Awareness Day (GAAD), which is "to get everyone talking, thinking and learning about digital access and inclusion," we can all play a role in making the web a more inclusive space.

In this guide, we dive into WCAG 2, the internationally recognised standards for making web content accessible to everyone.

The four pillars of WCAG 2

WCAG 2 is built upon four foundational principles:

Perceivable

Information and user interface components must be presented in ways users can perceive. This includes providing alternatives for non-visual content like text descriptions for images and captions for videos.

Operable

User interface elements and navigation should be operable by users with various disabilities. This means ensuring keyboard accessibility and compatibility with assistive technologies like screen readers.

Understandable

Web content and the user interface should be clear and easy to understand. This includes using plain language, avoiding technical jargon, and providing clear instructions.

Robust

Content should remain accessible when using different assistive technologies, including newer ones that may emerge in the future. Website and app owners and developers should strive for compatibility with a broad range of user needs and devices.

WCAG 2 conformance levels

WCAG 2 defines three conformance levels:

• Level A - This is the basic level, ensuring content is minimally accessible.
• Level AA - This level addresses a wider range of disabilities and is considered the recommended minimum for most websites.
• Level AAA - This is the most stringent level, catering to an even broader range of disabilities and user needs.

Benefits of compliance

There are numerous benefits to adhering to WCAG 2:

1. Increased audience reach - A wider range of users can access and interact with your website, expanding your potential audience, especially the 1 billion people globally with disabilities.
2. Improved user experience - Accessible design principles often lead to a more user-friendly experience for everyone.
3. Enhanced brand reputation - Demonstrating a commitment to accessibility can positively impact your brand image.

The need for WCAG 2

Unfortunately, many websites still struggle with accessibility.? A 2020 study by WebAIM found the following common accessibility failures on a significant percentage of home pages of the top 1 million websites. The failures found and the frequency was:

• Low contrast text (86.3%) - Text with insufficient contrast between the text colour and the background colour is difficult, or even impossible, for some users to read.
• Missing image alt text (66%) - Images without alternative text descriptions leave users who rely on screen readers in the dark about the image content.
• Empty links (59.9%) - Links without descriptive text can be confusing for users, especially those who use screen readers.
• Missing form input labels (53.8%) - Forms without clear labels for input fields can be frustrating and difficult to complete for users with disabilities.
• Empty buttons (28.7%) - Buttons without text labels can be unclear about their purpose and function.
• Missing document language (28%) - Specifying the document language helps assistive technologies understand the content and render it appropriately.

Get started with WCAG 2

These statistics highlight the importance of WCAG 2 compliance. By making our digital products accessible, we can ensure that the 1 billion people with disabilities have the same opportunities to access and benefit from the online world.?

Ready to make your website inclusive? The first step is to ask yourself, 'Can everyone access my site?' WCAG 2 compliance starts with good colour contrast between text and background. This free WebAIM Contrast Checker is a great tool to get you going!

This content is a modified version of a blog post originally published on the Dynamo6 website: https://www.dynamo6.com/thoughts/wcag-2-and-web-accessibility/