- Success Criterion 2.1.1
- Conformance level A
- W3C reference F42
Clickable Element Acting Like a Link With No Real Keyboard Role
2.1.1 — Keyboard
Scenario
Setting
An online marketplace's seller dashboard
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
<div onclick="submitForm()">Submit</div>Why it matters
Blind users, people with motor disabilities, and anyone operating the interface without a pointer.
How to test
Tab to a div/span styled as a link: check the Accessibility Tree in DevTools for role=link and confirm Enter activates it — missing either 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.
<button onclick="submitForm()">Submit</button>A native button is focusable and triggers on Enter/Space automatically; a div needs all of that added by hand.
Outcome
On an online marketplace's seller dashboard, this barrier is gone for blind users, people with motor disabilities — they can finish what they came here to do.
Who is affected
Blind users, people with motor disabilities, and anyone operating the interface without a pointer.
Learn more
- Understanding Understanding document (opens in a new tab)
- Technique Related technique (opens in a new tab)
Related scenarios
- Feature That Only Responds to Mouse Events, Not the Keyboard
- Element That Loses Focus the Instant It’s Reached by Keyboard
- Clickable Div With No Keyboard Focus or Key Handling at All
- Focusable Element That Enter and Space Don’t Actually Activate
- Custom Dropdown That Can’t Be Operated by Keyboard Arrows
- Drag-and-Drop Feature With No Keyboard Alternative