Loading…
Loading…
W3C guidelines providing testable criteria for making web content accessible to all users.
stellae.design
The Web Content Accessibility Guidelines (WCAG) 2.1, published by the W3C in June 2018, is the globally recognized standard for web accessibility. It builds on WCAG 2.0 by adding 17 new success criteria addressing mobile accessibility, low vision, and cognitive/learning disabilities. The four POUR principles — Perceivable, Operable, Understandable, and Robust — organize 78 testable success criteria across three conformance levels. Level A covers fundamental requirements (30 criteria), Level AA is the universally recommended target (20 additional criteria), and Level AAA provides enhanced accessibility (28 additional criteria). WCAG 2.1 AA is referenced by the EU's EN 301 549, US Section 508 (via DOJ), ADA case law, and accessibility laws in Canada, Australia, and many other countries.
WCAG 2.1, published as a W3C Recommendation in June 2018, extended the foundational WCAG 2.0 with 17 new success criteria addressing three critical gaps: mobile accessibility, low vision accessibility, and cognitive and learning disability accessibility — areas that WCAG 2.0, drafted primarily during the desktop-dominated era, did not adequately cover. WCAG 2.1 is the version most frequently referenced in legal requirements and procurement standards worldwide, including the European Accessibility Act, Section 508 refreshes, and countless national accessibility laws, making it the practical compliance baseline that organizations must meet regardless of whether they aspire to WCAG 2.2. Understanding WCAG 2.1 comprehensively is essential because it establishes the conformance model — the three levels (A, AA, AAA), the four principles (Perceivable, Operable, Understandable, Robust), and the testing methodology — that all subsequent WCAG versions build upon, so misunderstanding 2.1 means misunderstanding the entire framework.
A major news publication redesigns its article layout to satisfy WCAG 2.1 Reflow (1.4.10) and Text Spacing (1.4.12) criteria by using a single-column responsive layout that reflows completely at 400% zoom, removing fixed-width sidebars that previously caused horizontal scrolling, and ensuring that increased letter spacing, word spacing, and line height do not cause text to be clipped or overlapped. The development team builds automated visual regression tests that verify layout integrity at 400% zoom and with the text spacing overrides specified in the WCAG criterion, catching regressions before they reach production. These changes benefit not only the target audience of users with low vision but also mobile readers on small screens and users who increase default font sizes in their browser preferences.
A banking application adds appropriate autocomplete attributes to every form field that collects personal information — given-name, family-name, email, tel, street-address, postal-code, cc-number — satisfying criterion 1.3.5 and enabling browsers to auto-fill forms accurately, assistive technologies to present fields with recognizable icons, and cognitive accessibility tools to display personalized labels. The implementation requires auditing every form across the application and standardizing field naming conventions, which the team accomplishes by creating a shared form field component library with autocomplete attributes baked into the default configuration. Form completion rates increase measurably across all user demographics, with the largest improvement among mobile users and older adults who previously struggled with manual text entry.
A project management application implements an extensive set of single-character keyboard shortcuts — 'c' to create a task, 'd' to mark done, 'e' to edit, 's' to star — without providing any mechanism to disable or remap them, causing chaos for users who operate their computers via speech recognition software because the voice commands are interpreted as keyboard shortcuts that trigger unintended actions throughout the interface. A user dictating a task description finds that speaking the word 'delete' triggers the keyboard shortcut that deletes the task entirely, and speaking 'send' triggers a shortcut that sends an incomplete message to their team. The application violates criterion 2.1.4 Character Key Shortcuts and demonstrates why single-key shortcuts require user-controllable remapping or deactivation to be accessible.
• The most widespread mistake is treating WCAG 2.1 AA conformance as a checklist that can be satisfied through automated testing alone, when in reality automated tools catch only approximately 30-40% of WCAG 2.1 criteria and the remaining criteria — including reflow, content on hover, orientation, and text spacing — require manual testing with real assistive technologies and real users. Teams also commonly confuse WCAG 2.1 with WCAG 2.0, assuming they are interchangeable and missing the 17 new criteria entirely, which creates a false sense of compliance that is particularly dangerous when legal requirements specifically reference WCAG 2.1. Another frequent error is pursuing AAA conformance for individual criteria in isolation without understanding that AAA is not designed as a universal target — some AAA criteria conflict with each other for certain content types, and W3C explicitly states that AAA conformance is not achievable for entire sites, leading teams to waste resources pursuing an impossible standard rather than achieving robust AA compliance.
Was this article helpful?