• Success Criterion 3.3.3
  • Conformance level AA

Error Suggestion Available Only as a Hover-Triggered Tooltip

3.3.3 — Error Suggestion

Scenario

Setting

A podcast app's episode list

What’s wrong

Error suggestions rendered only visually as tooltip on hover of an icon.

Example 

<input id="episode-num" value="0">
<span class="error-icon" title="Episode numbers start at 1">!</span>
<!-- the fix suggestion only appears in a title-attribute tooltip on mouse hover -->

Why it matters

A podcaster using a keyboard or screen reader can't trigger a mouse hover, so the only clue to the fix stays permanently invisible to them.

How to test

Trigger an error and check if the suggestion is available: if it's shown only as a hover tooltip on an icon (not reachable by keyboard or screen reader), it fails.

How to fix

Put the suggestion in text that's always present and announced, never gated behind mouse hover alone.

<input id="episode-num" value="0" aria-describedby="episode-error">
<p id="episode-error" role="alert">Episode numbers start at 1.</p>

Outcome

The podcaster reads the suggestion directly on screen and enters episode number 1 without needing a mouse.

Who is affected

Keyboard-only users, screen reader users, and touchscreen users, none of whom can trigger a hover-only tooltip.

Learn more

Related scenarios