This resource is designed for anyone eager to master digital accessibility. Explore WCAG success criteria through clear, easy-to-understand descriptions. We owe a special "hat tip" to Johannes Lehner’s WCAG Card Deck, which served as the inspiration for this project.
We plan to expand this library over time, so please check back regularly for updates.
20 success criteria found for Level A + AA and Perceivable principle and
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: CODE AND LABELS SENSORY WORDING
All images and other non-text content (like icons, charts, audio, CAPTCHAs, or controls) must have a descriptive text alternative that conveys their meaning. Purely decorative content can be hidden from assistive technologies (e.g. using an empty alt attribute).
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: SENSORY WORDING
Prerecorded audio-only content must have a text transcript. Prerecorded video-only content must have a text or audio description.
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: SENSORY WORDING
Prerecorded videos with audio must have synchronised captions that include:
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: SENSORY WORDING
Important visual content in prerecorded videos must be described using:
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: CODE AND LABELS WORDING
Visual information and relationships (like labels, headings, or groupings) must also be conveyed in the code using:
so that assistive technologies can understand the structure.
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: CODE AND LABELS WORDING
Content must follow a logical and meaningful order in the code so it can be understood correctly by assistive technologies even if the visual layout differs.
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: FORMS SENSORY WORDING
Instructions and descriptions must not rely on sensory features alone, like color, shape, size, visual location, or sound.
Always provide additional text to clarify meaning.
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: SENSORY
Colour must not be the only way to convey information.
Always provide an additional visual cue, like icon, text label, underline, shape, or pattern (e.g. striped, solid).
Level Level A, WCAG principle: Perceivable
Assigned to the following themes: SENSORY
If audio plays automatically for more than 3 seconds, it must be possible to:
without using system-wide controls.
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: SENSORY WORDING
Live video with audio must include real-time captions that cover:
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: SENSORY WORDING
Important visual content in prerecorded videos with audio must be described using:
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: GESTURES
Content must remain readable and usable in both portrait and landscape orientation, unless a specific one is essential (e.g. in a piano app that requires landscape to show the full keyboard).
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: FORMS
The purpose of common form fields (like name, email, or address) must be defined in the code so that browsers and assistive technologies can offer input support, such as autocomplete.
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: GESTURES ZOOM AND LEGIBILITY
Content remains functional and easy to read when:
without needing to scroll in two directions (except for tables, maps, and similar content).
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: SENSORY
Interactive controls (e.g. buttons, form fields, focus indicators) and graphics that convey meaning (e.g. icons, charts, graph lines) must have a contrast ratio of at least 3:1 against adjacent colours.
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: ZOOM AND LEGIBILITY
Text remains readable and usable when spacing is changed using custom styles to at least:
without content being hidden, cut off, or broken.
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: GESTURES KEYBOARD ZOOM AND LEGIBILITY
When additional content appears on hover or keyboard focus (including long press on touch), it must:
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: SENSORY ZOOM AND LEGIBILITY
Text contrast against its background must be at least:
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: ZOOM AND LEGIBILITY
Text remains readable and usable when zoomed to 200%.
Level Level AA, WCAG principle: Perceivable
Assigned to the following themes: SENSORY ZOOM AND LEGIBILITY
Text must be actual text, not images of text, unless a specific visual presentation is absolutely necessary (e.g. logo).