Did you know that 1 in 4 people have a disability, and that 80% of disabilities are invisible?\u00a0<\/b><\/p>\n
If you want to create digital products and experiences that can be enjoyed by everyone, you must design with accessibility in mind. Otherwise, you\u2019re excluding a huge portion of the population.<\/span><\/p>\n Interestingly, 70-80% of accessibility issues can be avoided at the design stage, and the Web Content Accessibility Guidelines (WCAG) can help you.\u00a0<\/span><\/p>\n The Web Content Accessibility Guidelines, or WCAG, are a set of universal rules and standards created to make digital content more accessible and inclusive.\u00a0<\/span><\/p>\n In this guide, we\u2019ll explain exactly what the WCAG are, why they\u2019re so important, and how to use them within your design practice. Consider this essential reading if you\u2019re involved in the design or development of any kind of digital product.\u00a0<\/span><\/p>\n\n The Web Content Accessibility Guidelines, or WCAG, are a set of guidelines designed to make digital content more accessible to people with disabilities.\u00a0<\/b><\/p>\n The purpose of the WCAG is to ensure that websites, apps, and digital tools can be used by as many people as possible, including those who are blind or visually impaired, deaf or hard of hearing, or have cognitive or motor disabilities.\u00a0<\/span><\/p>\n Who is responsible for the WCAG, and where do they come from?<\/strong><\/p>\n The Web Content Accessibility Guidelines are published by the World Wide Web Consortium (or W3C, as it\u2019s more commonly known).\u00a0<\/span> The W3C was founded by Tim Berners-Lee (who also invented the World Wide Web!), and it\u2019s the main international organisation that develops open standards for the web. That is: technical rules and guidelines that are publicly available to everyone, and developed through a collaborative, transparent process involving experts, organisations, and the public.\u00a0<\/span> Ultimately, you can think of the WCAG as a set of common standards and rules for how the web should function in a way that\u2019s fair, accessible, and inclusive for everyone.\u00a0<\/span><\/p>\n We\u2019ll talk more about the WCAG\u2019s core principles later on. But first, let\u2019s consider why these guidelines are so important.\u00a0<\/span><\/p>\n The WCAG have been around for years. The very first version, WCAG 1.0, was published way back in 1999, so the idea of digital accessibility is certainly nothing new.\u00a0<\/span> But, in light of the European Accessibility Act, the Web Content Accessibility Guidelines are now very much in the spotlight.\u00a0<\/span><\/p>\n So what exactly is the European Accessibility Act (EAA) and what\u2019s it got to do with WCAG?\u00a0<\/b><\/p>\n The European Accessibility Act is an EU directive aimed at enhancing the accessibility of key products and services for people with disabilities.\u00a0<\/span> The Act covers a broad range of products and services, like websites, mobile apps, ATMs, ticket machines, and e-books, with the goal of establishing a universal standard across all EU member states.\u00a0<\/span> While the Web Content Accessibility Guidelines aren\u2019t directly referenced in the legislation, aligning with WCAG will be crucial for ensuring compliance with the European Accessibility Act.\u00a0<\/span> And, with two important EAA compliance deadlines on the horizon, getting to grips with the WCAG is more important than ever.\u00a0<\/span> If you\u2019re affected by the European Accessibility Act (i.e. if you\u2019re based in one of the EU member states, or selling products and services to customers who are based in the EU), there are two key deadlines you need to be aware of:<\/span><\/b><\/p>\n As these compliance deadlines draw closer, there\u2019s a renewed sense of urgency around digital accessibility \u2014 and, consequently, the Web Content Accessibility Guidelines.\u00a0<\/span> Read also: <\/span><\/i>News alert: Businesses at risk of legal claims as EU accessibility deadline looms<\/span><\/i><\/a>.\u00a0<\/span><\/i> If you\u2019re not familiar with the European Accessibility Act, we\u2019ve written about it in more detail here: What is the European Accessibility Act and what does it mean for the design industry?<\/span><\/p>\n From a legal standpoint, anyone who is required to comply with the European Accessibility Act must ultimately comply with the Web Content Accessibility Guidelines. This includes:<\/span><\/p>\n For such organisations, aligning with the WCAG is the clearest and most effective route to EAA compliance, and failure to do so could result in fines, penalties, or being excluded from public procurement opportunities.\u00a0<\/span> But adhering to the Web Content Accessibility Guidelines isn\u2019t just a matter of legal compliance; it\u2019s a matter of responsibility.\u00a0<\/b> Regardless of whether or not you\u2019re impacted by the EAA, if you\u2019re creating any type of digital product, service, or content, you should care about accessibility.\u00a0<\/span> Why? Because accessible design is ultimately good design. When you prioritise accessibility, you\u2019re creating experiences that everyone can enjoy \u2014 and isn\u2019t that what we want for all products and services?\u00a0<\/span> If you <\/span>ignore <\/span><\/i>accessibility, you risk excluding people, creating a subpar user experience, and missing out on valuable customers. That\u2019s not great for your reputation \u2014 and it\u2019s certainly not great from a financial perspective.\u00a0<\/span> So, if you care about good business and good design, you need to care about accessible design, and complying with the Web Content Accessibility Guidelines is the best place to start.\u00a0<\/span> With that, let\u2019s explore the key principles that underpin the WCAG.<\/span><\/p>\n The Web Content Accessibility Guidelines are built on four main principles. According to these principles, all digital content must be:<\/span><\/p>\n 1. Perceivable:<\/strong> All information and user interface components (buttons, menus, forms, and so on) must be presented in ways that people can perceive or \u201ctake in\u201d \u2014 regardless of their sensory abilities. This means providing alternative text for images, captions for videos, and generally ensuring that content can be presented in different formats without losing its meaning.\u00a0<\/span><\/p>\n 2. Operable:<\/strong> Users should be able to navigate and interact with the product interface in a way that works for them. That might involve using a keyboard instead of a mouse, being able to pause moving content, or making buttons large enough that they can be tapped easily on a touchscreen without error.\u00a0<\/span><\/p>\n 3. Understandable: <\/strong>This principle is all about clarity and predictability. It includes things like using plain language and avoiding jargon, providing helpful instructions and feedback, and using consistent and intuitive layouts and navigation.\u00a0<\/span><\/p>\n 4. Robust:<\/strong> Digital content must perform reliably across a range of browsers, devices, and assistive technologies \u2014 not only right now, but also as tech evolves. This means using clean code and building digital products with flexibility in mind.\u00a0<\/span><\/p>\n Within these four principles, the Web Content Accessibility Guidelines can be translated into concrete design decisions that impact how people experience your product. That includes things like:<\/span><\/p>\n Those are just a few examples of what the WCAG might look like in practice. We\u2019ll share tools and resources to help you align with the WCAG in a later section \u2014 but before that, let\u2019s consider the various levels of compliance.\u00a0<\/span><\/p>\n The Website Content Accessibility Guidelines (WCAG) are organised into three levels of compliance: A, AA, and AAA.\u00a0<\/span> Note that these levels relate to WCAG 2.1, which is the version you\u2019ll need to comply with under the European Accessibility Act. However, the latest version is 2.2, which was released in 2023.\u00a0<\/span> Ok, so what do each of these compliance levels mean? Let\u2019s take a look:<\/span><\/p>\n Level A: <\/strong>This represents the minimum level of accessibility required for a website. It addresses the most basic barriers that would prevent someone from using a website or app, and it covers requirements such as providing alt text for images and enabling keyboard navigation.\u00a0<\/span> To reach Level A compliance with WCAG 2.1, you\u2019ll need to meet a total of 30 success criteria.<\/span><\/p>\n Level AA:<\/strong> Level AA builds on the previous level to cover a wider range of accessibility issues. It includes requirements such as colour contrast ratios, clear focus indicators, and meaningful headings and labels.\u00a0<\/span> Most organisations aim to meet at least level AA, and this is the required level for compliance with the European Accessibility Act.\u00a0<\/span> To comply at this level, you\u2019ll need to meet a total of 50 criteria.\u00a0<\/span><\/p>\n Level AAA:<\/strong> This is the most advanced level of compliance. It includes more rigorous standards, such as providing sign language interpretation for videos or allowing users to customise how text is displayed.\u00a0<\/span> To reach this level, you\u2019d need to fulfil a total of 78 criteria. And, while AAA conformance is encouraged, it\u2019s often not feasible to meet every AAA requirement across an entire site or product.<\/span> To be on the safe side, it\u2019s best to aim for AA level compliance. To help you do so, we\u2019ve put together a compliance checklist in the next section, followed by some useful tools and resources.\u00a0<\/span><\/p>\n Before we go into our checklist, bear in mind that full WCAG compliance can be complicated; you\u2019ll need to dive much deeper than the overview we\u2019re about to provide.\u00a0<\/span> Consider this checklist your starting point \u2014 your first step towards WCAG compliance and, ultimately, a better digital product or service:\u00a0<\/span><\/b><\/p>\n Text and visuals<\/b><\/p>\n Navigation and interaction<\/b><\/p>\n Content clarity<\/b><\/p>\n Mobile and device compatibility<\/b><\/p>\n And remember: this is just a starting point. If you\u2019re serious about creating accessible, inclusive products <\/span>and <\/span><\/i>staying compliant, the UX Design Institute\u2019s <\/span>Professional Certificate in Designing for Accessibility<\/span><\/a> covers everything you need to know \u2014 from conducting accessibility audits and more inclusive user research, through to advocating for accessibility and getting stakeholder buy-in.\u00a0<\/span><\/p>\n Once you\u2019re familiar with the Web Content Accessibility Guidelines and why they matter, it\u2019s time to put them into practice. Together with our compliance checklist (shared in the previous section), here are some additional tools and resources to help you get started.<\/span><\/p>\n Accessibility tools<\/strong><\/p>\n Guides and best practices<\/strong><\/p>\n Beyond tools and plugins, it\u2019s important to develop a solid understanding of industry best practices \u2014 both for accessible design and for good UX in general (the two often go hand-in-hand).\u00a0<\/span><\/p>\n Check out the following resources for more practical guidance on designing more accessible, inclusive products:<\/span><\/p>\n Formal training and skill development<\/strong><\/p>\n T<\/span>ools and resources are incredibly helpful, but accessibility really comes down to the mindset and skills behind your design decisions.\u00a0<\/span><\/p>\n If you want to build a solid understanding of accessible design \u2014 and learn how to put it into practice \u2014 consider the UX Design Institute\u2019s Professional Certificate in Designing for Accessibility. <\/span><\/p>\nWhat are the WCAG guidelines?<\/strong><\/h2>\n
Why are the WCAG guidelines more important than ever in 2025?<\/strong><\/h2>\n
\n
Who needs to comply with WCAG \u2014 and what happens if you don\u2019t?<\/strong><\/h2>\n
\n
The four key principles of WCAG (the POUR principles)<\/strong><\/h2>\n
\n
Understanding the three levels of WCAG compliance: A, AA, and AAA<\/strong><\/h2>\n
Your WCAG 2.1 compliance checklist for 2025<\/strong><\/h2>\n
\n
\n
\n
\n
Tools and resources to ensure WCAG compliance<\/strong><\/h2>\n
\n
\n
\n