4.1.2Name, Role, Value
For all UI components, the name and role must be programmatically determinable; states, properties, and values that can be set by the user must be programmatically settable; and notification of changes to these must be available to user agents.
Patterns that fail this criterion.
- 01Custom `<div role="button">` without aria-pressed for toggle state
- 02`<div onclick>` instead of `<button>` — missing native role
- 03Custom dropdown without aria-expanded
- 04Custom checkbox without aria-checked
Testing approach: automated.
axe-core checks aria attributes and roles for validity.
axe-core rules
aria-allowed-attraria-required-attraria-valid-attraria-valid-attr-valuebutton-namelink-nameRemediation steps.
- 1
Use native HTML first
<button>, <input type="checkbox">, <select> — these get name/role/value for free.
- 2
For custom components
Implement the WAI-ARIA Authoring Practices pattern. role + name + state attributes (aria-pressed, aria-expanded, aria-checked, etc.).
Find every violation in 42 seconds.
AccessProof runs axe-core 4.9.1 against your site and flags every WCAG criterion with the offending element selector. WCAG 4.1.2 is one of 49 criteria we check on every scan.
Often appears with…
All 50 WCAG 2.1 Level A + AA success criteria explained.
View the full checklist