Alt-Texte: der Text, den zwei Systeme gleichzeitig lesen
Das alt-Attribut ist die Textfassung eines Bildes. Es wird von zwei sehr verschiedenen Lesern benutzt — von Screenreadern und von Suchmaschinen —, und die beiden wollen ausnahmsweise dasselbe: eine Beschreibung dessen, was zu sehen ist.
Deshalb ist das hier eine der wenigen Stellen, an denen Barrierefreiheit und Auffindbarkeit nicht gegeneinander abgewogen werden müssen.
``html <img src="/bilder/serverraum.jpg" alt="Zwei Netzwerkschränke mit offener Fronttür"> ``
Der Fall, den fast alle falsch machen#
Ein rein dekoratives Bild bekommt ein leeres alt, kein fehlendes.
``html <img src="/bilder/trennlinie.svg" alt=""> ``
Der Unterschied ist nicht kosmetisch. Fehlt das Attribut ganz, liest ein Screenreader oft den Dateinamen vor — trennlinie-final-2-kopie.svg. Steht es leer da, wird das Bild übersprungen, und genau das soll passieren.
Die Barrierefreiheitsrichtlinie sieht das ausdrücklich vor: Ist ein Inhalt reine Dekoration, dient nur der visuellen Gestaltung oder wird Nutzern gar nicht dargeboten, muss er so eingebunden sein, dass Hilfstechnologie ihn ignorieren kann. Das leere alt ist die Umsetzung dieses Satzes.
Die Grundregel selbst steht im Erfolgskriterium 1.1.1 auf Stufe A — der niedrigsten. Jeder Nicht-Text-Inhalt braucht eine Textalternative, die denselben Zweck erfüllt.
Was hineingehört#
Was das Bild im Zusammenhang beiträgt, nicht was darauf zu sehen ist. Dasselbe Foto braucht in einem Artikel über Serverräume einen anderen Alt-Text als in einem über Kabelmanagement.
Kein „Bild von" und kein „Grafik". Der Screenreader kündigt bereits an, dass es sich um ein Bild handelt. Die Wiederholung kostet Zeit und sagt nichts.
Bei Bildern mit Text: den Text. Ein Diagramm mit Zahlen braucht die Aussage, nicht die Form. „Balkendiagramm" ist wertlos; „Ladezeit sinkt von 4,1 auf 1,3 Sekunden nach dem Umstieg" ist die Information.
Bei verlinkten Bildern: das Ziel. Ist das Bild selbst ein Verweis, ersetzt sein Alt-Text den Ankertext. Dann beschreibt er, wohin es geht, nicht was zu sehen ist.
Google formuliert die Anforderung knapp: Ziel sind nützliche, informative Inhalte mit passenden Keywords, die sich auf den Seiteninhalt beziehen.
Was nicht hilft#
Keywords aneinanderreihen. Google warnt davor ausdrücklich: alt-Attribute mit Keywords zu überladen ist nicht nutzerfreundlich und kann schnell dazu führen, dass eine Website als Spam eingestuft wird. Das ist eine der wenigen Stellen, an denen die Dokumentation von einer Spam-Einstufung spricht.
Es ist zugleich der Fall, in dem beide Leser gleich reagieren: Wer sich einen Alt-Text vorlesen lässt, hört bei „seo agentur tirol seo beratung innsbruck seo optimierung" auf zuzuhören.
Jedes Bild beschreiben. Wer auch Trennlinien, Verläufe und Rahmen mit Text versieht, produziert Lärm. Ein Screenreader liest alles vor, was da steht.
Den Dateinamen kopieren. Er ist selten eine Beschreibung und häufig eine Zahlenfolge aus der Kamera.
Den Alt-Text mit der Bildunterschrift verwechseln. Die Unterschrift sehen alle, der Alt-Text ersetzt das Bild. Beide identisch zu füllen heißt für einen Screenreader, denselben Satz zweimal zu hören.
Woran man den Bestand prüft#
Einzelne Seite: Strg+U und nach alt= suchen. Das zeigt, was gesetzt ist, aber nicht, was fehlt.
Vollständig geht es nur mit einem Werkzeug, das die Seite durchgeht. Der Image-SEO-Check listet Bilder ohne Alt-Text ebenso wie die, deren Alt-Text nur aus dem Dateinamen besteht — ohne Anmeldung.
Die Reihenfolge beim Aufräumen ist dieselbe wie überall: zuerst die Seiten mit Impressionen, dann der Rest. Ein Alt-Text auf einer Seite, die niemand aufruft, ändert nichts an der Auffindbarkeit — an der Barrierefreiheit allerdings schon, und das ist bei einer Seite mit Pflichtcharakter der ausschlaggebende Punkt.
Welche Seiten das betrifft und ab wann, steht in Barrierefreiheit Website: Pflicht; die Prüfliste dazu unter Barrierefreiheit Website: Checkliste.
Der Zusammenhang, der oft übersehen wird#
Ein Bild ohne Alt-Text ist bei abgeschaltetem Nachladen, bei einem 404 auf die Bilddatei oder bei einer blockierenden Content-Security-Policy eine leere Fläche. Mit Alt-Text steht dort wenigstens, was gefehlt hat.
Das ist der praktische Grund, warum es sich lohnt, auch wenn niemand einen Screenreader benutzt: Der Alt-Text ist die einzige Fassung des Bildes, die immer ankommt.
Quellen#
- WCAG 2.2, Erfolgskriterium 1.1.1 Non-text Content (Stufe A) — jede Nicht-Text-Information braucht eine Textalternative; reine Dekoration muss von Hilfstechnologie ignoriert werden können
- Best Practices für die Suchmaschinenoptimierung für Google Bilder — Ziel sind nützliche, informative Inhalte; das Überladen mit Keywords kann zur Einstufung als Spam führen
Kommentare
Gespeichert werden nur dein Name und dein Text — keine E-Mail-Adresse, keine IP-Adresse, kein Cookie. Jeder Kommentar wird vor der Veröffentlichung gelesen; das dauert meist einen Tag. Näheres in der Datenschutzerklärung.