WCAG 4.1.2: Name, Role, Value
Level AQuick answer: Custom UI components need correct accessible names, roles, and state values so assistive technologies can understand and operate them.
In the US, WCAG 2.2 Level AA is the de facto standard for ADA compliance. That is why this criterion matters for Shopify, WooCommerce, Magento, Wix, Squarespace, Webflow, BigCommerce, and custom storefronts selling to US consumers.
Why this criterion matters in US cases
US cases such as Target, Domino's, and other ecommerce complaints repeatedly show what happens when the purchase path depends on custom UI that is not announced correctly. WCAG 4.1.2 is central to those failures.
Common violations on US ecommerce sites
- Custom accordions and tabs are built from divs with click handlers only.
- Quantity steppers expose no current value to screen readers.
- Wishlist toggles do not announce pressed or selected state.
- Custom selects hide native semantics without replacing them.
How to fix it
- Use native elements first; add ARIA only when custom UI is unavoidable.
- Expose current state with aria-expanded, aria-selected, aria-pressed, and related attributes.
- Keep labels in sync with visible text and state changes.
- Audit every design-system widget before it is reused across storefront templates.
Start with the live customer journey, not design mocks. Audit homepage, collection, product, cart, account, and checkout-adjacent flows first because those pages create both legal risk and direct revenue loss.
Code example
<button aria-expanded="false" aria-controls="shipping-panel">Shipping details</button>
FAQ
What is WCAG 4.1.2?
Custom UI components need correct accessible names, roles, and state values so assistive technologies can understand and operate them.
Why does this matter for US ecommerce ADA compliance?
This criterion is frequently cited in US ADA lawsuits because custom accordions, tabs, selectors, and quantity steppers often look interactive while exposing no reliable name, role, or state to assistive tech.
What standard do US online stores use?
In the US, WCAG 2.2 Level AA is the de facto standard used to evaluate ADA compliance for ecommerce sites.
Check if your US store passes WCAG 4.1.2 → Free ADA Scan — Check Your US Store Now