Guide Subscribe to Guide RSS feed

Introduction “How hard can a signup form be?” If that thought has ever crossed your mind… you’ve probably never tested it for accessibility. Forms are the most important interface for user input on the web. Login, checkout, search, surveys — virtually every core web function goes through a form. Yet for countless people, these forms are a complete barrier. Screen reader users can’t tell what an input field is asking for Keyboard-only users get stuck in front of a date picker People with cognitive disabilities see an error message but have no idea how to fix it A web form with multiple input fields — easy to get lost in, just like people navigating a maze. Photo: Susan Q Yin / Unsplash In this post, we’ll go through form accessibility from top to bottom, based on WCAG 2.2. No dry theory — just practical code you can use right away, paired with a demo page I built for this post. ...

Introduction “We used red and green to distinguish them, so it should be fine.” It’s a thought that comes up naturally during development. But more people than you’d expect have difficulty telling those two colors apart. Statistics based on Northern European ancestry suggest that roughly 1 in 12 men and 1 in 200 women have red-green color vision deficiency. The exact ratio varies by region and genetic background, but the fact remains: there are always users who struggle to distinguish red from green. ...

Introduction This is the sixth post in the WCAG 3.0 series. This time I want to unpack what “beyond the web” actually means in practice. The earlier posts looked at structure, testing, and Assertions — now it’s time to get clear on “how far does the scope actually reach?” Important: This post is based on the WCAG 3.0 Working Draft (2026-02-20). The Draft is subject to change, and this post may be updated accordingly. ...

Introduction Have you ever tried using the internet without a mouse? Most people take their mouse for granted. But there are many people who can’t use one. People with physical disabilities who can’t operate a mouse People with repetitive strain injuries like carpal tunnel syndrome People with temporary arm injuries Power users who simply find keyboards more efficient For these users, the question “Can I use this site with just a keyboard?” is crucial. ...

Introduction In Atomic Tests vs. Holistic Tests: A New Testing Methodology, we discussed balancing Atomic and Holistic tests. Now we need to address how we’ll “assert” and “document” these results. This is where Assertions come in. The scoring and conformance model covered in WCAG 3.0 Conformance Model: Changes After A/AA/AAA also connects with Assertions. This is because they provide a way to supplement areas not covered by quantitative tests with organizational processes and evidence. ...

Introduction When people hear “accessibility testing,” they often think of a checklist: “Does this button have alternative text?” “Is the contrast ratio high enough?” WCAG 2.2 is built around clear pass/fail checks like these. WCAG 3.0 moves toward a broader unit of evaluation, aiming to consider overall user experience quality. That shift naturally changes how we test. We now combine fine-grained checks (Atomic) with real-world contextual evaluation (Holistic). This shift directly connects to the score-based conformance model discussed in WCAG 3.0 Conformance Model: Beyond A/AA/AAA. The weight you give each test type can change the score and the level you reach. ...

Introduction In the previous post, we looked at why WCAG 3.0 reorganized “Success Criteria” into “Outcomes.” This post focuses on changes to the conformance model. WCAG 3.0 aims for a different approach than WCAG 2.x, but it is still in the Editor’s Draft (2026-01-05) stage and is not finalized. Conformance levels, scoring approaches, and evaluation methods are still being explored. Important: This post is based on the WCAG 3.0 Editor’s Draft (2026-01-05). The draft can change at any time, and the document itself is explicitly marked as a work in progress. ...

Developers often make the same mistake after learning ARIA. They understand the concept, but they are unsure when and how to apply it in real projects. ARIA practical guide main visual with ARIA attributes highlighted in a code editor Cover image example: visual that symbolizes applying ARIA attributes · Generated by Nanobanana AI You may have heard the phrase: “ARIA is a last resort.” Use semantic HTML first, and add ARIA only when native HTML is not enough. This guide follows that principle and shows how to use ARIA effectively in real work. ...

Introduction “1.3.1 Info and Relationships - Level A” If you’ve worked with WCAG 2.2, you’re familiar with this format of Success Criteria. Numbers, levels, and clear test conditions. This structure has been the standard for web accessibility for over 15 years. However, as we explored in the previous article, this approach had limitations. “Websites that pass checkboxes but are actually unusable” are proof of this. WCAG 3.0 has completely redesigned the structure itself to address this issue. It didn’t just add items—it changed the way we evaluate accessibility. ...

Introduction “Our site passed WCAG 2.1 AA 100%, but screen reader users still can’t sign up.” I keep thinking about this comment I heard at a conference last year. They passed accessibility audits, got the green badge, but users with disabilities still couldn’t use core features. This is the biggest dilemma facing WCAG 2.x today. If you’re a developer or designer working on web accessibility, you’ve probably heard of WCAG (Web Content Accessibility Guidelines). Recently, a new guideline called WCAG 3.0 has emerged, and many people are wondering: ...