Alt-Text-Generator: barrierefreie Alternativtexte und Bilder-SEO

16,2 Prozent aller Bilder auf den meistbesuchten Startseiten der Welt haben keinen Alternativtext – im Schnitt 10,8 Bilder je Seite. Rechnet man die inhaltsleeren Alt-Texte hinzu, ist mehr als jedes vierte Bild ein Problemfall. Das ist der Befund der WebAIM-Million-Auswertung vom Februar 2026 über eine Million Startseiten. Der Generator unten baut aus wenigen Stichworten drei brauchbare Alt-Text-Varianten, eine Bildunterschrift und einen sauberen Dateinamen – und sagt Ihnen bei dekorativen Bildern, dass leer die richtige Antwort ist.

Alt-Text-Generator

Wie der Generator arbeitet

Es steckt keine Bilderkennung darin, und das ist Absicht. Das Werkzeug läuft ohne Schlüssel und ohne Serverkontakt in Ihrem Browser. Was es leistet, ist die Struktur: Es zwingt Sie, die fünf Angaben zu machen, aus denen ein Alt-Text besteht, und setzt sie in der Reihenfolge zusammen, die zum Bildtyp passt.

Die Bausteine sind immer dieselben: Hauptmotiv, Handlung, Ort, wichtige Details, sichtbarer Text im Bild. Der Bildtyp entscheidet, welche davon in welcher Reihenfolge in den Text wandern. Bei einem Produktfoto stehen Motiv und Detail vorn, weil Farbe und Material die Kaufentscheidung tragen. Bei einem Personenfoto steht die Handlung vorn, weil sie die Aussage des Bildes ist. Bei Screenshots, Diagrammen, Logos und Infografiken setzt der Generator die Gattung als Präfix davor, weil die Information „das ist ein Diagramm" für den Hörer relevant ist.

Ein Rechenbeispiel. Sie tragen ein: Bildtyp Personenfoto, Hauptmotiv „Monteurin prüft einen Wechselrichter", Handlung „notiert die Messwerte", Ort „Kellerraum eines Einfamilienhauses", Details „Messgerät in der Hand", Zielkeyword „photovoltaik wartung". Daraus entsteht als kurze Variante „Monteurin prüft einen Wechselrichter, notiert die Messwerte." mit 60 Zeichen, als ausführliche Variante derselbe Satz um Ort und Detail erweitert bei 119 Zeichen, und die dritte Variante stellt das Keyword voran, weil es im Text noch nicht vorkam. Alle drei bleiben unter dem Faustwert von 125 Zeichen, die Ampel steht auf Grün.

Zu dieser Zahl eine Einordnung, die viele Ratgeber unterschlagen: 125 Zeichen sind keine Vorgabe der WCAG. Im Erfolgskriterium 1.1.1 steht keine Längengrenze. Die Zahl stammt aus der Praxis, weil lange Alt-Texte am Stück schwer zu hören sind und weil ältere Screenreader sie in Blöcken vorlasen. Deshalb sperrt der Generator nichts, sondern zeigt eine Ampel. Wenn ein Bild 180 Zeichen braucht, dann braucht es sie.

Wozu Alt-Texte da sind: Screenreader zuerst, SEO danach

Ein Alt-Text hat zwei Adressaten, und die Reihenfolge ist nicht verhandelbar. Zuerst kommt der Mensch, der die Seite hört, weil er blind ist, weil sein Sehvermögen nachlässt oder weil das Bild schlicht nicht geladen hat. Für ihn ist der Alt-Text kein Zusatz, sondern das Bild. Erst danach kommt die Suchmaschine.

Wie schlecht es darum steht, zeigt die WebAIM-Million-Auswertung vom Februar 2026. Für eine Million Startseiten wurden dort automatisiert erkennbare WCAG-Verstöße gezählt: 95,9 Prozent der Seiten hatten mindestens einen, im Schnitt 56,1 Fehler pro Seite. Fehlende Alternativtexte stehen auf Platz zwei der Fehlerliste – hinter zu schwachem Textkontrast, aber vor fehlenden Formularbeschriftungen.

Besonders unangenehm ist ein Detail aus derselben Auswertung: 45 Prozent der Bilder ohne Alternativtext waren verlinkte Bilder. Jedes vierte verlinkte Bild hatte keinen Alt-Text. Ein verlinktes Bild ohne Alt-Text ist ein Link ohne Beschriftung – der Screenreader liest dann die URL vor oder gar nichts. Wer nur eine Stelle auf seiner Website reparieren kann, fängt hier an.

Der zweite Adressat ist Google. In den Bilder-Richtlinien empfiehlt Google, „useful, information-rich content" zu erstellen, „that uses keywords appropriately", und nennt Keyword-Stuffing im Alt-Attribut ausdrücklich als schlechte Praxis. Als Positivbeispiel führt Google alt="Dalmatian puppy playing fetch" an. Eine belegte Zahl dazu, wie stark der Alt-Text auf das Ranking wirkt, gibt es nicht – wer Ihnen eine nennt, hat sie erfunden. Meine Einschätzung nach Jahren SEO-Arbeit: Der messbare Effekt liegt in der Bildersuche und in der thematischen Klarheit der Seite, nicht in einem Ranking-Hebel für das Hauptkeyword.

WCAG und BFSG: was gefordert ist

Die technische Grundlage ist das Erfolgskriterium 1.1.1 „Non-text Content" der Web Content Accessibility Guidelines, Konformitätsstufe A – die unterste Stufe, also der Pflichtteil jeder Konformitätserklärung. Es verlangt wörtlich, dass „all non-text content that is presented to the user has a text alternative that serves the equivalent purpose". Der entscheidende Begriff ist equivalent purpose: Der Text muss denselben Zweck erfüllen wie das Bild, nicht dasselbe aussehen.

Das Kriterium nennt sechs Ausnahmen, und eine davon ist für die Praxis zentral: Bei „pure decoration" muss das Nicht-Text-Element so umgesetzt sein, dass Hilfstechnik es ignorieren kann. Das ist die Norm hinter dem leeren Alt-Attribut. Steuerelemente brauchen einen Namen, der ihren Zweck beschreibt, CAPTCHAs eine Beschreibung ihres Zwecks, sensorische Inhalte zumindest eine identifizierende Angabe.

In Deutschland kommt das Barrierefreiheitsstärkungsgesetz hinzu, das seit dem 28. Juni 2025 gilt. Es erfasst bestimmte Produkte und bestimmte Dienstleistungen für Verbraucher, darunter Telekommunikation, E-Books, Bankdienstleistungen, Personenbeförderung und die „Dienstleistungen im elektronischen Geschäftsverkehr". Diese sind in § 2 Nr. 26 BFSG definiert als digitale Dienste, „die über Webseiten und über Anwendungen auf Mobilgeräten angeboten werden und elektronisch und auf individuelle Anfrage eines Verbrauchers im Hinblick auf den Abschluss eines Verbrauchervertrags erbracht werden". Technisch verweist die Verordnung zum Gesetz auf die EN 301 549 und damit auf WCAG 2.1 Stufe AA.

Wichtig ist die Ausnahme für Kleinstunternehmen. § 2 Nr. 17 BFSG definiert sie als Unternehmen, „das weniger als zehn Personen beschäftigt und das entweder einen Jahresumsatz von höchstens 2 Millionen Euro erzielt oder dessen Jahresbilanzsumme sich auf höchstens 2 Millionen Euro beläuft". Das Bundesministerium für Arbeit und Soziales formuliert dazu: „Kleinstunternehmen sind in Bezug auf angebotene Dienstleistungen von den Regelungen ausgenommen." Wer als Kleinstunternehmen Produkte im Sinne des Gesetzes in Verkehr bringt, ist davon nicht befreit.

Ich bin kein Anwalt, und die folgende Zeile ist ernst gemeint: Die Tabelle ist eine Orientierung, keine Rechtsberatung. Ob eine konkrete Website unter das Gesetz fällt, hängt an Details, die sich nicht pauschal beantworten lassen. Lassen Sie das im Zweifel prüfen. Was sich dagegen ohne jede Rechtsfrage sagen lässt: Alt-Texte sind die billigste Barrierefreiheitsmaßnahme, die es gibt. Sie kosten pro Bild eine halbe Minute und keinen einzigen Entwicklertag.

Alt-Text, title, Bildunterschrift, longdesc

Vier Elemente werden regelmäßig verwechselt, und drei davon lösen nicht das Problem, für das sie eingesetzt werden.

Der häufigste Irrtum: Ein Bild bekommt einen title, aber kein alt – dann sieht der Maus-Nutzer einen Tooltip und der Screenreader-Nutzer bekommt nichts. Der zweithäufigste: alt und title enthalten denselben Text. MDN warnt genau davor, weil manche Screenreader den Text dann zweimal vorlesen. Wenn ein Bild eine sichtbare Erklärung braucht, nehmen Sie figure und figcaption. Der Generator gibt deshalb eine Bildunterschrift aus, die den Alt-Text nicht wortgleich wiederholt, sondern Handlung, Ort und Seitenkontext zusammenfasst.

Alt-Texte für Diagramme und Infografiken

Hier scheitert die Faustregel mit den 125 Zeichen zuverlässig. Ein Balkendiagramm mit acht Werten lässt sich nicht in einen Satz packen, ohne Information zu verlieren. Der W3C-Entscheidungsbaum für Alternativtexte löst das eindeutig: Bei komplexen Grafiken muss die Information zusätzlich „elsewhere on the page" verfügbar sein.

In der Praxis heißt das ein zweistufiges Vorgehen. Erste Stufe, das Alt-Attribut: Diagrammtyp und Kernaussage in einem Satz, etwa „Diagramm: Anteil der Startseiten mit fehlenden Alternativtexten, 53,1 Prozent im Februar 2026." Zweite Stufe, die Seite selbst: Die Zahlen kommen als echter Text darunter – als Absatz, als Aufzählung oder als Tabelle. Das nützt nicht nur Screenreader-Nutzern. Es nützt auch jedem, der die Grafik auf dem Handy nicht entziffern kann, und es ist der einzige Weg, wie Suchmaschinen und KI-Systeme die Zahlen überhaupt erfassen.

Das alte Attribut longdesc, das genau für diesen Zweck gedacht war, ist laut MDN „obsolete in the HTML spec" und wird praktisch von keinem Browser sinnvoll unterstützt. Wer eine Verknüpfung zu einer ausführlichen Beschreibung braucht, nimmt aria-describedby und verweist damit auf einen sichtbaren Textabschnitt. Sichtbar ist dabei das Stichwort: Eine Beschreibung, die nur Screenreader hören, wird nie gepflegt und veraltet als Erstes.

Bilder-SEO-Checkliste

Der Alt-Text ist ein Baustein von mehreren. Diese Liste arbeite ich bei jedem Projekt ab, in dieser Reihenfolge.

1. Sprechender Dateiname. Google nennt my-new-black-kitten.jpg als gutes und IMG00023.JPG als schlechtes Beispiel. Kleinbuchstaben, Bindestriche, keine Umlaute, keine Leerzeichen. Bei übersetzten Seiten sollen laut Google auch die Dateinamen übersetzt werden. Der Generator baut Ihnen den Namen fertig.
2. Modernes Format. Google unterstützt in der Bildersuche BMP, GIF, JPEG, PNG, WebP, SVG und AVIF. Für WebP nennt Google 26 Prozent kleinere Dateien als bei PNG im verlustfreien Modus und 25 bis 34 Prozent kleinere Dateien als bei vergleichbarem JPEG. Zu AVIF gibt es keine ebenso belastbare Herstellerzahl – deshalb nenne ich hier keine.
3. Wirklich komprimieren. Ein Format allein spart nichts, wenn das Bild in Originalgröße hochgeladen wird. Skalieren Sie auf die tatsächlich benötigte Anzeigebreite, bevor Sie komprimieren.
4. Responsive ausliefern. Google empfiehlt srcset oder das picture-Element, immer mit einer Fallback-URL in src. So bekommt ein Handy nicht die Desktop-Datei.
5. Lazy Loading – aber nicht überall. Der teuerste Fehler in dieser Liste: Das erste große Bild der Seite ist meist das LCP-Element. web.dev formuliert unmissverständlich: „Never lazy-load your LCP image". Für dieses eine Bild kein loading="lazy", stattdessen fetchpriority="high" – und laut derselben Quelle bei höchstens ein bis zwei Bildern, sonst verliert die Priorisierung ihren Sinn. Alle Bilder weiter unten bekommen Lazy Loading.
6. Breite und Höhe setzen. Ohne width und height springt das Layout beim Nachladen. Bei Lazy-Loading-Bildern kann es laut MDN sogar passieren, dass sie nie geladen werden, weil ein ungeladenes Bild die Maße 0 hat.
7. Stabile Bild-URLs. Google rät, ein Bild „consistently with the same URL" zu referenzieren – jede Umbenennung kostet Crawl-Budget und setzt die Historie zurück.
8. Bild-Sitemap. Sie macht Bild-URLs auffindbar, die Google sonst eventuell nicht entdeckt. Wichtig bei Bildern, die per JavaScript oder aus einem CDN geladen werden – dessen Domain sollten Sie in der Search Console verifizieren.
9. Strukturierte Daten. Für Rich Results und Badges in Google Bilder ist das Bildfeld Pflicht. Google nennt primaryImageOfPage, mainEntity und og:image.
10. Kontext um das Bild. Google empfiehlt, Bilder „near relevant text" zu platzieren. Ein Bild mitten in einem thematisch passenden Absatz wird besser verstanden als eines in einer Galerie ohne Text.

Ein Wort zum Zielwert: Ein guter Largest Contentful Paint liegt laut web.dev bei 2,5 Sekunden oder darunter für mindestens 75 Prozent der Seitenaufrufe. In den meisten Projekten, die ich übernehme, hängt genau dieser Wert an einem einzigen zu großen Bild im Seitenkopf.

Was KI-generierte Alt-Texte taugen

Bildmodelle beschreiben heute erstaunlich präzise, was auf einem Foto zu sehen ist. Trotzdem produzieren sie regelmäßig Alt-Texte, die formal richtig und praktisch unbrauchbar sind. Der Grund ist kein Wahrnehmungsproblem, sondern ein Kontextproblem: Das Modell sieht das Bild, aber nicht die Seite.

Drei Fälle, in denen das regelmäßig schiefgeht. Erstens das dekorative Bild: Eine KI, die zur Beschreibung aufgefordert wird, beschreibt – auch den Farbverlauf im Hintergrund. Richtig wäre alt="". Zweitens das verlinkte Bild: Ein Logo, das zur Startseite führt, braucht als Alt-Text das Linkziel, nicht die Bildbeschreibung „blaues Quadrat mit weißem Schriftzug". Drittens die Gewichtung: Auf einer Produktseite ist die Farbvariante die entscheidende Information, auf einer Ratgeberseite dasselbe Foto vielleicht nur Illustration. Das Bild ist identisch, der richtige Alt-Text nicht.

Deshalb der dritte Reiter im Generator. Er erzeugt keinen Alt-Text, sondern den Prompt dafür: mit Rolle, Seitenkontext, Zielkeyword, Längenvorgabe, dem ausdrücklichen Verbot von „Bild von" und der Erlaubnis, bei einem rein dekorativen Bild alt="" vorzuschlagen, statt eine Beschreibung zu erfinden. Diesen Text kopieren Sie zusammen mit dem Bild in ChatGPT, Claude oder Gemini. Wie Sie Bildmodelle sonst noch sinnvoll einsetzen, habe ich im Beitrag zu KI-Bilder erstellen zusammengefasst.

Und danach lesen Sie das Ergebnis. Eine KI, die 200 Bilder in zehn Minuten beschreibt, ist ein Fortschritt gegenüber 200 leeren Attributen – aber sie ersetzt nicht den Blick darauf, ob das Bild auf dieser Seite überhaupt etwas erzählt.

Aus 10.000 Stockfotos gelernt

Ich verkaufe seit Jahren Stockfotos, inzwischen über 10.000 Motive. Jedes einzelne davon braucht Titel, Beschreibung und Keywords, sonst wird es schlicht nie gefunden. Das ist derselbe Job wie ein Alt-Text, nur unter härteren Bedingungen: Es gibt keinen Seitenkontext, der aushilft, und keine zweite Chance.

Zwei Dinge habe ich dabei gelernt. Erstens: Die ersten fünf Wörter entscheiden. Was danach kommt, liest kaum jemand zu Ende – bei Bildagenturen nicht und bei Screenreadern erst recht nicht. Wer die Kernaussage nach hinten schiebt, verschenkt sie. Zweitens: Synonymketten schaden. Ein Bild, das mit „Geschäftsfrau, Businessfrau, Managerin, Unternehmerin, Chefin" verschlagwortet ist, wirkt breit aufgestellt und ist in Wahrheit für keinen dieser Begriffe die beste Antwort. Genau dasselbe Muster sehe ich in Alt-Texten, die aus einer Keyword-Liste bestehen. Google nennt das Keyword-Stuffing, und der Screenreader liest es Wort für Wort vor.

Der praktische Übertrag: Schreiben Sie einen Alt-Text so, wie Sie das Bild jemandem am Telefon beschreiben würden, der es kaufen soll. Ein Satz, das Wichtigste zuerst, keine Aufzählung.

Typische Fehler

• Alt-Attribut fehlt komplett. Der häufigste Fall überhaupt. Der Screenreader behilft sich dann oft mit dem Dateinamen – bei IMG_4821.jpg ein trauriges Erlebnis.
• „Bild von" oder „Foto von" am Anfang. Hilfstechnik kündigt ein Bild bereits als Bild an. Die Floskel kostet Zeichen und sagt nichts. Der Generator markiert sie.
• Dateiname als Alt-Text. Die WebAIM-Auswertung zählt genau das zu den fragwürdigen Alt-Texten: 10,8 Prozent der Bilder mit Alt-Text tragen Werte wie „image", „graphic", „blank" oder einen Dateinamen.
• Verlinktes Bild ohne Alt-Text. Ergibt einen Link ohne erkennbares Ziel. Laut WebAIM betraf das jedes vierte verlinkte Bild.
• Alt-Text und Bildunterschrift identisch. Dann hören Screenreader-Nutzer denselben Satz zweimal. Die Unterschrift soll einordnen, nicht wiederholen.
• Keyword-Stuffing. Google warnt in den Bilder-Richtlinien ausdrücklich davor. Ein Vorkommen des Zielkeywords reicht, und nur wenn es sich natürlich einfügt.
• Dekoratives Bild ausführlich beschrieben. Erzeugt Lärm. alt="" ist hier kein Versäumnis, sondern die Lösung.
• Text im Bild nicht übernommen. Wenn auf einem Banner „30 Prozent Rabatt bis Sonntag" steht, muss dieser Text im Alt-Attribut auftauchen – sonst existiert das Angebot für einen Teil der Besucher nicht.
• Das LCP-Bild lazy geladen. Der teuerste Performance-Fehler mit Bildern. web.dev sagt dazu unmissverständlich: niemals.
• Alt-Texte nur beim Relaunch pflegen. Bilder kommen täglich dazu. Wenn die Alt-Text-Pflicht nicht im Redaktionsprozess steht, ist die Website in zwölf Monaten wieder da, wo sie war.

Wenn Sie das systematisch für eine ganze Website durchziehen wollen – Bestandsaufnahme, Priorisierung nach Seitentyp, Vorgaben für die Redaktion –, ist das Teil meiner Arbeit in der Suchmaschinenoptimierung. Bilder sind dort selten der erste Hebel, aber fast immer einer der schnellsten.

Häufige Fragen

Was ist ein Alt-Text?

Der Alt-Text ist der Inhalt des alt-Attributs im img-Tag. Er ersetzt das Bild für Menschen, die es nicht sehen können, und wird von Screenreadern vorgelesen. Zusätzlich nutzen Suchmaschinen ihn, um den Bildinhalt einzuordnen.

Wie lang darf ein Alt-Text sein?

Die WCAG nennen keine Zeichengrenze. In der Praxis haben sich rund 125 Zeichen als Faustwert etabliert, weil längere Texte am Stück schwer zu hören sind. Wenn ein Bild mehr Erklärung braucht, gehört diese in den Fließtext oder in eine Bildunterschrift.

Wann bleibt das Alt-Attribut leer?

Immer dann, wenn das Bild rein dekorativ ist oder denselben Inhalt wiederholt, der direkt daneben schon als Text steht. Dann schreiben Sie alt="" – das Attribut bleibt vorhanden, nur ohne Inhalt. Screenreader überspringen das Bild dadurch sauber.

Ist ein Alt-Text ein Rankingfaktor?

Google nennt den Alt-Text als Hilfe, um Bilder zu verstehen, und rät ausdrücklich von Keyword-Stuffing ab. Eine belegte Zahl zur Rankingwirkung gibt es nicht. Der praktische Nutzen liegt in der Bildersuche und darin, dass gute Alt-Texte das Thema der Seite stützen.

Brauche ich wegen des BFSG Alt-Texte auf meiner Website?

Das Barrierefreiheitsstärkungsgesetz gilt seit dem 28. Juni 2025 und betrifft unter anderem Dienstleistungen im elektronischen Geschäftsverkehr, also Angebote, bei denen Verbraucher online einen Vertrag abschließen. Für Kleinstunternehmen mit weniger als zehn Beschäftigten gilt bei Dienstleistungen eine Ausnahme. Ob Ihr Fall darunter fällt, klären Sie bitte anwaltlich.

Was ist der Unterschied zwischen alt und title?

Das alt-Attribut ersetzt das Bild und wird von Screenreadern vorgelesen. Das title-Attribut erzeugt einen Tooltip, den nur Maus-Nutzer sehen. MDN weist ausdrücklich darauf hin, dass title kein Ersatz für alt ist und identischer Text in beiden Attributen doppelt vorgelesen werden kann.

Kann ChatGPT Alt-Texte schreiben?

Ein Bildmodell kann beschreiben, was zu sehen ist, kennt aber nicht die Funktion des Bildes auf Ihrer Seite. Genau daran hängt aber die Entscheidung, ob ein Bild ausführlich beschrieben wird oder alt="" bekommt. Der Prompt-Baustein in diesem Werkzeug liefert der KI den fehlenden Kontext mit.