Alt-Texte, Labels und Buttons: kleine Fehler, große Barrieren
Viele Accessibility-Probleme sind im Code klein, für Nutzer aber erheblich. Ein Bild ohne Alternative, ein Checkoutfeld ohne Label oder ein Icon-Button ohne Namen kann Informationen oder Funktionen für Screenreader verbergen.
Alt-Texte brauchen einen Zweck
Alternativtext soll Funktion oder Bedeutung eines Bildes im Kontext vermitteln. Dekorative Bilder benötigen in der Regel ein leeres alt; Produktbilder können wichtige Informationen transportieren.
Automatisierung erkennt ein fehlendes alt-Attribut zuverlässig, kann die inhaltliche Qualität des Textes aber nicht immer bewerten.
- Relevante Bedeutung statt jedes Details beschreiben.
- alt="" für echte Dekoration nutzen.
- Dateinamen oder generische Texte vermeiden.
Labels und zugängliche Namen
Formularfelder und reine Icon-Buttons benötigen programmatisch erkennbare Namen.
Sichtbare Labels sind meist die robusteste Lösung. ARIA ist hilfreich, wenn natives HTML nicht ausreicht, sollte aber unklare Interfaces nicht kaschieren.
- Label korrekt mit Input verbinden.
- Icon-Buttons verständlich benennen.
- ARIA-Verweise auf existierende IDs prüfen.
FAQ
Ist jeder Alt-Text automatisch gut?
Nein. Er muss zur Funktion und zum Kontext des Bildes passen; das erfordert oft menschliche Bewertung.
Soll aria-label sichtbare Labels ersetzen?
In der Regel nicht. Sichtbare Labels sind robust und helfen auch sehenden Nutzern.
Offizielle Quellen: European Accessibility Act und W3C WCAG
W3C WCAG 2.2
Allgemeine Informationen, keine Rechtsberatung und keine formelle WCAG-Konformitätserklärung. Automatisierte Tests decken nicht alle Kriterien ab.
Technische Barrierefreiheitsrisiken zuerst sichtbar machen
Der kostenlose Quick Scan prüft bis zu 5 repräsentative Seiten. Der bezahlte Risk Report scannt im Hintergrund bis zu 1.000 öffentlich auffindbare Seiten und wird nach Abschluss automatisch per E-Mail versendet.