How to make websites more accessible—understanding WCAG standards

Contents

This article provides an essential guide to the Web Content Accessibility Guidelines (WCAG), detailing their importance and their practical application for creating inclusive digital environments. You will learn how to implement these guidelines across various versions, understand their impact on business and legal compliance, and get insights into the future of digital accessibility standards.

 

What is WCAG?

WCAG, or the Web Content Accessibility Guidelines, serves as a comprehensive framework established by the World Wide Web Consortium (W3C) for enhancing digital accessibility. It provides structured recommendations aimed at ensuring that online content is perceivable, operable, understandable, and robust for individuals with disabilities.

In essence, WCAG serves as a guiding principle for web developers, designers, content creators, and policymakers to facilitate inclusive digital experiences. It underscores the importance of ensuring that web content can be accessed, navigated, and comprehended by users of all abilities, thus fostering inclusivity and equal access to online resources.

 

Origins of the Web Content Accessibility Guidelines

The Web Content Accessibility Guidelines (WCAG) have evolved over time in response to technological advancements and a growing understanding of accessibility needs. Here’s a brief history:

  • WCAG 1.0 (1999): The first version of the Web Content Accessibility Guidelines (WCAG 1.0) was released in 1999 by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C). This foundational set of guidelines aimed to enhance web accessibility for individuals with disabilities, categorizing compliance into three priority levels: A, AA, and AAA, with AAA representing the highest standard of accessibility.
  • WCAG 2.0 (2008): Recognizing the need for more comprehensive and flexible guidelines, work began on WCAG 2.0. After several years of development and with input from stakeholders, WCAG 2.0 was published as a W3C Recommendation in December 2008. It introduced four principles of accessibility (perceivable, operable, understandable, robust) and organized success criteria around these principles. WCAG 2.0 marked a significant shift toward a more technology-neutral and principles-based approach to accessibility.
  • WCAG 2.1 (2018): With the rapid evolution of technology, particularly in mobile and touchscreen devices, there was a need to update WCAG to address emerging accessibility challenges. WCAG 2.1 was developed to complement WCAG 2.0 and introduced additional success criteria to address new accessibility issues not covered in the previous version. WCAG 2.1 was published as a W3C Recommendation in June 2018.
  • Future updates: The W3C continues to monitor developments in technology and user needs to ensure that WCAG remains relevant and effective. Future updates to the guidelines are expected to address emerging technologies, such as virtual reality and augmented reality, as well as evolving accessibility requirements.

 

Overall, the WCAG standards have played a crucial role in promoting digital accessibility and fostering an inclusive online environment. They provide a framework for web developers, designers, and content creators to follow, helping to ensure that people with disabilities can access and interact with web content on an equal basis with others.

The four fundamental principles of WCAG

The fundamental principles of WCAG (Web Content Accessibility Guidelines) are the cornerstone concepts that underpin the guidelines and drive their implementation. These principles are designed to ensure that digital content is accessible to all users, including those with disabilities. The four fundamental principles of WCAG are as follows:

Perceivable: Information and user interface components must be presented in ways that users can perceive. This principle emphasizes the importance of making content available to users in various sensory modalities. For example, consider a web page containing a photograph of downtown Warsaw at sunset. Without alt text, a screen reader user would not know what the image depicts. However, adding alt text such as “A colorful sunset over a Warsaw city skyline” helps individuals using screen readers to perceive the content of the image and gain a better understanding of the web page’s context.

Operable: The user interface components and navigation must be operable by all users, including those with mobility impairments. This principle focuses on ensuring that users can interact with content and navigate through websites using various input methods, such as keyboard, mouse, or touch. Providing keyboard accessibility and allowing users enough time to complete tasks are examples of operable design considerations. Imagine a user with a mobility impairment who cannot use a mouse due to limited dexterity. They navigate to a website to complete a form and submit an inquiry. In order to do this effectively, the website must allow them to:

  • tab through the interactive elements on the page, such as links and form fields, in a logical order;
  • use the Enter key to activate buttons and submit forms;
  • receive clear visual focus indicators (e.g., highlighting or underlining) as they navigate through each element using the keyboard;
  • navigate back and forth within drop-down menus and select options using the keyboard alone.

 

If any of these elements are not operable via keyboard alone, a user with mobility impairments would encounter barriers in accessing and interacting with the website.

Understandable: Information presented and the operation of the user interface must be understandable. This principle emphasizes the importance of presenting content in a clear and intuitive manner, making it easy for users to comprehend and navigate. Using plain language, providing consistent navigation, and offering clear instructions help users understand and interact with content effectively. Here’s an example of an understandable error message:

“Oops! It looks like the password you entered is too short. Please enter a password with at least 8 characters.”

In this example, the error message clearly identifies the issue (a short password) and provides guidance on how to resolve it (enter a password with at least eight characters). The language used is simple and straightforward, making it easy for the user to understand what went wrong and how to fix it.

In contrast, an unclear or ambiguous error message, such as “Error: Invalid input,” would not provide sufficient information for the user to understand the problem and take appropriate action.

Robust: Content should be robust enough to be consistently interpreted by a broad range of user agents, including assistive technologies. This principle guarantees that digital content remains accessible amid evolving technologies. Utilizing standard markup languages, adhering to coding best practices, and thoroughly testing content on various browsers and devices are essential for maintaining robust accessibility.

Consider a website that has been developed using modern web technologies and standards. While it may work perfectly in the latest version of popular web browsers like Google Chrome or Mozilla Firefox, it may not function properly in older browsers or alternative browsers used by some individuals, such as Internet Explorer or Safari.

Additionally, users with disabilities often rely on assistive technologies like screen readers or braille displays to access web content. It’s essential that websites are compatible with these assistive technologies so that users with disabilities can navigate and interact with the content effectively.

These four principles serve as the foundation for the WCAG guidelines and guide developers, designers, and content creators in creating accessible digital experiences for all users, regardless of their abilities or the technologies they use.

 

Levels of conformance

WCAG (Web Content Accessibility Guidelines) standards are organized into three levels of conformance, often referred to as A, AA, and AAA. These levels indicate the degree to which a website or other digital content conforms to the WCAG guidelines, with each level representing a progressively higher standard of accessibility. Here’s an overview of each level:

  • Level A (minimum conformance): Level A conformance addresses the most basic and essential accessibility requirements. Meeting Level A criteria ensures that the content is accessible to some extent, but it may still have significant barriers for some users with disabilities. Level A guidelines typically include fundamental accessibility features that are relatively easy to implement and have a significant impact on accessibility.
  • Level AA (intermediate conformance): Level AA conformance builds upon Level A by addressing additional accessibility requirements that enhance the usability and accessibility of content for a broader range of users with disabilities. Meeting Level AA criteria ensures a higher level of accessibility and a more inclusive user experience. Level AA guidelines cover a wider range of accessibility features and often involve more complex implementation.
  • Level AAA (maximum conformance): Level AAA conformance represents the highest level of accessibility and encompasses the most stringent accessibility requirements. Meeting Level AAA criteria ensures the highest degree of accessibility and usability for users with disabilities. Level AAA guidelines include advanced accessibility features and may require significant effort and resources to implement fully.

 

It is important to note that achieving conformance with higher levels of WCAG does not necessarily mean that a website or digital content is perfectly accessible to all users. However, adhering to higher levels of conformance increases the likelihood that the content will be accessible to a broader range of users with disabilities and provides a more inclusive user experience overall.

Many organizations aim for at least Level AA conformance to ensure a reasonable level of accessibility for their websites and digital content. However, the specific level of conformance pursued may depend on factors such as legal requirements, organizational priorities, and the target audience’s accessibility needs.

Why WCAG compliance is important for business

Upgrading websites and applications to meet WCAG standards may be profitable for software companies. WCAG is not legally mandated per se in most jurisdictions. However, many countries have adopted or are in the process of adopting accessibility laws and regulations that reference or incorporate WCAG as a standard.

For example, the EU Web Accessibility Directive requires public sector websites and mobile applications to be accessible, and it references the WCAG standards. The European Union official requires its member states to abide by WCAG 2.1 Level AA standards. Many websites managed by public institutions have to be amended in order to meet these standards.

Also, private websites and applications should aim to meet the abovementioned standards, especially regarding positioning. There are indirect benefits that can positively influence search engine rankings when WCAG is implemented:

  • Improved user experience: Websites that are accessible and user-friendly tend to have better engagement metrics, such as lower bounce rates and longer average session durations. Google’s algorithms prioritize websites that provide a positive user experience, which can indirectly contribute to higher search rankings.
  • Enhanced accessibility features: Some accessibility features recommended by WCAG, such as providing descriptive alt text for images and creating descriptive page titles, also align with best practices for search engine optimization (SEO). Optimizing these elements can improve the visibility of web pages in search results.
  • Increased reach and engagement: Accessible websites accommodate a broader audience, including people with disabilities, older adults, and users accessing content on mobile devices. By reaching a wider audience and catering to diverse user needs, websites may attract more traffic and engagement, which can positively impact search rankings over time.
  • Reputation and authority: Websites that prioritize accessibility demonstrate a commitment to inclusivity and user-centric design, which can enhance their reputation and authority within their respective industries. Google’s algorithms take into account factors such as website credibility and trustworthiness when determining search rankings.

 

WCAG and Google Search Essentials criteria in many cases are the same, so implementing accessibility standards can create a competitive advantage for organizations and differentiate them in the marketplace.

 

In summary

WCAG provides a framework for web developers, designers, and content creators to follow when designing and developing digital content, with the goal of making it perceivable, operable, understandable, and robust for all users, regardless of their abilities or disabilities. Adhering to WCAG helps ensure that digital content can be accessed and used by a wide range of people, promoting inclusivity and equal access to information and services on the web. WCAG implementation should be an important step for any website and application development for the private and public sectors.

Sign up for the newsletter

You may also find interesting:

Product Design Sprint

Design Sprint is a process of business problems solving developed by Google Ventures. It was created to help start-ups build better products. We adapted this method to the requirements of big organizations.

Design-Driven Innovation

Innovation is often about changing the meaning of what a product or a service is and what it offers its users. This is the core of the design.

The first choice for e-Commerce – Magento

One of the most popular and functional platforms for creating professional online shopping sites. A good choice for large-scale web applications that aim to provide a good fit between functionality and customer requirements.

Book a free 15-minute discovery call

Looking for support with your IT project?
Let’s talk to see how we can help.

The controller of the personal data is FABRITY sp. z o. o. with its registered office in Warsaw; the data is processed for the purpose of responding to a submitted inquiry; the legal basis for processing is the controller's legitimate interest in responding to a submitted inquiry and not leaving messages unanswered. Individuals whose data is processed have the following rights: access to data, rectification, erasure or restriction, right to object and the right to lodge a complaint with PUODO. Personal data in this form will be processed according to our privacy policy.

You can also send us an email.

In this case the controller of the personal data will be FABRITY sp. z o. o. and the data will be processed for the purpose of responding to a submitted inquiry; the legal basis for processing is the controller’s legitimate interest in responding to a submitted inquiry and not leaving messages unanswered. Personal data will be processed according to our privacy policy.

dormakaba 400
frontex 400
pepsico 400
bayer-logo-2
kisspng-carrefour-online-marketing-business-hypermarket-carrefour-5b3302807dc0f9.6236099615300696325151
ABB_logo

Book a free 15-minute discovery call

Looking for support with your IT project?
Let’s talk to see how we can help.

Bartosz Michałowski

Head of Sales at Fabrity

The controller of the personal data is FABRITY sp. z o. o. with its registered office in Warsaw; the data is processed for the purpose of responding to a submitted inquiry; the legal basis for processing is the controller's legitimate interest in responding to a submitted inquiry and not leaving messages unanswered. Individuals whose data is processed have the following rights: access to data, rectification, erasure or restriction, right to object and the right to lodge a complaint with PUODO. Personal data in this form will be processed according to our privacy policy.

You can also send us an email.

In this case the controller of the personal data will be FABRITY sp. z o. o. and the data will be processed for the purpose of responding to a submitted inquiry; the legal basis for processing is the controller’s legitimate interest in responding to a submitted inquiry and not leaving messages unanswered. Personal data will be processed according to our privacy policy.

dormakaba 400
toyota
frontex 400
Ministry-of-Health
Logo_Sanofi
pepsico 400
bayer-logo-2
kisspng-carrefour-online-marketing-business-hypermarket-carrefour-5b3302807dc0f9.6236099615300696325151
ABB_logo