Die ultimative Anleitung zum Schreiben des Alt-Textes der Bilder Deiner Website
für bessere Rankings in der Bildersuche
Inhalt
✓Was sind Alt-Texte bei Bildern✓Wann solltest Du einen Alt-Text verwenden
✓Wie schreibst Du einen guten Alt-Text
✓So schreibst Du einen guten Alt-Text
✓Checkliste - So erstellst Du einen optimalen Alt-Text in 7 Schritten
✓Die perfekte Balance: SEO und Barrierefreiheit
✓Gesetzliche Verpflichtungen zur Nutzung von Alt-Texten laut BFSG
✓Ein Beispiel für einen optimalen Alt-Text im Kontext
✓Tools für die Optimierung der Alt-Text Deiner Website
✓kostenloser Alt-text Check
✓Wie ergänze ich den Alt-Text bei den Bildern meiner Website?
✓Schlussfolgerung & die Sache mit dem unfassbar attraktiven SEO Berater
Level: Anfänger
Ein wichtiger Bestandteil des Bilder SEO ist die optimale Verwendung der Alt-Texte von Bildern.
Bilder sollten mit diesen Alt-Tags versehen werden, damit Suchmaschinen und auch Nutzer*innen mit Sehbehinderungen verstehen können, was sie darstellen.
Deshalb ist es wichtig, dass Du nicht einfach Bilder hochlädst und auf das Beste hoffst.
In diesem Beitrag erfährst Du alles, was Du über Alt-Texte für Bilder auf Deiner Website wissen musst.
Was sind Alt-Texte bei Bildern?
Ein Alt-Text (Alternativtext) beschreibt den Inhalt eines Bildes in Textform. Er erscheint im HTML-Code als alt-Attribut und wird angezeigt, wenn das Bild nicht geladen wird.
Alt-Texte helfen dabei:
- Barrierefreiheit zu schaffen, indem sie Screenreader-Nutzer*innen die Bildinhalte vermitteln.
- Suchmaschinen den Bildinhalt zu erklären, was die Sichtbarkeit in der Google-Bildersuche verbessert.
- Nutzer*innen mit langsamer Internetverbindung oder deaktivierter Bildanzeige eine Alternative zu bieten.
Alt-Texte sind Pflichtbestandteil jeder barrierefreien Website und essenziell für effektives Bilder-SEO.
Wann solltest du einen Alt-Text verwenden?
Kurzantwort:
Verwende immer einen Alt-Text, außer das Bild ist rein dekorativ und trägt nichts zum Inhalt bei.
Wann ist ein Alt-Text erforderlich?
Ein Alt-Text sollte für jedes relevante Bild auf Deiner Website vergeben werden. Das betrifft vor allem:
- Produktbilder
- Leistungs- oder Kategorieabbildungen
- Erklärende Grafiken oder Illustrationen
- Infografiken und visuelle Inhalte in Ratgebern
Ausnahme: Ist das Bild rein dekorativ – zum Beispiel ein Muster, ein Rahmen oder eine Designspielerei – kann auf den Alt-Text verzichtet werden. In HTML erfolgt dies durch alt="" (ein leerer Alt-Text).
Priorisiere strategisch
Bei Websites mit vielen Bildern ist es oft nicht praktikabel, jedem Bild sofort einen Alt-Text zuzuweisen.
Priorisiere daher:
- Seiten mit viel Traffic oder SEO-Potenzial
- Bilder auf Seiten, die bereits in der Bildersuche sichtbar sind (Google Search Console → „Leistung“ → „Suchtyp: Bild“)
Beginne mit den Bildern auf Seiten, die bereits organischen Traffic generieren – dort hat die Optimierung den größten Effekt.
Wie schreibst Du einen guten Alt-Text?
Kurzantwort:
Ein guter Alt-Text beschreibt das Bild präzise, in maximal 125 Zeichen und passt zum Kontext der Seite.
Was macht einen Alt-Text effektiv?
Ein wirksamer Alt-Text:
- beschreibt den sichtbaren Bildinhalt in einfachen Worten
- liefert Kontext zur Funktion des Bildes auf der Seite
- ist kurz, klar und barrierefrei formuliert
- vermeidet doppelte Informationen oder SEO-Tricks
Obwohl keine feste Zeichenbegrenzung existiert, solltest Du Alt-Texte unter 125 Zeichen halten. Viele Screenreader schneiden längere Texte ab.
Best Practices für Alt-Texte:
- Klarheit vor Detailtiefe: Beschreibe nur das Wesentliche. Zwei einfache Sätze reichen völlig aus.
- Kontext beachten: Frage Dich: Warum ist dieses Bild auf dieser Seite?
- Einfacher Satzbau: Vermeide Schachtelsätze – die Verständlichkeit leidet sonst.
- Keine Wiederholungen: Nicht einfach Bildunterschriften kopieren.
- Keine Keyword-Stuffing: Keywords ja – aber nur, wenn sie sinnvoll und organisch passen.
- Keine Meta-Angaben: Schreibe nicht „Bild von...“ oder „Foto zeigt...“ – das ist redundant.
- Richtige Zeichensetzung: Satzzeichen helfen Screenreadern bei der richtigen Betonung.
So schreibst Du einen guten Alt-Text – Schritt-für-Schritt-Anleitung
Kurzantwort: Ein effektiver Alt-Text beschreibt den Bildinhalt in einfachen, kurzen Sätzen – angepasst an den Seitenkontext.
7 Schritte zur perfekten Alt-Text-Erstellung
- Bild genau betrachten: Erkenne die relevanten Details. Was ist auf dem Bild zentral?
- Relevantes beschreiben: Konzentriere Dich auf das Wesentliche, das für den Seiteninhalt wichtig ist.
- Kontext einbeziehen: Frage Dich, warum das Bild hier verwendet wird und was es aussagen soll.
- Klare Sprache nutzen: Formuliere in einfachen, verständlichen Sätzen – keine Fachbegriffe.
- Zeichenlänge begrenzen: Maximal 125 Zeichen – alles darüber kann von Screenreadern abgeschnitten werden.
- Sinnvolle Keywords integrieren: Nutze Keywords nur, wenn sie sinnvoll in den Text passen – kein Keyword-Stuffing!
- Korrekte Zeichensetzung verwenden: Punkt, Komma & Co. helfen Screenreadern bei Betonung und Pausen.
Die perfekte Balance: SEO und Barrierefreiheit
Kurzantwort:
Ein guter Alt-Text vereint Barrierefreiheit mit SEO-Relevanz – und verbessert damit die Nutzererfahrung sowie die Sichtbarkeit in Suchmaschinen.
Zwei Ziele, ein Text
Ein effektiver Alt-Text erfüllt zwei zentrale Funktionen:
- Barrierefreiheit: Er beschreibt das Bild für Nutzer*innen mit Sehbehinderung – Screenreader lesen den Text vor.
- SEO: Er hilft Suchmaschinen zu verstehen, worum es im Bild geht – das kann Rankings in der Bildersuche verbessern.
Google bewertet Websites besser, die Nutzerfreundlichkeit mit technischer Optimierung kombinieren. Alt-Texte sind ein zentrales Bindeglied zwischen diesen beiden Welten.
Gesetzliche Verpflichtungen zur Nutzung von Alt-Texten laut BFSG
Kurzantwort:
Das Barrierefreiheitsstärkungsgesetz (BFSG) verpflichtet zur Nutzung von Alt-Texten für alle nicht-textuellen Inhalte – mit klaren Qualitätsanforderungen.
Rechtliche Grundlage: BFSG und WCAG 2.1
Laut dem Barrierefreiheitsstärkungsgesetz (BFSG) müssen Websites Alt-Texte verwenden, um Menschen mit Behinderungen gleichberechtigten Zugang zu digitalen Inhalten zu ermöglichen.
- 1.1.1 Nicht-textuelle Inhalte: Jedes Bild muss eine aussagekräftige Textalternative haben.
- 1.4.5 Bilder von Text: Enthält ein Bild Schrift, muss deren Inhalt vollständig beschrieben werden.
Anforderungen an Alt-Texte laut Gesetz:
- Prägnanz: Kurz und dennoch aussagekräftig
- Kontextrelevanz: Muss zur Seite und Bildfunktion passen
- Keine Redundanz: Kein doppelter oder überflüssiger Text
Hinweis: Die Missachtung dieser Vorgaben kann zu Abmahnungen und rechtlichen Konsequenzen führen – insbesondere bei öffentlichen Stellen oder kommerziellen Angeboten.
Beispiel für einen optimalen Alt-Text im Kontext
Je nach Inhalt der Seite, auf dem dieses Bild platziert ist, machen verschiedenen Alt-Texte Sinn.Sagen wir, das Bild ist auf einer Ratgeber Seite eines Online Shops, der Hüte verkauft. Dann könnte ein sinnvoller Alt-Text sein: "Mann mit grauem Trilby Hut sitzt im Büro"
Was an diesem Text dann doch nicht optimal ist, liest Du in nächsten Artikel.
Geht es aber auf der Seite um Hoodies, wäre sicher der folgende Alt-Text sinnvoller: "Mann mit Brille trägt das neue Hoodie Modell von Abercrombie & Fitch".
Auf dieser Seite hier wäre dagegen der Alt-Text "unfassbar attraktiver SEO Berater mit Hut, Brille und grauem Hoodie erklärt die Bedeutung von Alt-Tags" absolut passend, oder? 😉 - mehr dazu in der Schlussfolgerung.
Tools für die Optimierung der Alt-Text Deiner Website
Überprüfe im ersten Schritt, ob die Alt-Tags der Bilder Deiner Website überhaupt mit Text gefüllt sind.
Für eine einzelne Seite kannst Du das recht einfach mit der Chrome Extension Alt-Text Tester Chrome Extension erledigen.
Möchtest Du die Alt-Texte Deiner gesamten Website prüfen, helfen Dir fast alle gängigen SEO Tools.
Mein Favorit ist dabei der Screaming Frog, den Du bei einer Website bis maximal 500 URLS sogar kostenfrei nutzen kannst.
Es gibt auch einige kostenfreie Tools im Web, die dabei helfen, auf der Website Bilder ohne Alt-Texte zu identifizieren:
- adresults.nl/tools/alt-tags-checker (ist zwar auf niederländisch, aber die Ergebnisse sind gut dargestellt)
- www.searchenginebox.com/image-alt-tag.php
Falls Deine Website auf Wordpress basiert, ist das Plugin Imageseo hilfreich.
Diese Tools zeigen Dir erstmal nur, ob und bei welchen Bildern ein Alt-Text vorhanden ist.
Die Texte schreiben musst Du nun selber.
Aufschluss darüber, wie Google eigentlich das Bild sieht, kann die Rückwärts Bildersuche von Google geben. Suche ich nach dem Beispiel Bild mit dem Mann mit Hut kommt unglaublicherweise kein Ergebnis, dass mit "attraktiv" zu tun hat. Vielmehr scheint Google den Fokus auf den Hoodie zu legen. Vielleicht ist es also sinnvoll, ihn im Alt-Text zu erwähnen.
Ein genaueres und detaillierteres Ergebnis, wie Google das Bild inhaltlich sieht, bekommst Du, wenn Du es mit der Vision AI von Google analysierst. Auf dem Beispiel-Bild des SEO Beraters mit Hut sieht die Vision AI folgendes:
Die Google Vision AI erkennt also im Schwerpunkt drei "Objekte": eine Person, eine Brille und einen Fedora Hut.
Unter Labels kennzeichnet die AI das Bild noch mit Labels wie "Schauen" , "Hut", "Lächeln", "Büroarbeiter". Wieder kommt das Wort attraktiv nirgends vor. :.(
Daraus könnte die folgende Beschreibung des Bildes im Alt-Tag resultieren: "Lächelnde Person in einem Büro schaut in die Kamera. Sie trägt eine Brille und einen Fedora Hut."
Spannend wird es bei dem oben genannten Beispiels des Hut Shops: Besser ist dann die Worte Fedora Hut als Trilby Hut zu verwenden, auch wenn sie fast das gleiche bedeuten.
Diese Erkenntnis wird durch eine Keywordanalyse des Suchvolumens der beiden Keywords untermauert: Fedora Hut wird viermal so häufig gesucht wie Trilby Hut.
Kostenloser Alt-Text Check
Hier mein kostenfreier Service Für Dich: ich analysiere Deine Website: Welche Alt-Texte sind bei den Bildern vorhanden? Du bekommst eine vollständige Liste mit allen Bildern mit dem Alt-Text (bzw. ob dieser leer ist) und auf welcher Seite Du diese findest. Schreibe einfach eine kurze Mail mit "Alt-Text Check" im Betreff und der URL Deiner Website.
Wie ergänze ich den Alt-Text bei den Bildern meiner Website?
Grundsätzlich sieht das HTML Tag eines Bildes mit Alt-Text so aus:
Die meisten Content Management Systeme geben Dir recht einfach die Möglichkeit den Alt-Text bei Bildern zu ergänzen.
In Wordpress gehst Du in die Mediathek, klickst das Bild an und ergänzt dann den Alt-Text.
Schlussfolgerung
Alt-Texte bei Bildern Deiner Website sind vor allem aus zwei Gründen wichtig:
- Weil sehbehinderte Menschen mit Hilfe von Screenreadern Deine Seite verstehen können und Du somit zur Barrierefreiheit beiträgst.
- Weil Google die Inhalte Deiner Seite mit Alt-Texten besser versteht und Du somit eine höhere Sichtbarkeit in Suchmaschinen erreichst.
Eine einfache Grundregel hilft Dir beim Verfassen der Alt-Texte: schreibe eine kurze prägnante Beschreibung des Bildes, die eine inhaltliche Relevanz zur Seite hat. Stelle Dir dabei vor, wie ein Mensch, der das Bild nicht sehen kann, genau diesen Text vorgelesen bekommt.
So, jetzt musst Du nur noch loslegen.
Ach ja, der Alt-Text "unfassbar attraktiver SEO Berater mit Hut, Brille und grauem Hoodie erklärt die Bedeutung von Alt-Tags" ist dann wohl doch nicht so optimal, da hier Elemente des Bildes beschrieben werden, die subjektiv sind, keine inhaltliche Relevanz haben oder vielleicht sogar das Bild nicht korrekt wieder geben.
