• Success Criterion 4.1.2
  • Conformance level A
  • W3C reference F42

Scripted Link or Button With No Real Role or Keyboard Support

4.1.2 — Name, Role, Value

Scenario

Setting

A language-learning app's lesson screen

What’s wrong

Something is made to act like a link or button using script only (a clickable div/span) — it isn't announced as a link/button and often can't be used by keyboard.

Example

A language-learning app's lesson screen runs into this exact issue: something is made to act like a link or button using script only (a clickable div/span) — it isn't announced as a link/button and often can't be used by keyboard.

Why it matters

Screen-reader and voice-control users who can operate only what the accessibility tree exposes. Here, on a language-learning app's lesson screen, the result is they are excluded from part of the experience.

How to test

Inspect a link/button emulated with a div/span: check the Accessibility Tree for the correct role and confirm keyboard operability — either missing fails.

How to fix

Use a real <a href> or <button> (or add the correct role, tabindex (keyboard-focus setting) and key handling) so it works as a link/button for everyone.

Outcome

After the fix, the same visitor to a language-learning app's lesson screen can now move past the barrier without workarounds.

Who is affected

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

Learn more

Related scenarios