Opens in a new tab
Frau, deren Augen von einer zweiten Person mit den Händen verdeckt werden

ALT-Texte optimal nutzen – für Barrierefreiheit, Suchmaschinen-Optimierung und E-Mail Marketing

Wer die Inhalte einer Website pflegt, kommt zwangsläufig mit Alternativtexten für Bilder in Berührung. Muss man diese ALT-Texte überhaupt beachten? Wie nutzt man sie optimal? In diesem Artikel haben wir zusammengefasst, was Sie als Content Manager über ALT-Texte wissen müssen.

Wo ALT-Texte wichtig sind

Wovon reden wir hier überhaupt? Ein ALT-Text beschreibt den Inhalt eines Bildes auf einer Website. Im Gegensatz zu einer Bildlegende wird der ALT-Text aber nicht neben dem Bild angezeigt, sondern statt des Bildes – nämlich dann, wenn das Bild nicht sichtbar ist.

Wann kann eine solche Situation eintreten?

  1. Bei sehr langsamen Internet-Verbindungen sieht man als Benutzer zuerst nur den Text einer Webseite, während die Bilder Stück für Stück nachgeladen werden. Hierzulande erlebt man dies glücklicherweise nur noch selten, aber es gibt noch immer viele Menschen auf dieser Welt, welche mit einer geringen Bandbreite auskommen müssen. In diesem Fall ist es ungemein hilfreich, wenn man bereits anhand des ALT-Textes versteht, was das noch fehlende Bild zeigen würde.
  2. Blinde sowie Menschen mit einer starken Sehbehinderung nutzen keinen Bildschirm, sondern eine Screenreader-Software oder eine Braille-Zeile. Screenreader und Braille-Zeilen können mit Bildern nichts anfangen; sie können aber die ALT-Texte von Bildern vorlesen bzw. darstellen. Deshalb werden ALT-Text oft nur im Zusammenhang mit barrierefreien Websites diskutiert – was keineswegs der einzige Nutzen von ALT-Texten ist.
  3. Der Google-Bot kann ebenfalls nur Texte verarbeiten, aber keine Bilder. Indem man ein Bild mit einem ALT-Text versieht, verbessert man die Auffindbarkeit der eigenen Website über die Google-Suche.
  4. Bei E-Mails im HTML-Format sind Bilder nicht im E-Mail selbst enthalten, sondern sie werden bei Bedarf von einem Server nachgeladen. Dieses Verhalten nutzen viele Absender, um zu überprüfen, ob eine E-Mail vom Empfänger geöffnet wurde. Weil aber diese Form des Trackings von vielen Menschen als unangenehm empfunden wird, unterbinden die meisten E-Mail-Programme das Laden der Bilder standardmässig. Und solange die Bilder nicht geladen sind, erscheinen an ihrer Stelle die ALT-Texte. Wer Newsletters verschickt tut deshalb gut daran, die ALT-Texte konsequent zu befüllen, damit eine Botschaft auch dann ankommt, wenn der Empfänger die Bilder nicht lädt.
  5. Werden Bilder auf dem Webserver umbenannt, verschoben oder gelöscht, dann werden sie von Webseiten und Newsletters nicht mehr gefunden. In einem solchen Fall sieht der Benutzer dann nur noch ein «Broken Image» Icon – und eben den ALT-Text.

Halten wir also fest: Es gibt verschiedenste Situationen, in denen ALT-Texte eine wichtige Rolle spielen. Sie konsequent zu pflegen ist also ein absolutes Muss.

E-Mail Newsletter mit deaktivierten Bildern und ausführlichen ALT-Texten
Auch in E-Mail-Newsletters sind ALT-Texte wichtig. Derart ausführliche Texte wie in diesem SBB-Newsletter sind allerdings nicht unbedingt «Best Practice».

ALT-Tag, ALT-Attribut oder ALT-Text?

Oft hört man den Begriff ALT-Tag, wenn es um Alternativtexte für Bilder geht. Das klingt zwar cool, ist aber streng genommen falsch, denn ein HTML-Tag dieses Namens existiert nicht. Es gibt nur das IMG-Tag für Bilder, welches ein Attribut namens ALT besitzt. Und das, was wir in das ALT-Attribut schreiben, ist dann der ALT-Text.

<img src="apples_pears.jpeg" alt="Äpfel und Birnen">

Was einen guten ALT-Text ausmacht

Ein ALT-Text soll in knapper Form beschreiben, was in einem Bild zu sehen ist. Das klingt logisch, wird in der Praxis aber oft nicht eingehalten – und zwar in vielerlei Hinsicht.

Bei den Websites unserer Kunden sehen wir zwei Extreme: Entweder werden ALT-Texte komplett vernachlässigt – oder sie sind viel zu ausführlich. Es gibt zwar keine Maximallänge, aber ALT-Texte mit mehr als 150 Zeichen sind meist unnötig und wenig hilfreich. Falls dies einmal nicht ausreicht – beispielsweise wenn ein komplexes Diagramm beschrieben werden muss –, dann gibt es alternative Methoden, um diese Informationen unterzubringen (vgl. Kasten).

Wie lange muss bzw. darf ein ALT-Text sein?

Rein technisch gibt es weder eine Unter- noch eine Obergrenze. Das ALT-Attribut darf leer sein, es darf aber auch umfangreiche Texte enthalten. Weder in der HTML-Spezifikation noch in den Web Content Accessibility Guidelines (WCAG) ist eine fixe Obergrenze definiert. Der W3C Markup Validation Service beurteilt eine Webpage selbst dann noch als valide, wenn sie einen ALT-Text mit 1’000 Zeichen enthält.

Aus Sicht der Barrierefreiheit (Accessibility) gilt die allgemeine Regel: ALT-Texte sollen so kurz wie möglich, aber so lang wie nötig sein. Wer auf einen Screenreader oder eine Braille-Zeile angewiesen ist, bevorzugt generell knappe Texte, weil das Lesen mit dem Ohr bzw. mit der Fingerkuppe langsamer geht als mit den Augen. Man könnte auch argumentieren, dass ein ALT-Text idealerweise auf eine Braille-Zeile passt – je nach Modell wären das 40 bis 80 Zeichen.

Auf der anderen Seite muss die Beschreibung so ausführlich sein, dass sie sehbehinderten Menschen alle relevanten Informationen vermittelt, die im Bild enthalten sind. Der ALT-Text für ein Logo ist mit «Logo Mustermann AG» sicher ausreichend. Das berühmte Foto jenes Mannes, der sich während der Proteste auf dem Tiananmen-Platz ganz allein einer Panzerkolonne entgegenstellte (Tank Man), braucht hingegen eine ausführlichere Beschreibung als nur «Mann vor Panzer». Und wenn es sich gar um eine komplexe Grafik handelt (z.B. eine Organisationsstruktur oder ein statistisches Diagramm), dann ist unter Umständen noch mehr Text nötig. Allerdings müssen derart lange Bildbeschreibungen nicht zwingend im ALT-Attribut des IMG-Tags stehen – die Web Accessibility Initiative (WAI) beschreibt in diesem Tutorial verschiedene Alternativmethoden.

Aus Sicht der Suchmaschinen-Optimierung gibt es ebenfalls keine minimale oder maximale Zeichenzahl. Es ist gängige SEO-Praxis, detaillierte ALT-Texte für Bilder zu erstellen und dabei passende Keywords einzuarbeiten.

Über die konkrete Länge dieser Texte sagt Google nichts. Gemäss dem offiziellen SEO-Leitfaden soll im ALT-Attribut einfach ein «kurzer, aber beschreibender Text» platziert werden. Andernorts in der Google-Dokumentation steht zudem: «Das wichtigste Ziel beim Verfassen deines Alt-Textes sind nützliche, informative Inhalte mit passenden Keywords, die sich auf den Seiteninhalt beziehen. Überlade alt-Attribute nicht mit Keywords […], da dies nicht nutzerfreundlich ist und schnell dazu führen kann, dass deine Website als Spam eingestuft wird.» (Quelle).

Fazit: Alle Zahlen, die über die Länge von ALT-Texten kursieren, sind als Faustregel bzw. Grössenordnung zu verstehen. Viel wichtiger als die Zeichenzahl ist, dass ALT-Texte knapp, aber hilfreich sind – darin stimmen die Empfehlungen von WAI und Google überein.

Zudem sind ALT-Texte oft unpräzise. Ein Foto, das Donald Trump im Oval Office zeigt, wird durch «Mann im Büro», «US-Präsident» oder «Trump bei der Arbeit» zwar richtig, aber unvollständig beschrieben. Ziel muss es immer sein, alle relevanten Informationen zu vermitteln, die in einem Bild stecken.

Allerdings gibt es auch das Gegenteil, nämlich übervollständige ALT-Texte. «Der US-Präsident Donald Trump sitzt in seinem Schreibtisch im Oval Office im Weissen Haus in Washington D.C.» ist zwar alles andere als unpräzise. Aber weder dass Trump US-Präsident ist noch dass sich das Oval Office im Weissen Haus und jenes in Washington D.C. befindet, ist aus dem Foto ersichtlich. Das sind zusätzliche Informationen, und diese gehören nicht in einen ALT-Text.

Dies ist der ALT-Text.
Dies ist die Bildlegende.

Der häufigste Fehler bei ALT-Texten besteht allerdings darin, sie wie Bildlegenden zu behandeln. Ein ALT-Text beschreibt ein Bild, eine Bildlegende ergänzt es.

Nehmen wir als Beispiel das Foto eines Sonnenuntergangs am Strand mit der folgenden Legende: «Ein Erlebnis, auf das viele Schweizer im Jahr 2020 wegen dem Corona-Virus verzichten müssen: Mehr als die Hälfte der Bevölkerung macht Ferien in der Heimat.». Ein ALT-Text wie «Keine Auslandsferien für Schweizer wegen Corona» wäre hier völlig sinnlos, weil wir immer noch nicht wüssten, ob das Bild nun den Markusplatz in Venedig, eine Safari in Kenia oder eben das Meer zeigt. Ein guter ALT-Text würde in diesem Fall schlicht und einfach lauten: «Sonnenuntergang am Strand».

Wenig hilfreich ist es auch, möglichst viele SEO-Keywords in einem ALT-Text unterbringen zu wollen. Falls der Bildinhalt zu einem einzelnen Keyword passt, dann ist dagegen nichts einzuwenden. Aber Keyword Stuffing in ALT-Texten wird von Google schnell durchschaut, und wenn Menschen solche Texte lesen müssen, haben sie auch keine Freude.

Grundsätzlich sollten Sie jedes Bild mit einem ALT-Text versehen – ausser Bilder, die entweder rein dekorative Zwecke erfüllen oder gar nicht sichtbar sind (wie die transparenten Spacer-GIFs). Hier sollte das ALT-Attribut aber nicht ganz weggelassen, sondern als leer gekennzeichnet werden:

<img src="spacer.gif" alt="">

ALT-Texte mit KI erstellen

Kann man die Erstellung von ALT-Texten mit künstlicher Intelligenz automatisieren? Grundsätzlich ja – aber das Ergebnis ist nicht immer optimal.

Microsoft Word und Microsoft PowerPoint erlauben es schon länger, Alternativtexte von einer KI schreiben zu lassen. Auch WordPress bietet seit der Version 7.0 die entsprechenden Voraussetzungen – allerdings muss zusätzlich das AI-Plug-in installiert und unter Einstellungen » Konnektoren der API-Schlüssel eines KI-Dienstes hinterlegt werden.

Screenshot aus dem WordPress Block Editor: Feld zur Eingabe eines ALT-Textes, darunter ein Button mit der Beschriftung «Generate Alt Text».

Dass eine KI den Inhalt eines Bildes erkennen und diesen in Worten beschreiben kann, ist bekannt. Wie oben diskutiert ist es aber gar nicht so einfach, einen wirklich guten ALT-Text zu verfassen.

Nur schon die Entscheidung, ob ein Bild einen Informationsgehalt hat (also einen ALT-Text braucht) oder rein dekorativ ist (also keinen ALT-Text erhalten sollte), ist für eine KI schwierig. Es empfiehlt sich deshalb, die Checkbox «Als dekorativ markieren» gegebenenfalls gleich selbst anzuwählen. Vermutet die KI ein rein dekoratives Bild, so gibt es einen entsprechenden Hinweis – nach unserer Erfahrung ist das allerdings viel zu oft der Fall, und dann ist die KI nur noch schwer vom Gegenteil zu überzeugen.

Screenshot aus dem WordPress Block Editor: Meldung «This image appears to be decorative. Applying will set an empty alt attribute, which tells screen readers to skip it.» mit den beiden Buttons «Apply» und «Dismiss».

Die Qualität der ALT-Texte variiert nach unserer Erfahrung – abhängig von der verwendeten KI, aber auch abhängig von den Bildern und dem Kontext. Nachfolgend drei Beispiele mit unterschiedlichen Bildtypen:

Bildbearbeitung in RapidRAW am Beispiel eines Fotos der Elbphilharmonie Hamburg

Manueller ALT-Text
Bildbearbeitung in RapidRAW am Beispiel eines Fotos der Elbphilharmonie Hamburg

ALT-Text via Anthropic API
Screenshot der RapidRAW-Oberfläche mit Foto der Elbphilharmonie, Histogramm und Reglern für Belichtung, Kontrast und Farbe

Historische SBB-Zugskomposition «Roter Pfeil» im Zürcher Hauptbahnhof

Manueller ALT-Text
Historische SBB-Zugskomposition «Roter Pfeil» im Zürcher Hauptbahnhof

ALT-Text via Anthropic API
Roter SBB-Triebwagen an Gleis 9 in einem Bahnhof mit Glasdach

Bildschirm mit der Homepage der Schweizer Jugendfilmtage

Manueller ALT-Text
Bildschirm mit der Homepage der Schweizer Jugendfilmtage

ALT-Text via Anthropic API
Startseite der Schweizer Jugendfilmtage mit abstrakter VR-Brillen-Grafik, Datum 11.–15. März 2026 und Menüpunkten

Wie man sieht, erkennt die KI problemlos, was auf diesen Bildern zu sehen ist. Allerdings tut sie sich gelegentlich schwer damit, einen wirklich sinnvollen ALT-Text zu generieren. Beim mittleren Beispiel etwa ist die angegebene Gleisnummer zwar korrekt, aber völlig nebensächlich. Dafür fehlt jeglicher Hinweis darauf, dass es sich beim abgebildeten Fahrzeug nicht um irgendeine moderen S-Bahn-Komposition handelt, sondern um einen rund 90 Jahre alten Klassiker, der jedem Kind als «Roter Pfeil» bekannt ist.

ALT-Texte testen

Wie können Sie überprüfen, ob Ihre ALT-Texte gelungen sind? Ganz einfach: Indem Sie die Bildanzeige im Browser deaktivieren und dann jemand anders bitten, anhand der ALT-Texte die fehlenden Bilder zu beschreiben. Auf diese Weise merken Sie sehr schnell, ob im ALT-Texte entscheidende Informationen fehlen.

Einstellungen von Google Chrome für die Anzeige von Bildern
In allen gängigen Browsern können Sie die Anzeige von Bildern zu Testzwecken deaktivieren.

Die Anzeige von Bildern kann man in den meisten Browsern direkt in den Einstellungen abschalten. Zudem gibt es Extensions wie beispielsweise die Web Developer Tools, welche das Ausblenden der Bilder nochmals ein bisschen einfacher machen.

Diese Methode ist übrigens auch hilfreich, um fehlenden ALT-Texte auf einzelnen Seiten zu erkennen. Um die ALT-Texte auf einer ganzen Website systematisch zu prüfen, sind dagegen SEO-Tools effizienter.

Screenshot von SE Ranking: Liste der Seiten mit fehlenden ALT-Texten
SEO-Tools wie beispielsweise SE Ranking zeigen fehlende ALT-Texte auf einer Website zuverlässig an.
Computer-Bildschirm mit der Website von SEOprofiler

Unsere SEO-Dienstleistungen

Wird Ihre Website über die Google-Suche gefunden?

Wir analysieren Ihr Google Ranking basierend auf geeigneten SEO Keywords und erarbeiten einen Massnahmenplan für die Suchmaschinen-Optimierung Ihrer Website. Gerne unterstützen wir Sie auch bei der Umsetzung dieser Massnahmen.