Über Bild-Alt-Attribute
Was ist Alt-Text?
Alt-Text ist eine schriftliche Beschreibung eines Bildes, die im Bild-Tag selbst enthalten ist. Er wird von Screenreadern anstelle des Bildes vorgelesen, angezeigt, wenn ein Bild nicht geladen werden kann, und von Suchmaschinen verwendet, um zu ermitteln, was ein Bild darstellt.
Es handelt sich um eine Beschreibung, nicht um eine Bildunterschrift. Eine Bildunterschrift liefert Kontext für Personen, die das Bild bereits sehen können; Alt-Text ersetzt das Bild vollständig für Personen, die es nicht sehen können. Dieser Unterschied bestimmt, wie er formuliert werden sollte: Die Frage ist nicht, wie das Bild aussieht, sondern was einem Leser ohne das Bild fehlen würde.
Es lohnt sich, einen Alt-Tag-Checker auszuführen, weil der Fehler unbemerkt bleibt. Nichts auf der Seite weist auf ein fehlendes Attribut hin, das Layout bleibt unverändert, und diejenigen, die es am ehesten bemerken, sind zugleich am wenigsten wahrscheinlich, dich darauf hinzuweisen.
Ist Alt-Text in 2026 noch relevant?
Ja, und zwar aus dem nachhaltigsten verfügbaren Grund: Barrierefreiheit. Alt-Text ist der Unterschied zwischen einer Seite, die mit einem Screenreader funktioniert, und einer Seite, die eine Reihe unerklärter Lücken darstellt. Außerdem werden Anforderungen an die Barrierefreiheit zunehmend durchgesetzt, statt lediglich veröffentlicht zu werden.
Außerdem ist Alt-Text nach wie vor die wichtigste Möglichkeit für die Bildersuche, ein Bild zu verstehen, und die Bildersuche bringt weiterhin relevanten Traffic auf Websites, die eigene visuelle Inhalte statt Stockfotos veröffentlichen.
Der praktische Anwendungsfall geht über die Einhaltung von Vorgaben hinaus. Bilder werden häufiger nicht geladen, als viele annehmen – etwa bei langsamen Verbindungen, in restriktiven Netzwerken und in E-Mail-Programmen. In solchen Fällen dient der Alternativtext als Ersatz.
Wie sich Alternativtext auf die KI-Suche auswirkt
Modelle interpretieren Bilder zunehmend direkt, doch dadurch ist Alternativtext nicht überflüssig geworden. Die maschinelle Interpretation teilt einem System mit, was auf einem Bild zu sehen ist; der Alternativtext erklärt ihm, warum sich das Bild auf dieser Seite befindet – und das ist etwas anderes und nützlicher.
Bei Diagrammen, Grafiken und Screenshots ist die Lücke noch größer. Sie enthalten häufig Informationen, die an keiner anderen Stelle im Seitentext vorkommen, und der Alternativtext ist der einzige Weg, über den diese Informationen überhaupt in eine Antwort gelangen.
Die wichtigste Vorgehensweise ist, im Alternativtext die Erkenntnis statt des Formats zu nennen. „Balkendiagramm“ sagt einem System nichts; „Der organische Traffic stieg nach der Migration um 40 Prozent“ kann hingegen zitiert werden.
Best Practices für Alternativtexte
- Beschreiben Sie, was das Bild zeigt und warum es vorhanden ist – und zwar in einem Satz statt als Liste von Schlüsselwörtern.
- Lassen Sie das Feld bei rein dekorativen Bildern leer, damit Screenreader sie überspringen, anstatt einen Dateinamen anzusagen.
- Geben Sie bei Diagrammen und Schaubildern die Erkenntnis an, nicht nur das Format.
- Beginnen Sie nicht mit „Bild von“ oder „Foto von“ – assistive Technologien geben dies bereits an.
- Wenn ein Bild relevanten Text enthält, wiederholen Sie diesen Text.
- Halten Sie den Text für diesen Verwendungszweck spezifisch. Dasselbe Foto kann auf verschiedenen Seiten unterschiedlichen Alternativtext erfordern.
Was dieses Tool prüft
Der Alt-Tag-Checker scannt die Bilder auf der Seite und meldet, ob bei einem Bild das Alt-Attribut fehlt.
Der Alt-Tag-Checker prüft nur, ob ein Alt-Text vorhanden ist. Daher besteht ein Bild mit wenig hilfreichem oder mit Keywords vollgestopftem Alt-Text die Prüfung genauso wie eines mit einer guten Beschreibung. „Bestanden“ bedeutet lediglich, dass jedes Bild irgendeinen Inhalt aufweist. Ob dieser Inhalt nützlich ist, sollten Sie selbst beurteilen – insbesondere bei Diagrammen und Screenshots.
Wie es weitergeht
Bilder beeinflussen mehr als nur die Barrierefreiheit. Prüfen Sie mit den Tools
Prüfung der Bildoptimierung und
Prüfung der Seitengröße, wie viel sie Sie kosten, und stellen Sie mithilfe der Prüfung
Header-Tag sicher, dass die umgebende Seite ausreichend strukturiert ist, damit ihr Kontext klar erkennbar ist.