Alt-Attribut
Was ist ein Alt-Attribut?
Das Alt-Attribut ist ein HTML-Attribut für Bilder, das einen alternativen Text bereitstellt. Dieser Alternativtext beschreibt Inhalt oder Funktion eines Bildes für Screenreader, Suchmaschinen und den Fall, dass die Bilddatei nicht geladen wird. Dekorative Bilder erhalten ein bewusst leeres Alt-Attribut.
Was bedeutet das Alt-Attribut?
Das Alt-Attribut gehört zum HTML-Element <img> und enthält eine textliche Alternative für ein Bild. Häufig verwendete Bezeichnungen sind Alt-Text, Alternativtext und Alt-Beschreibung. Der verbreitete Ausdruck „Alt-Tag“ ist technisch ungenau, weil es sich um ein Attribut innerhalb eines HTML-Tags handelt.
Ein typisches Bild mit Alternativtext wird im HTML-Code so ausgezeichnet: <img src="rote-laufschuhe.jpg" alt="Rote Laufschuhe mit weißer Sohle">. Der Wert zwischen den Anführungszeichen beschreibt die visuell vermittelte Information so knapp wie möglich und so ausführlich wie nötig.
Das Alt-Attribut erfüllt mehrere Aufgaben. Screenreader lesen den hinterlegten Text vor, Suchmaschinen erhalten Informationen über Bildinhalt und Seitenkontext, und Browser können den Alternativtext anzeigen, wenn die Bilddatei nicht verfügbar ist. Damit verbindet das Attribut Barrierefreiheit, technische Qualität und Bilder-SEO.
Wie schreibt man einen guten Alt-Text?
Ein guter Alt-Text beschreibt die Bedeutung des Bildes im jeweiligen Seitenkontext. Dieselbe Bilddatei kann deshalb auf zwei Seiten unterschiedliche Alternativtexte benötigen. Ein Foto eines Akkuschraubers verlangt auf einer Produktseite beispielsweise eine konkrete Produktbeschreibung, während es in einer Montageanleitung die dargestellte Handlung beschreiben sollte.
Für die Länge eines Alternativtextes existiert keine allgemeingültige Zeichengrenze. Der Text sollte vollständig verständlich bleiben, ohne Details aufzuzählen, die für den Zweck der Seite keine Bedeutung haben. Komplexe Diagramme benötigen meist eine kurze Alt-Beschreibung und eine zusätzliche ausführliche Erläuterung im sichtbaren Seiteninhalt.
Wann muss das Alt-Attribut leer bleiben?
Ein leeres Alt-Attribut ist bei rein dekorativen Bildern korrekt. Die Schreibweise alt="" signalisiert unterstützenden Technologien, dass das Bild keine eigenständige Information vermittelt und übersprungen werden kann. Typische Beispiele sind Schmuckgrafiken, dekorative Trennlinien oder Hintergrundelemente ohne inhaltliche Funktion.
Ein leeres Alt-Attribut darf nicht mit einem fehlenden Attribut verwechselt werden. Fehlt alt vollständig, können Screenreader je nach Software den Dateinamen oder die Bild-URL vorlesen. Ein vorhandenes alt="" kennzeichnet das Bild dagegen bewusst als dekorativ.
Welche Alt-Beschreibung brauchen funktionale Bilder?
Bei funktionalen Bildern beschreibt der Alternativtext die ausgelöste Aktion oder das Linkziel. Dient ein Lupensymbol als Schaltfläche für die Suche, ist alt="Suche öffnen" verständlicher als alt="Lupe". Die Funktion ist in diesem Fall wichtiger als das sichtbare Motiv.
Bei verlinkten Bildern übernimmt der Alternativtext eine ähnliche Aufgabe wie ein sichtbarer Linktext. Er sollte deshalb das Ziel des Links benennen und nicht lediglich das Bildmotiv wiedergeben.
Welche Bedeutung hat der Alternativtext für SEO?
Suchmaschinen können Bilddateien technisch verarbeiten, benötigen für eine eindeutige Einordnung jedoch zusätzliche Signale. Ein präzises Alt-Attribut liefert Informationen über Motiv, Funktion und thematischen Zusammenhang. Auch Dateiname, sichtbarer Text, Bildunterschrift und die Qualität der Zielseite beeinflussen, für welche Suchanfragen ein Bild eingeordnet wird.
Ein relevanter Suchbegriff darf im Alternativtext vorkommen, wenn er das Bild sachlich beschreibt. Das mehrfache Einfügen von Money-Keywords ohne inhaltlichen Nutzen ist Keyword-Stuffing und verschlechtert die Verständlichkeit. Die Beschreibung des tatsächlichen Bildinhalts hat daher Vorrang vor einer bestimmten Keyword-Dichte.
Optimierte Bildbeschreibungen können die Auffindbarkeit in der Bildersuche unterstützen und Suchmaschinen zusätzlichen Kontext zur umgebenden Seite liefern. Ein Alt-Text ersetzt jedoch weder hochwertigen Seiteninhalt noch eine technisch saubere Einbindung der Bilder. Weitere Grundlagen zur technischen Prüfung findest du im SEO-Audit für Websites und auf der Leistungsseite zur Onpage-Optimierung.
Unterschied zwischen Alt-Attribut und Title-Attribut
| Merkmal | Alt-Attribut | Title-Attribut |
|---|---|---|
| Hauptzweck | Textliche Alternative zum Bild | Optionale Zusatzinformation |
| Screenreader | Wird zur Beschreibung des Bildes genutzt | Wird je nach Software uneinheitlich behandelt |
| Anzeige im Browser | Kann bei nicht geladenen Bildern erscheinen | Kann als Hinweis beim Überfahren mit der Maus erscheinen |
| SEO-Bedeutung | Liefert Suchmaschinen Bild- und Kontextinformationen | Besitzt für Bilder-SEO nur begrenzten Nutzen |
| Erforderlichkeit | Sollte bei jedem <img>-Element vorhanden sein | Ist optional |
Das Title-Attribut ist kein Ersatz für einen Alternativtext. Es kann zusätzliche Informationen enthalten, ist aber auf Touch-Geräten häufig nicht abrufbar und wird von Screenreadern nicht einheitlich ausgegeben. Für die zugängliche Beschreibung eines Bildes ist deshalb das Alt-Attribut maßgeblich.
Alt-Texte in SEO, SEA und GEO
Im SEO unterstützt der Alternativtext die thematische Einordnung von Bildern und kann zur Sichtbarkeit in der Bildersuche beitragen. Bei SEA-Landingpages verbessert er die Zugänglichkeit bildbasierter Produkt- und Handlungselemente. Das kann Nutzern helfen, den Inhalt und die Funktion einer Zielseite unabhängig von der visuellen Darstellung zu verstehen.
Für GEO, die Generative Engine Optimization, sind klare Alt-Texte ein ergänzendes semantisches Signal. KI-Systeme können Bildinformationen aus verschiedenen Seitenelementen ableiten, darunter Alternativtexte, Bildunterschriften und Fließtext. Ein Alt-Text garantiert keine Nennung in ChatGPT, Perplexity oder Gemini, erhöht aber die maschinenlesbare Vollständigkeit des Inhalts.
Wie lassen sich fehlerhafte Alt-Attribute prüfen?
Eine manuelle Kontrolle ist bei einzelnen Seiten über den HTML-Quellcode oder die Entwicklerwerkzeuge des Browsers möglich. Bei umfangreichen Websites sollte ein Crawler zwischen fehlenden, leeren und ausgefüllten Attributen unterscheiden. Die Bewertung bleibt teilweise redaktionell, weil ein Werkzeug nicht immer erkennen kann, ob ein leeres Attribut für ein dekoratives Bild korrekt ist.
Regelmäßige technische Audits helfen, neue Fehler nach Änderungen am CMS, nach Produktimporten oder bei redaktionellen Uploads frühzeitig zu erkennen. Prüfe deine Website mit dem kostenlosen Analysewerkzeug auf technische Auffälligkeiten und fehlende Metadaten:
Häufige Fragen zum Alt-Attribut
Brauchen CSS-Hintergrundbilder einen Alt-Text?
Nein. CSS-Hintergrundbilder besitzen kein Alt-Attribut. Inhaltlich relevante Informationen sollten deshalb nicht ausschließlich als Hintergrundbild eingebunden werden, sondern zusätzlich als zugänglicher Text oder reguläres Bild verfügbar sein.
Soll im Alt-Text das Wort Bild stehen?
Meist ist das Wort Bild überflüssig, weil Screenreader das Element bereits als Grafik erkennen. Es kann sinnvoll sein, die Darstellungsart zu nennen, wenn sie für das Verständnis relevant ist, etwa bei einem Diagramm, Lageplan oder Screenshot.
Benötigen Bilder mit einer sichtbaren Bildunterschrift ein Alt-Attribut?
Ja. Das Alt-Attribut sollte vorhanden sein, kann aber kürzer ausfallen, wenn die Bildunterschrift den wesentlichen Inhalt bereits verständlich erklärt. Beide Texte sollten sich ergänzen und nicht unnötig wiederholen.
Wie werden Alt-Texte bei mehreren ähnlichen Produktbildern formuliert?
Ähnliche Produktbilder sollten anhand der jeweils sichtbaren Perspektive oder Eigenschaft unterschieden werden, zum Beispiel Vorderansicht, Rückansicht oder Detailansicht des Verschlusses. Identische Beschreibungen erschweren die Zuordnung.
Kann ein CMS Alt-Texte automatisch erzeugen?
Ein CMS oder KI-Werkzeug kann Vorschläge aus Dateinamen, Produktdaten oder Bilderkennung erzeugen. Die Ergebnisse sollten redaktionell geprüft werden, weil Kontext, Bildfunktion und relevante Details nicht immer korrekt erkannt werden.
Fragen zur technischen und inhaltlichen Optimierung deiner Bilder? Die kostenlose Erstberatung zu SEO und GEO unterstützt dich bei der Einordnung und Priorisierung konkreter Maßnahmen.
Sie haben noch Fragen?
