ABOUT THIS SITE

About
Design for Access

A free reference site that teaches accessibility and Universal Design for Learning through direct experience — not just description.

01 · MISSION

Most accessibility resources describe barriers. This site lets you experience them.

Every interactive page contains toggles that apply real accessibility failures to the content you are reading — not to a toy demo, but to the actual text and interface in front of you. When a barrier is active, a panel appears showing the WCAG criterion violated, the impact on real users, and the code change that fixes it.

The goal is to build visceral understanding. Reading that 4.2:1 contrast is a WCAG failure is informative. Trying to read body text rendered at 4.2:1 while experiencing low vision is something you remember.

02 · AUDIENCE

This site is built for instructional designers, learning experience designers, and L&D professionals who create digital content — courses, job aids, documentation, presentations — and want to build it accessibly without needing a background in web development.

It is also useful for developers, UX designers, and product managers working in learning technology who want a practical, experience-first introduction to WCAG and UDL.

03 · THE LIVING EXAMPLE

Design for Access is itself the example it teaches. The site is built to WCAG AAA standards — the highest conformance level — with Atkinson Hyperlegible Next as the body typeface (designed by the Braille Institute specifically for low-vision readers), an 18px base font, 44×44px minimum touch targets, full keyboard navigation, and a focus indicator system you can toggle on.

The design system avoids patterns that commonly fail in practice: no cards with invisible borders, no placeholder-only labels, no hover-only interactions, no motion without a reduced-motion path. The blueprint grid background and dark navy theme are not aesthetic choices made at the expense of accessibility — every color pairing is verified against WCAG AAA contrast ratios before it is used.

The WCAG Checklist in Resources covers every criterion applied during the build of this site.

04 · UNIVERSAL DESIGN FOR LEARNING

WCAG focuses on technical conformance — the measurable, binary criteria that determine whether a digital interface is accessible. UDL operates at a different level: it is a curriculum framework for designing learning experiences that reduce barriers to engagement, representation, and action from the start.

Both belong in the instructional designer's toolkit. A course can pass every WCAG criterion and still fail learners with cognitive disabilities if its structure is disorganized, its objectives are unmeasurable, or its only representation of key concepts is a 40-minute talking-head video. The UDL Framework section covers the three principles — Engagement, Representation, Action & Expression — and how to apply them in practice.

05 · PART OF INSTRUCTIONALAI.ORG

Design for Access is one of four free reference sites in the instructionalai.org ecosystem — a collection of practical tools and references for instructional designers and L&D professionals.

ADDIE GuideA step-by-step reference for the ADDIE instructional design model.Design the PromptHow to write effective AI prompts for instructional design work.Learning Science LabsEvidence-based learning principles applied to instructional practice.
FREE. NO ACCOUNT. NO TRACKING.

This site is free to use with no account required. Your accessibility preferences (contrast, text size, motion, focus) are stored only in your browser's localStorage and never leave your device. The only data collected is anonymous, aggregate page-view counts via Vercel Analytics — no cookies, no personal data. Privacy policy →