Der Alt-Text ist der Text, der im HTML-Attribut alt eines Bildes steht. Besucher sehen ihn normalerweise nicht. Ein Screenreader liest ihn vor, der Browser zeigt ihn an, wenn ein Bild nicht lädt, und Suchmaschinen nutzen ihn, um ein Bild zu verstehen. Hier steht, wie du Alt-Texte schreibst, die beiden Zwecken dienen: Menschen, die das Bild nicht sehen, und der Bildersuche.
Wofür der Alt-Text da ist
Der wichtigste Zweck ist Barrierefreiheit. Wer blind ist oder schlecht sieht, nutzt oft einen Screenreader, der die Seite vorliest. Ohne Alt-Text erfährt diese Person nicht, was das Bild zeigt, und hört unter Umständen nur den Dateinamen [6]. Das W3C beschreibt in seinem Tutorial zu Bildern, dass ein Textersatz für ein informatives Bild die Information vermitteln soll, die das Bild zeigt. Das ist meist keine wörtliche Beschreibung [2].
Der zweite Zweck ist die Suche. Google empfiehlt hilfreiche, informative Alt-Texte, die den Inhalt des Bildes beschreiben und passende Keywords enthalten, die sich auf den Seiteninhalt beziehen [1]. Wer alt-Attribute mit Keywords überlädt, schadet nach Google der Nutzerfreundlichkeit und riskiert, dass die Website als Spam eingestuft wird [1].
Zuerst entscheiden: welche Art Bild
Bevor du schreibst, entscheidest du, welche Aufgabe das Bild auf der Seite hat. Der Entscheidungsbaum des W3C unterscheidet mehrere Fälle [3]. Ein informatives Bild, etwa ein Foto oder eine einfache Grafik mit Aussage, bekommt eine kurze Beschreibung dieser Aussage. Ein Bild, das als Link oder Schaltfläche dient, bekommt einen Alt-Text, der das Ziel des Links oder die Aktion nennt. Ein Bild mit Text bekommt diesen Text im Alt-Text, wenn er nicht ohnehin auf der Seite steht. Ein komplexes Bild wie ein Diagramm lässt sich im Alt-Text nicht vollständig beschreiben. Die Information gehört dann zusätzlich in den Text der Seite [3].
Rein dekorative Bilder bekommen ein leeres alt-Attribut, also alt="" [3]. Das gilt auch für Bilder, deren Inhalt schon im Text daneben steht. Ein leeres Attribut sagt dem Screenreader, dass er das Bild überspringen kann. Fehlt das Attribut ganz, lesen manche Screenreader stattdessen den Dateinamen vor [6].
Video zu deinem Thema? Jan macht das.
Schreib Jan, worum es gehen soll. Die Anfrage geht an 301@seo-manager.info, die Abstimmung läuft über SEO NW.
Wie ein guter Alt-Text klingt
Das W3C nennt für informative Bilder einen kurzen Ausdruck oder Satz als ausreichend [2]. Eine feste Zeichenzahl gibt es nicht. In unseren Projekten halten wir Alt-Texte meist bei einem Satz von acht bis zwanzig Wörtern. Das reicht, um das Wesentliche zu sagen, und bleibt beim Vorlesen erträglich.
Google zeigt in seiner Dokumentation ein Beispiel mit einem Welpen. Kein Alt-Text ist schlecht, eine lange Reihe von Hundewörtern mit "billiges Hundefutter" ist schlecht, "Welpe" ist besser, und am besten ist "Dalmatiner Welpe apportieren" [1]. Das zeigt das Prinzip: genau beschreiben, was zu sehen ist, ohne Keywords zu sammeln.
Ein paar Regeln aus unserer Arbeit:
- Beschreibe, was für den Leser an dieser Stelle wichtig ist. Ein Foto vom Team auf der Über-uns-Seite braucht andere Worte als dasselbe Foto in einem Artikel über Bürogestaltung.
- Lass "Bild von" und "Foto von" weg. Der Screenreader sagt ohnehin, dass ein Bild folgt.
- Nenne Personen nur mit Namen, wenn das auf der Seite bekannt ist und die Personen einverstanden sind.
- Schreibe in der Sprache der Seite und in ganzen Wörtern, ohne Abkürzungen, die beim Vorlesen holpern.
- Wiederhole nicht den Text der Bildunterschrift. Wenn die Unterschrift das Bild schon erklärt, ergänzt der Alt-Text, was sie nicht sagt.
Beispiele aus der Praxis
| Bild | Schwacher Alt-Text | Besserer Alt-Text |
|---|---|---|
| Produktfoto in einem Shop | Stuhl Stuhl kaufen günstig | Holzstuhl aus Eiche mit geflochtener Sitzfläche, von schräg vorne |
| Foto einer Baustelle im Ratgeber | Bild | Dachdecker legt Ziegel auf ein Satteldach mit neuer Lattung |
| Logo als Link zur Startseite | Logo | Startseite von Muster Bau |
| Schmucklinie zwischen Abschnitten | Trennlinie blau | leeres alt-Attribut |
Der Name "Muster Bau" steht hier stellvertretend für den Firmennamen. Beim Logo zählt die Funktion: Wer es anklickt, landet auf der Startseite, also sagt der Alt-Text genau das.
Alt-Text, Dateiname und Umgebung
Der Alt-Text arbeitet nicht allein. Google empfiehlt kurze, beschreibende Dateinamen wie my-new-black-kitten.jpg statt IMG00023.JPG [1]. Außerdem rät Google, Bilder in der Nähe von passendem Text zu platzieren, auf Seiten, die zum Motiv passen [1]. Ein gutes Bild mit gutem Alt-Text in einem Absatz über ein anderes Thema hilft wenig. Mehr zu Dateinamen findest du im Ratgeber Alt-Text und Dateiname auf unserer Hauptseite, eine Kurzerklärung im Glossar unter Alt-Attribut.
Barrierefreiheit kann auch Pflicht sein
Seit dem Barrierefreiheitsstärkungsgesetz gelten für bestimmte Angebote gesetzliche Anforderungen. Das Gesetz erfasst unter anderem Dienstleistungen im elektronischen Geschäftsverkehr, die nach dem 28.06.2025 für Verbraucher erbracht werden [4]. Für Kleinstunternehmen, die Dienstleistungen anbieten, gilt die Grundanforderung zur Barrierefreiheit nicht [5]. Ob und wie das Gesetz für deine Website gilt, hängt vom Angebot und der Größe des Unternehmens ab und sollte im Zweifel rechtlich geprüft werden. Alt-Texte gehören in jedem Fall zu den einfachsten Schritten zu einer barrierearmen Website.
Alt-Texte für viele Bilder pflegen
In Shops und großen Websites kommen schnell Hunderte Bilder zusammen. Hier hilft eine feste Reihenfolge: zuerst die Bilder, die Inhalt tragen, also Produktfotos und Bilder in Ratgebern, dann Bilder in Links und Schaltflächen, zuletzt der Rest. Viele Systeme wie WordPress, Joomla oder Shopware haben ein Feld für den Alt-Text in der Mediathek. Wer dort einmal sauber arbeitet, muss nicht in jedem Beitrag nacharbeiten.
KI-Werkzeuge können Vorschläge für Alt-Texte machen. Prüf diese Vorschläge trotzdem einzeln. Eine Maschine erkennt, was zu sehen ist, weiß aber nicht, warum das Bild auf deiner Seite steht. Genau das ist nach dem W3C der entscheidende Punkt [2].
Alt-Texte prüfen
Ob deine Alt-Texte funktionieren, merkst du am schnellsten, wenn du sie dir vorlesen lässt. Windows bringt mit der Sprachausgabe einen einfachen Screenreader mit, auf Apple-Geräten heißt er VoiceOver, und für Windows gibt es das kostenlose Programm NVDA. Hör dir eine Seite einmal ohne Blick auf den Bildschirm an. Du hörst sofort, wo ein Bild fehlt, wo der Dateiname vorgelesen wird und wo ein Alt-Text so lang ist, dass er stört.
Für eine schnelle Kontrolle vieler Seiten helfen die Entwicklerwerkzeuge im Browser oder ein Crawler, der alle Bilder ohne alt-Attribut auflistet. Leere Alt-Texte sind dabei kein Fehler, solange sie zu dekorativen Bildern gehören. Prüf deshalb die Liste von Hand, statt jedes leere Attribut automatisch zu füllen.
Wie du Bilder insgesamt für deine Website vorbereitest, steht im Ratgeber Bilder für Websites optimieren. Bei Videos übernehmen Untertitel und eine Beschreibung diese Aufgabe. Willst du ein Video mit Untertiteln und Beschreibung für deine Website? Frag bei Jan an, er übernimmt bei SEO NW die Videoproduktion.
- Organisation Best Practices für Bilder in der Google Suche. Google Search Central. Stand 04.03.2026. abgerufen am 30.10.2026
- Organisation Informative Images. W3C Web Accessibility Initiative. Stand 17.06.2019. abgerufen am 30.10.2026
- Organisation An alt Decision Tree. W3C Web Accessibility Initiative. Stand 13.05.2024. abgerufen am 30.10.2026
- Gesetz § 1 Barrierefreiheitsstärkungsgesetz (BFSG). Bundesministerium der Justiz, gesetze-im-internet.de. Stand aktuelle Fassung. abgerufen am 30.10.2026
- Gesetz § 3 Barrierefreiheitsstärkungsgesetz (BFSG). Bundesministerium der Justiz, gesetze-im-internet.de. Stand aktuelle Fassung. abgerufen am 31.10.2026
- Organisation Decorative Images. W3C Web Accessibility Initiative. Stand 27.07.2019. abgerufen am 31.10.2026
Häufige Fragen
Wie lang sollte ein Alt-Text sein?
Eine feste Länge gibt es nicht. Das W3C hält für informative Bilder einen kurzen Ausdruck oder Satz für ausreichend. Wir schreiben meist einen Satz mit acht bis zwanzig Wörtern.
Braucht jedes Bild einen Alt-Text?
Jedes Bild braucht ein alt-Attribut. Bei rein dekorativen Bildern bleibt es leer (alt=""), damit Screenreader das Bild überspringen.
Sollen Keywords in den Alt-Text?
Nur, wenn sie natürlich passen. Google warnt davor, alt-Attribute mit Keywords zu überladen, weil das der Nutzerfreundlichkeit schadet und als Spam gewertet werden kann.
Was schreibe ich bei einem verlinkten Logo?
Das Ziel des Links, zum Beispiel "Startseite von" und den Firmennamen. Der Screenreader liest den Alt-Text als Linktext vor.
Ist der Alt-Text dasselbe wie der Bildtitel?
Nein. Der Alt-Text ersetzt das Bild für Menschen, die es nicht sehen. Das title-Attribut erscheint als Hinweis beim Überfahren mit der Maus und ersetzt keinen Alt-Text.
Video anfragen bei Jan
Schreib Jan, worum es gehen soll. Die Anfrage geht an 301@seo-manager.info, die Abstimmung läuft über SEO NW.
Zuletzt geprüft am 03.11.2026, nächste Prüfung spätestens im November 2027. Fehler entdeckt? Schreib uns.
