Wofür der Alt-Text da ist
Der Alternativtext (das alt-Attribut eines Bildes) beschreibt ein Bild in Worten und erfüllt gleich drei Aufgaben:
- Für blinde und sehbehinderte Menschen: Der Screenreader liest ihn vor — er ist ihr einziger Zugang zum Bildinhalt.
- Wenn das Bild nicht lädt: Der alt-Text erscheint an seiner Stelle.
- Für Suchmaschinen: Sie können Bilder nicht sehen und verstehen den Inhalt über den alt-Text — die Grundlage der Bildersuche.
Ein Bild ohne alt-Text ist für all diese Fälle schlicht ein Loch. Der gute alt-Text dient Barrierefreiheit und Auffindbarkeit in einem Aufwasch.
Die Grundregel: Inhalt und Zweck, kurz
Ein guter alt-Text beantwortet: Was zeigt das Bild, und warum steht es hier? Meist reicht ein Satz. Beispiele:
| Schlecht | Gut |
|---|---|
| „Bild" | „Ein Kind pflanzt einen Setzling in einen Blumentopf." |
| „DSC_4821.jpg" | „Rote Gartenbank vor einer weißen Backsteinwand." |
| „Foto von unserem Team beim Meeting …" | „Vier Personen besprechen an einem Tisch einen Bauplan." |
Die häufigsten Fehler
- „Bild von …" / „Foto von …": Der Screenreader kündigt bereits „Bild" an. Schreib direkt den Inhalt, sonst hört der Nutzer „Bild, Bild von …".
- Der Dateiname als alt-Text:
IMG_4821.jpghilft niemandem. Sprechende Dateinamen sind gut (siehe Bilder umbenennen), ersetzen aber keinen alt-Text. - Keyword-Stuffing: „Bild komprimieren Tool kostenlos online Bild verkleinern JPG PNG" ist weder für Menschen noch für Suchmaschinen gut — moderne Suchmaschinen erkennen das und werten es ab.
- Zu viel Detail: Ein alt-Text ist kein Bildinventar. „Was zählt für den Zweck?" ist die Leitfrage, nicht „Was ist alles im Bild?".
Der Kontext entscheidet
Dasselbe Bild braucht je nach Verwendung einen anderen alt-Text. Ein Foto eines Laufschuhs:
- Im Online-Shop: „Blauer Laufschuh Modell XY, Seitenansicht." (die Kaufinformation)
- In einem Artikel über Verletzungsprävention: „Laufschuh mit gedämpfter Sohle." (der relevante Aspekt)
Es gibt also nicht den einen richtigen alt-Text — es gibt den richtigen für diesen Zweck an dieser Stelle.
Wann der alt-Text leer bleibt
Wichtig und oft übersehen: Rein dekorative Bilder (Trennlinien, Hintergrund-Ornamente, ein Icon neben einem beschrifteten Link) sollten einen leeren alt-Text bekommen (alt=""), damit der Screenreader sie überspringt. Ein alt-Text, der nichts hinzufügt, ist Lärm. Wann leer und wann beschreiben — das ist ein Thema für sich und steht im Beitrag Dekorative Bilder und der leere alt-Text.
Komplexe Bilder brauchen mehr
Ein Diagramm, eine Infografik oder eine Karte lässt sich nicht in einem Satz fassen. Hier gehört eine kurze alt-Zusammenfassung ins Bild und die ausführliche Beschreibung in den umgebenden Text oder eine verlinkte Langbeschreibung. Wie das geht, behandelt der Beitrag Infografiken barrierefrei machen.
Häufige Fragen
Was ist ein Alt-Text?
Der Alternativtext (alt-Attribut) beschreibt ein Bild in Worten. Screenreader lesen ihn blinden und sehbehinderten Menschen vor, er erscheint, wenn ein Bild nicht lädt, und Suchmaschinen nutzen ihn, um den Bildinhalt zu verstehen. Ein Bild ohne alt-Text ist für diese Nutzer schlicht nicht vorhanden.
Wie lang sollte ein Alt-Text sein?
So kurz wie möglich, so lang wie nötig — meist ein Satz, selten mehr. Er soll den Inhalt und Zweck des Bildes erfassen, nicht jedes Detail. Screenreader-Nutzer wollen die Information, nicht einen Roman. Sehr komplexe Bilder wie Diagramme brauchen eine längere Beschreibung an anderer Stelle.
Soll ich 'Bild von' oder 'Foto von' in den Alt-Text schreiben?
Nein. Der Screenreader kündigt bereits an, dass es ein Bild ist. 'Bild von einem Hund' wird dann zu 'Bild, Bild von einem Hund'. Schreibe direkt den Inhalt: 'Ein brauner Labrador, der einen Ball apportiert.'
Hilft der Alt-Text auch für SEO?
Ja. Suchmaschinen können Bilder nicht sehen und verlassen sich stark auf den alt-Text, um den Inhalt zu verstehen — das ist die Grundlage für die Bildersuche. Ein guter, beschreibender alt-Text dient Barrierefreiheit und Auffindbarkeit zugleich; er sollte aber natürlich formuliert und nicht mit Keywords vollgestopft sein.
Der alt-Text ist ein Baustein von vielen. Der Gesamtüberblick zu barrierefreien Bildern steht im Beitrag Bilder-Barrierefreiheit nach WCAG.