Skip to content
Motif UI
Go Pro
Accessibility

A11y is a spec, not a vibe

'Accessible' is not a feeling about your interface. It is a list of testable statements. Read three success criteria against real components and the vibe evaporates.

Intermediate1 min read (computed · recorded 10)updated 2026-09-12wcaga11ytesting

by Motif Editors

revised 2026-09-12 — First publication in bank-3 batch 4.

Key takeaways
  • — Read three success criteria against real components and the vibe evaporates.
  • — The static pass is green and still blind to focus order and announcements.
  • — Named gaps are engineering; unnamed ones are vibes.

Pick the criteria, test the component

1.4.3 Contrast (Minimum): 4.5:1 for text. The catalog computes ratios per token pair and publishes the numbers — including the ring-versus-surface pairs, because a ring on a glass panel is text-adjacent contrast whether the spec calls it that or not.

2.4.7 Focus Visible: a keyboard user must always know where they are. The harness greps for outline:none without a replacement rule, because that is what the criterion looks like in code review.

4.1.3 Status Messages: toasts announce without taking focus. The live-region-demo scene exists to be listened to, not looked at.

What the static pass cannot see

This site's markup pass is green across hundreds of documents, and the docs say plainly what it cannot check: focus order with a real keyboard, announcement phrasing with a real reader, contrast on composed surfaces. Named gaps are engineering; unnamed ones are vibes.

/quality/aria — the engineer's record →/accessibility — the reader's statement →
Practise the lesson

Theory sticks when you ship it. These original Motif assets put this guide's lesson to work — open one and copy it into your own page.

Toast QueuepracticePricing Table — Three PlanspracticeSuccess-state Celebrationpractice
Keep learning
All guidesTry the interactive Lab