Alternativtexte für Bilder richtig schreiben

Ein Screenreader kann ein Foto nicht sehen. Er liest vor, was im Code steht. Hier erfährst du, wie du Alternativtexte für Bilder richtig schreibst und wann ein Bild gar keinen braucht.

Zum Vergleich Prüfung für deine Website

Selbst vergleichen

Alternativtexte für Bilder: vorher und nachher

Vorher: Kein Alternativtext, vorgelesen wird der Dateiname Nachher: Kurzer Satz, der den Inhalt beschreibt

Hör im Kopf mit: Links liest der Screenreader den Dateinamen, rechts eine Beschreibung. Den Regler bedienst du mit der Maus, mit dem Finger oder mit den Pfeiltasten.

Warum es zählt

Warum Alternativtexte für Bilder unverzichtbar sind

Alternativtexte stehen im Attribut alt eines Bildes und werden von Screenreadern vorgelesen, wenn eine blinde oder stark sehbehinderte Person die Seite besucht. Fehlt der Text, liest das Programm oft den Dateinamen vor, also etwa DSC_0042 Punkt JPG. Wer so etwas hört, weiß nicht, ob das Bild wichtig war oder nur Dekoration.

Auch Suchmaschinen werten Alternativtexte aus, weil sie Bilder selbst nur begrenzt verstehen. Ein guter Alternativtext hilft also doppelt. Er macht deine Seite für Menschen mit Screenreader verständlich, und er sagt Google und Co., was auf dem Bild zu sehen ist. Laut der Auswertung WebAIM Million 2025 fehlten auf mehr als der Hälfte der meistbesuchten Startseiten solche Texte.

Gute Alternativtexte zu schreiben ist keine Technik, sondern eine Frage der Sprache. Du beschreibst, was das Bild an dieser Stelle aussagt, kurz und konkret. Ein Foto im Team-Bereich braucht eine andere Beschreibung als dasselbe Foto in einer Stellenanzeige. Entscheidend ist immer der Zusammenhang, in dem das Bild steht.

WCAG 2.2

Was die WCAG hier verlangen

1.1.1 Stufe A

Nicht-Text-Inhalt

Jedes Bild, das Informationen trägt, hat eine Textalternative mit demselben Zweck. Dekorative Bilder werden mit leerem alt-Attribut ausgeblendet.
1.4.5 Stufe AA

Bilder von Text

Text gehört nicht in Bilder, wenn er auch als echter Text gesetzt werden kann. Ausnahmen sind Logos.
2.4.4 Stufe A

Linkzweck im Kontext

Ist ein Bild verlinkt, beschreibt der Alternativtext das Ziel des Links, nicht das Aussehen des Bildes.
4.1.2 Stufe A

Name, Rolle, Wert

Symbole auf Knöpfen, etwa eine Lupe für die Suche, brauchen einen zugänglichen Namen wie „Suchen“.

Lösung

So schreibst du Alternativtexte, die wirklich helfen

Sag, was zählt

Beschreibe in einem Satz, was das Bild an dieser Stelle zeigen soll. Bei einem Produktfoto sind Farbe und Form wichtig, bei einem Teamfoto die Personen und die Situation.
Lass „Bild von“ weg

Der Screenreader sagt ohnehin, dass ein Bild folgt. Beginne direkt mit dem Inhalt, also „Gesellin setzt Fliesen“ statt „Bild von einer Gesellin, die Fliesen setzt“.
Dekoration ausblenden

Schmuckbilder, Muster und Symbole neben einem Text, der dasselbe sagt, bekommen ein leeres alt-Attribut. So überspringt der Screenreader sie, statt sinnlose Wörter vorzulesen.
Grafiken ausführlich beschreiben

Diagramme und Infografiken brauchen mehr als einen kurzen Satz. Fasse die Kernaussage im Alternativtext zusammen und stelle die Zahlen zusätzlich als Text oder Tabelle daneben.

Vorher

<img src="dsc_0042.jpg">

Nachher

<img src="fliesen-bad.jpg"
  alt="Gesellin setzt Fliesen
  im Bad einer Kundin">

Ohne alt-Attribut liest der Screenreader den Dateinamen. Mit einer kurzen Beschreibung versteht jeder, was zu sehen ist.

Fragen

Fragen zu Alternativtexte für Bilder

Wie lang darf ein Alternativtext sein?

So kurz wie möglich, so lang wie nötig. Für die meisten Fotos reichen ein oder zwei Sätze mit höchstens etwa 150 Zeichen. Komplexe Grafiken beschreibst du zusätzlich im Text.

Braucht jedes Bild einen Alternativtext?

Jedes Bild braucht ein alt-Attribut, aber nicht jedes einen Text. Rein dekorative Bilder bekommen ein leeres Attribut, damit Screenreader sie überspringen.

Kann KI Alternativtexte schreiben?

Als Entwurf ja, als Ergebnis nein. Eine KI beschreibt, was sie sieht, kennt aber den Zweck des Bildes auf deiner Seite nicht. Lies jeden Vorschlag und passe ihn an den Zusammenhang an.

Weitere Ratgeber zur Barrierefreiheit

Wie steht deine Website da?

Wir prüfen deine Seite auf diese und alle anderen Barrieren und schicken dir einen Bericht, der sagt, was zuerst dran ist.

Anfrage für eine Prüfung senden Zum Schnelltest

Alternativ­texte für Bilder richtig schreiben