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.
16 success criteria found for Code and labels theme
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: 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: Operable
Assigned to the following themes: CODE AND LABELS WHOLE SITE WORDING
Each page must have a unique and descriptive <title> that reflects its topic or purpose.
Level Level A, WCAG principle: Operable
Assigned to the following themes: CODE AND LABELS WORDING
The purpose of each link must be clear from:
Level Level A, WCAG principle: Operable
Assigned to the following themes: CODE AND LABELS FORMS
The visible text of a button, link, or form field must also be part of its accessible (programmatic) name.
Level Level A, WCAG principle: Understandable
Assigned to the following themes: CODE AND LABELS WORDING
Each page must have a <html lang=""> attribute that matches the main language of the page.
Level Level A, WCAG principle: Understandable
Assigned to the following themes: CODE AND LABELS FORMS KEYBOARD
No unexpected changes must happen when a field value changes (like auto-submit, reload, open new page).
Level Level A, WCAG principle: Understandable
Assigned to the following themes: CODE AND LABELS FORMS
Form fields must have clear labels or instructions to avoid confusion and help complete the input correctly.
Level Level A, WCAG principle: Robust
Assigned to the following themes: CODE AND LABELS
This used to require HTML with proper structure and no critical markup errors (like missing tags or duplicate IDs).
The requirement is removed but still helps with compatibility.
Level Level A, WCAG principle: Robust
Assigned to the following themes: CODE AND LABELS FORMS KEYBOARD
Interactive elements must have:
so that assistive technologies can interpret and interact with them correctly.
Level Level AA, WCAG principle: Operable
Assigned to the following themes: CODE AND LABELS WORDING
Headings must describe what follows.
Labels and buttons must clearly communicate what information is needed or what action will happen.
Level Level AA, WCAG principle: Understandable
Assigned to the following themes: CODE AND LABELS WORDING
Any parts of the content in a different language must be marked with the correct lang attribute.
Expressions borrowed from another language (like "déjà vu" in English) do not need this, unless pronunciation or understanding would be affected.
Level Level AA, WCAG principle: Robust
Assigned to the following themes: CODE AND LABELS FORMS
Status updates (like "form sent" or "5 items in cart") must:
Level Level AAA, WCAG principle: Operable
Assigned to the following themes: CODE AND LABELS
Related content must be organized into clear sections using headings.
Level Level AAA, WCAG principle: Operable
Assigned to the following themes: CODE AND LABELS WORDING
The purpose of each link must be clear: