A: ARIA tooltip nodes must have an accessible name (WCAG 4.1.2)

• Meaning
• Impact
• Recommendation
• Examples

Ensure that every ARIA tooltip node has an accessible name.

This means

An element with role="tooltip" does not have a programmatically determinable name. Common causes: empty tooltip, icon only without text, missing aria-label or missing aria-labelledby.

Impact

Screen readers announce only "Tooltip" without content. Users do not understand help hints, make wrong decisions, and the page violates WCAG.

Recommendation

• Always fill the tooltip with meaningful text (visible text node).

• Alternatively, assign an accessible name via aria-label or aria-labelledby.

• Link the trigger with the tooltip via aria-describedby.

• Do not use title as a substitute.

Example

Problematic

<button aria-describedby="tip-a">Password</button>
<div id="tip-a" role="tooltip"></div> <!-- empty, no name -->

Better

<button aria-describedby="tip-b">Password</button>
<div id="tip-b" role="tooltip">At least 12 characters, letters and numbers.</div>

Alternative (with attribute)

<div role="tooltip" aria-label="At least 12 characters, letters and numbers."></div>

Related WCAG criterion:
WCAG 4.1.2 - Name, Role, Value