HANS & FRIENDSAlt-Texte sind die kleinen Beschreibungen, die hinter jedem Bild stecken. Man sieht sie fast nie, und genau deshalb werden sie oft vergessen. Dabei kosten gute Alt-Texte nur ein paar Sekunden pro Bild und helfen gleich zweimal: Menschen, die deine Seite nicht sehen können, und Suchmaschinen.
Was ist ein Alt-Text?
Der Alt-Text („alternativer Text“) steht im HTML-Code im Attribut alt des Bildes. Er ersetzt das Bild, wenn es nicht gesehen werden kann: Screenreader lesen ihn blinden und sehbehinderten Menschen vor, und der Browser zeigt ihn an, wenn ein Bild nicht lädt.
Warum Alt-Texte wichtig sind
- Barrierefreiheit: Ohne Alt-Text erfährt ein Screenreader-Nutzer nicht, was auf dem Bild ist, oder bekommt im schlimmsten Fall den Dateinamen vorgelesen. Für viele Online-Shops ist Barrierefreiheit seit dem 28. Juni 2025 außerdem gesetzlich vorgeschrieben (Barrierefreiheitsstärkungsgesetz).
- Suchmaschinen: Google nutzt den Alt-Text, um zu verstehen, was ein Bild zeigt und wozu es auf der Seite gehört. Das hilft vor allem in der Bildersuche.
- Wenn Bilder fehlen: Lädt ein Bild nicht, etwa weil die Quelle offline ist, bleibt wenigstens die Beschreibung stehen.
Gute und schlechte Beispiele
| Bild | Schwach | Besser |
|---|---|---|
| Produktfoto | bild1.jpg | Rote Kaffeetasse aus Steingut mit weißem Rand |
| Teamfoto | Foto | Drei Kolleginnen beim Workshop am Whiteboard |
| Diagramm | Grafik Umsatz | Balkendiagramm: Umsatz 2025 gegenüber 2024 um 18 Prozent gestiegen |
| Logo als Link | Logo | Hans & Friends – zur Startseite |
| Importiertes Bild | Image from https://… | Blick vom Strand auf den Leuchtturm bei Sonnenuntergang |
Sechs Regeln für gute Alt-Texte
- Beschreibe, was wichtig ist. Nicht jedes Detail, sondern das, was das Bild an dieser Stelle aussagen soll.
- Kurz und konkret. Meist reicht ein Satz oder eine Wortgruppe. Als Faustregel gelten etwa 125 Zeichen.
- Kein „Bild von …“. Dass es ein Bild ist, sagt der Screenreader ohnehin.
- Keine Keyword-Listen. Ein Suchbegriff darf vorkommen, wenn er passt. Aufgezählte Keywords helfen niemandem und können sogar schaden.
- Text im Bild gehört in den Alt-Text. Steht auf einer Grafik Text, muss er auch im Alt-Text stehen.
- Links beschreiben das Ziel. Ist ein Bild verlinkt, sag, wohin der Link führt.
Dekorative Bilder: leerer Alt-Text
Rein schmückende Bilder, etwa Hintergrundmuster, Trennlinien oder ein Symbol neben einem Text, der dasselbe sagt, bekommen einen leeren Alt-Text (alt=""). Dann überspringt der Screenreader sie. Wichtig: leer ist nicht dasselbe wie fehlend. Fehlt das Attribut ganz, lesen manche Screenreader stattdessen den Dateinamen vor. Bei der Entscheidung hilft der Alt-Text-Entscheidungsbaum des W3C.
So pflegst du Alt-Texte in WordPress
- Beim Einfügen: Klick im Editor auf das Bild. In der Seitenleiste rechts findest du das Feld „Alternativer Text“.
- In der Mediathek: Unter Medien → Mediathek öffnest du ein Bild und trägst den Alt-Text dort ein. Er wird übernommen, wenn du das Bild danach neu einfügst.
Achtung, typischer Stolperstein: Änderst du den Alt-Text später in der Mediathek, ändert sich der Text in bereits veröffentlichten Beiträgen nicht. WordPress speichert den Alt-Text beim Einfügen direkt im Beitrag. Bestehende Beiträge musst du also im Editor selbst anpassen.
Nach einem Umzug oder Import genau hinschauen
Wer Bilder aus einem alten System übernimmt oder externe Bilder in die Mediathek importiert, bekommt oft Alt-Texte mit, die nichts beschreiben: Dateinamen wie IMG_4711, Platzhalter wie „Image from https://…“ oder gar nichts. Das fällt im Frontend nicht auf, deshalb lohnt sich nach jedem Umzug ein Durchgang durch die wichtigsten Seiten. Fang mit den Seiten an, die am meisten besucht werden.
Kurz-Checkliste
- Hat jedes inhaltlich wichtige Bild einen Alt-Text?
- Beschreibt er, was das Bild an dieser Stelle aussagt?
- Haben rein dekorative Bilder ein leeres
alt=""? - Steht Text aus Grafiken auch im Alt-Text?
- Sagen verlinkte Bilder, wohin sie führen?
- Sind nach einem Import keine Dateinamen oder Platzhalter übrig geblieben?
Häufige Fragen
Ist der Alt-Text dasselbe wie der Bildtitel?
Nein. Der Titel (title) erscheint bei manchen Browsern als Tooltip und wird von Screenreadern meist nicht zuverlässig vorgelesen. Für Barrierefreiheit und Suchmaschinen zählt der Alt-Text.
Und die Bildunterschrift?
Die Bildunterschrift sehen alle. Sie ergänzt das Bild, ersetzt aber nicht den Alt-Text. Wiederhole sie nicht wortgleich im Alt-Text, sonst hört ein Screenreader-Nutzer denselben Satz zweimal.
Kann eine KI Alt-Texte schreiben?
Als Vorschlag ja, und das spart Zeit. Prüf die Texte aber: Eine KI weiß nicht, warum du das Bild an genau dieser Stelle zeigst.
Quellen: W3C Web Accessibility Initiative: Images Tutorial, Google Search Central: Bilder-SEO.
