Elemente mit role="img" ohne Textalternative

Meldung in axe und Lighthouse: [role='img'] Elemente haben ein Alternativtext. · role-img-alt · WCAG 1.1.1

Was das bedeutet und warum es wichtig ist

Hilfstechnik kann diese Grafiken nicht beschreiben (WCAG 1.1.1).

So beheben Sie es

aria-label oder aria-labelledby ergänzen bzw. die Rolle entfernen, wenn das Element dekorativ ist.

Code-Beispiel

Vorher

<div role="img" class="rating-stars"></div>

Nachher

<div role="img" class="rating-stars" aria-label="Rated 4 out of 5"></div>

Alle Barrierefreiheits-Fehler