POUR: the four principles every audit checks
What axe, Lighthouse, and WCAG actually test
WCAG 2.2 organizes accessibility into four principles. Every audit tool maps its checks to one of them:
- Perceivable — users can perceive the content. Includes alt text, captions, color contrast, focus visibility, text resize.
- Operable — users can operate the interface. Keyboard accessible, no keyboard traps, generous touch targets, no flashing >3×/sec.
- Understandable — users understand the content. Predictable navigation, clear errors, consistent labels.
- Robust — works with current AND future assistive tech. Valid HTML, proper ARIA, name/role/value on every interactive element.
Why memorize these four
When axe reports "color-contrast" violation, you'll know it's a Perceivable issue → check contrast ratios. When it says "no keyboard handler" → Operable. The category tells you what to fix, fast.
The one rule that beats them all
Use the right native element. A real <button> is keyboard-operable, focus-visible, screen-reader-announced, and high-contrast by default — passing all four principles for free. A <div> with click handlers fails all four until you ARIA-patch each one separately.
This module's structure
We'll spend lessons 2-11 on the most common violations you'll hit in practice (focus, contrast, motion, ARIA-live). Lesson 12 is a real before/after page: take a "looks fine" landing page and fix every a11y issue we plant in it.
Sign up to start coding
Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial — card required, cancel anytime.
Sign up — free trial →First 10 lessons in each track are free. No card needed for those.