Was ein Alt-Text ist
Der Alt-Text ist der Inhalt des alt-Attributs im <img>-Element, die Textalternative zu einem Bild. Screenreader lesen ihn anstelle des Bildes vor, Browser zeigen ihn, wenn das Bild nicht lädt, und Suchmaschinen werten ihn aus. Umgangssprachlich heißt er oft Alt-Tag, obwohl er ein Attribut ist und kein eigenes Tag.
<img src="/img/braillezeile.webp" width="1332" height="749"
alt="Frau mit Kopfhörern liest an einer Braillezeile vor ihrem Laptop">Rechtlich und technisch ist das Attribut die Umsetzung des ersten und grundlegendsten Kriteriums der Web Content Accessibility Guidelines: WCAG 1.1.1 „Nicht-Text-Inhalt“, Konformitätsstufe A. Alle Nicht-Text-Inhalte brauchen, mit wenigen Ausnahmen, eine Textalternative, die denselben Zweck erfüllt. Gemeint ist der Zweck, nicht das Aussehen. Darin liegt der Unterschied zwischen einem brauchbaren und einem nutzlosen Alt-Text.
Was Google mit dem Alt-Text macht
In Googles Best Practices für Bilder ist das Alt-Attribut das wichtigste, wenn es darum geht, einem Bild zusätzliche Metadaten mitzugeben. Google nutzt den Alt-Text zusammen mit Computer-Vision-Algorithmen und dem Inhalt der Seite, um zu verstehen, was ein Bild zeigt. Der Alt-Text ist also ein Signal neben anderen, nicht die einzige Quelle: Die Bilderkennung sieht selbst, dass auf einem Foto ein Hund ist. Was sie nicht sieht, ist, warum das Bild an dieser Stelle steht.
Google zeigt in derselben Dokumentation die Abstufung selbst:
| Bewertung laut Google | Alt-Attribut |
|---|---|
| schlecht: fehlt | <img src="puppy.jpg"> |
| schlecht: Keyword-Stuffing | alt="puppy dog baby dog pup pups puppies …" |
| besser | alt="puppy" |
| am besten | alt="Dalmatian puppy playing fetch" |
Beispiele aus Google Search Central, Best Practices für Bilder.
Das Keyword-Stuffing nennt Google ausdrücklich: Es verschlechtert die Nutzererfahrung und kann dazu führen, dass eine Website als Spam eingestuft wird. Gute Alt-Texte enthalten Suchbegriffe dort, wo sie das Bild ohnehin beschreiben, und sonst nicht.
Bilder als Links
Ist ein Bild verlinkt, verwendet Google laut seinem Leitfaden zu Links den Alt-Text als Ankertext. Ein Logo, das zur Startseite führt, oder ein Produktfoto, das auf die Produktseite verlinkt, ohne Alt-Text ist ein Link ohne Beschriftung, für Google wie für Screenreader. Für die interne Verlinkung zählt dieser Alt-Text genauso wie jeder andere Linktext.
Erst die Funktion, dann der Text
Bevor ein Alt-Text geschrieben wird, steht eine Frage: Wozu ist das Bild hier? Die Web Accessibility Initiative des W3C hat dafür einen Entscheidungsbaum veröffentlicht. Zusammengefasst und mit Beispielen:
| Funktion des Bildes | Beispiel | Alt-Text |
|---|---|---|
| Informativ | Foto zeigt, wie ein Wärmepumpen-Außengerät aufgestellt ist | Kurze Beschreibung dessen, was das Bild hier vermittelt |
| Funktional (Link, Button) | Lupen-Symbol im Suchknopf, Logo mit Link zur Startseite | Ziel oder Aktion: „Suchen“, „Startseite“, nicht „Lupe“ |
| Bild mit Text | Banner „Winterschlussverkauf -30 %“ | Der Text aus dem Bild, wenn er nirgends sonst steht |
| Komplex | Balkendiagramm, Organigramm, Karte | Kurzer Alt-Text, die Daten ausführlich daneben im Text oder in einer Tabelle |
| Redundant | Produktfoto direkt neben dem verlinkten Produktnamen | Leer: alt="" |
| Dekorativ | Trennlinie, Hintergrundmuster, Stimmungsbild ohne Aussage | Leer: alt="" |
Nach dem Images Tutorial der W3C WAI.
Leer ist nicht dasselbe wie fehlend
Ein leeres Alt-Attribut (alt="") ist eine bewusste Aussage: Dieses Bild trägt keine Information, bitte überspringen. Fehlt das Attribut dagegen ganz, lesen manche Screenreader laut dem W3C-Tutorial zu dekorativen Bildern stattdessen den Dateinamen vor. Aus einem Zierelement wird dann „DSC 0 4 7 1 Punkt J P G“. Für dekorative Bilder gilt deshalb: Attribut setzen, Inhalt leer lassen, und auch kein title-Attribut.
Keine Bildbeschreibung, sondern die Aussage
Bei informativen Bildern vermittelt die Textalternative laut W3C die Bedeutung, und das ist in der Regel keine wörtliche Beschreibung des Bildes. Ein Foto eines Hundes mit Glöckchen am Halsband bekommt im Beispiel des W3C den Alt-Text „Hund mit einer Glocke am Halsband“, weil der Text daneben erklärt, warum Blindenführhunde in ihrer Freizeit Glocken tragen. Die Farbe des Fells oder der Hintergrund spielen dafür keine Rolle. „Bild von“ oder „Foto von“ am Anfang sind überflüssig, Screenreader kündigen ein Bild ohnehin als solches an.
Eine feste Zeichengrenze nennt weder Google noch das W3C. Die WAI beschreibt informative Bilder als etwas, das sich in einem kurzen Ausdruck oder Satz sagen lässt. Braucht ein Bild mehr, ist es ein komplexes Bild und gehört in den Text.
Ein Bild, drei Zusammenhänge, drei Alt-Texte
Wie stark der Alt-Text vom Umfeld abhängt, zeigt das Foto oben. Dasselbe Bild in drei verschiedenen Einsätzen:
| Wo das Bild steht | Was es dort leistet | Passender Alt-Text |
|---|---|---|
| Ratgeber über Hilfsmittel für blinde Menschen | Zeigt, wie eine Braillezeile benutzt wird | „Frau liest mit beiden Händen an einer Braillezeile, die vor der Laptop-Tastatur liegt“ |
| Bericht über einen Arbeitgeber, der barrierefreie Arbeitsplätze einrichtet | Zeigt einen solchen Arbeitsplatz | „Mitarbeiterin mit Sehbehinderung an ihrem Arbeitsplatz mit Braillezeile und Kopfhörern“ |
| Teaserbild, verlinkt auf einen Artikel mit der Überschrift direkt darunter | Nichts, was die verlinkte Überschrift nicht schon sagt | Leer (alt=""), die Überschrift trägt den Link |
Kein einziger dieser Alt-Texte ist für alle drei Stellen richtig. Deshalb funktioniert ein Alt-Text, der einmal pro Bild in der Mediathek hinterlegt wird, nur so lange, wie das Bild an genau einer Stelle steht.
Alt-Text, title und Bildunterschrift
| Element | Wer es wahrnimmt | Wofür |
|---|---|---|
alt | Screenreader, Suchmaschinen, alle bei nicht ladendem Bild | Ersatz für das Bild |
title | Mausnutzer als Tooltip beim Darüberfahren | Zusatzinfo, kein Ersatz für alt |
<figcaption> | Alle Besucher, sichtbar unter dem Bild; Google wertet Bildunterschriften aus | Einordnung, Quelle, Zusatzinformation |
<title> in Inline-SVG | Screenreader, Google | Gegenstück zum Alt-Text für eingebettete SVG-Grafiken |
Alt-Text und Bildunterschrift sollten sich ergänzen statt wiederholen. Die Unterschrift unter dem Foto oben ordnet ein, was eine Braillezeile ist. Der Alt-Text sagt, was zu sehen ist. Wer beides gleich formuliert, lässt Screenreader-Nutzer denselben Satz zweimal hören.
Bilder, die per CSS als Hintergrund eingebunden sind, indexiert Google laut seiner Bilder-Dokumentation nicht. Für reine Zierde ist das sogar der saubere Weg, inhaltliche Bilder gehören dagegen als <img> ins HTML. Wie Dateiname, Format und Größe zusammenspielen, steht im Überblick zur Bilder-SEO.
Was das Gesetz in Österreich verlangt
Für öffentliche Stellen des Bundes gilt seit 23. Juli 2019 das Web-Zugänglichkeits-Gesetz, für Länder und Gemeinden die jeweiligen Landesgesetze. Der technische Maßstab ist die europäische Norm EN 301 549, die laut der FFG als zuständiger Stelle auf den WCAG 2.1 in der Stufe AA aufbaut. Eine neue Fassung 4.1.1 der Norm ist im September 2026 erschienen und soll die bisherige voraussichtlich ab Ende 2026 rechtlich ablösen.
Neu für die Privatwirtschaft ist das Barrierefreiheitsgesetz (BaFG), das seit 28. Juni 2025 gilt. Es setzt den European Accessibility Act um und erfasst unter anderem Onlineshops, Bankdienstleistungen für Verbraucher und E-Ticketing im Personenverkehr. Laut Sozialministerium:
- Kleinstunternehmen, die Dienstleistungen anbieten, sind ganz ausgenommen. Das sind Unternehmen mit weniger als zehn Beschäftigten und höchstens 2 Millionen Euro Jahresumsatz oder Bilanzsumme.
- Kontrolliert wird durch die Marktüberwachung im Sozialministeriumservice, Landesstelle Oberösterreich.
- Geldstrafen können für Großunternehmen bis zu 80.000 Euro betragen, für KMU sind geringere Strafen vorgesehen.
Textalternativen für Bilder sind ein Kriterium der Stufe A und damit eine der grundlegendsten Anforderungen der WCAG und der EN 301 549. Ein Onlineshop mit 20 Beschäftigten, dessen Produktfotos keine oder nur Dateinamen als Alt-Text haben, verfehlt genau diese Grundanforderung. Für eine reine Informationswebsite eines Unternehmens gilt das BaFG in der Regel nicht, für die Nutzer macht das allerdings keinen Unterschied.
Alt-Texte im Alltag: CMS, KI und Prüfung
Im CMS
Die meisten Systeme bieten beim Hochladen ein Feld für den Alternativtext an. Was dort steht, wird beim Einfügen übernommen. Für Bilder, die nur einmal vorkommen, reicht das. Für Bilder, die mehrfach eingesetzt werden, etwa Teamfotos oder Produktbilder in Ratgebern, lohnt der Blick ins jeweilige Bild im Beitrag: Passt der Text zu dieser Stelle?
Mit KI-Werkzeugen
Bildbeschreibungen von KI-Modellen sind als Entwurf brauchbar. Sie sehen, was auf dem Bild ist, aber nicht, wozu es auf der Seite steht. Genau das verlangt das W3C für informative Bilder. Ein Werkzeug, das jedem Teaserbild eine Beschreibung gibt, macht aus einem redundanten Bild, das leer bleiben sollte, eine Wiederholung, die Screenreader-Nutzer ausbremst. Die Entscheidung nach Funktion bleibt Handarbeit.
Prüfen
Fehlende Alt-Attribute finden die Barrierefreiheitsprüfungen in den Chrome-Entwicklertools, die auch Google für Bilder empfiehlt, und jeder gängige SEO-Crawler. Was kein Werkzeug prüfen kann, ist die Qualität. Dafür hilft ein einfacher Test: Seite mit ausgeschalteten Bildern lesen, oder sich den Alt-Text am Telefon vorgelesen denken. Fehlt dann etwas zum Verständnis, fehlt es im Alt-Text.
Fragen zum Alt-Text
Wie lang darf ein Alt-Text sein?
Eine verbindliche Grenze gibt es nicht. Ein kurzer Ausdruck oder ein Satz reicht für fast alle informativen Bilder. Was mehr Platz braucht, etwa die Werte eines Diagramms, gehört in den sichtbaren Text oder eine Tabelle neben dem Bild.
Gehört das Keyword in den Alt-Text?
Nur, wenn es das Bild beschreibt. Google empfiehlt Alt-Texte, die Suchbegriffe passend und im Zusammenhang der Seite verwenden, und warnt ausdrücklich vor Keyword-Stuffing.
Braucht ein Logo einen Alt-Text?
Ja. Bildet das Logo allein einen Link zur Startseite, nennt der Alt-Text laut W3C das Ziel, also etwa „Muster GmbH Startseite“ und nicht „Logo“.
Muss jedes Bild einen Alt-Text haben?
Jedes Bild braucht ein Alt-Attribut. Ob es befüllt wird, hängt von der Funktion ab: informative und funktionale Bilder ja, dekorative und redundante nein, dort steht alt="".