Success Criterion 4.1.2
Conformance level A
W3C reference F59

Clickable Div Turned Into a Control but Given No ARIA Role

4.1.2 — Name, Role, Value

Scenario

Setting

A community forum's discussion thread

What’s wrong

A div or span is turned into a clickable control with script, but is never given a role — screen readers announce it as plain text, not a button/control.

Example

<div class="checkbox" onclick="toggle()"></div>

Why it matters

Screen-reader and voice-control users who can operate only what the accessibility tree exposes.

How to test

Inspect a scripted interactive control in DevTools: if it has no role attribute at all, screen readers announce it as plain text, not a control.

How to fix

Give the scripted control a proper role (or use a native button/link element).

<input type="checkbox" id="opt-1">

<label for="opt-1">Email notifications</label>

A native input exposes its role and checked state automatically; a styled div exposes none of that without a lot of manual ARIA.

Outcome

On a community forum's discussion thread, this barrier is gone for screen-reader and voice-control users who can operate only what the accessibility tree exposes — they reach the same outcome without extra effort.

Who is affected