SVG-Grafiken ohne Textalternative

Meldung in axe und Lighthouse: <svg> Elemente mit einer img Rolle sollten einen Alternativtext besitzen. · svg-img-alt · WCAG 1.1.1

Was das bedeutet und warum es wichtig ist

SVG-Icons mit role="img" ohne Namen werden bedeutungslos angesagt (WCAG 1.1.1).

So beheben Sie es

<title> im SVG oder ein aria-label ergänzen; rein dekorative SVGs mit aria-hidden="true" ausblenden.

Code-Beispiel

Vorher

<svg role="img" viewBox="0 0 24 24"><path d="…"/></svg>

Nachher

<svg role="img" aria-labelledby="t1" viewBox="0 0 24 24"><title id="t1">Secure payment</title><path d="…"/></svg>

Alle Barrierefreiheits-Fehler