Making accessibility standards easy to understand, one success criterion at a time.

theme: Code and Labels

Technical markup and naming conventions that help assistive tech understand the page.

WCAG 2.0, 2.1, 2.2 Level AA

3.1.2 Language of Parts

Any parts of the page that are in a different language to the page itself are marked up with the appropriate lang value. Names and phrases derived from other languages, like “Déjà vu” in English, don’t need this.

Code and Labels, Wording
Cognitive, Visual
Content
WCAG 2.0, 2.1, 2.2 Level A

3.2.2 On Input

Nothing unexpected happens when a form field value is selected, like picking an option from a dropdown menu.

Code and Labels, Forms, Keyboard
Cognitive
Code
WCAG 2.0, 2.1, 2.2 Level A

3.3.2 Labels or Instructions

Provide enough help to prevent form errors—sometimes the label is enough, but hint text or instructions might also be needed.

Code and Labels, Forms
Cognitive, Visual
Code
WCAG 2.0, 2.1 Level A

4.1.1 Parsing

The markup has been validated and there are no errors, such as duplicate ids, missing tags, and invalid child elements.

Code and Labels
Cognitive, Visual
Code
WCAG 2.0, 2.1, 2.2 Level A

4.1.2 Name, Role, Value

The semantic meaning of every interactive element (form controls, links, headings, landmarks, tables, and so on) is correct, and each has an accessible name.

Code and Labels, Forms, Keyboard
Cognitive, Physical/Motor, Visual
Code
WCAG 2.0, 2.1, 2.2 Level AA

4.1.3 Status Messages

Messages like form errors and success pop-ups are communicated to assistive technology like screen readers.

Code and Labels, Forms
Cognitive, Visual
Code