Barrierefreiheit

So schreiben Sie Alt-Text für KI-generierte Bilder

Alt-Text sagt Menschen, die ein Bild nicht sehen, wozu es da ist. Eine einfache Formel, wann er leer bleibt, und Beispiele für Produkt, Illustration, Diagramm.

5 Min. Lesezeit
Eine kleine Lupe aus Messing, aufrecht auf einem dunklen Tisch stehend, violettes Licht leuchtet durch ihre Linse, dahinter weicher Dunst

Sie haben ein Bild erstellt, es ist genau richtig, und nun verlangt der Seiteneditor einen «Alt-Text». Die meisten tippen den Dateinamen ein, fügen den Prompt ein oder lassen das Feld leer. Alle drei Wege verschwenden das Feld. Alt-Text sind wenige Worte, die das Bild ersetzen, wenn man es nicht sehen kann: für Nutzer eines Screenreaders, für Besucher mit langsamer Verbindung, für eine Suchmaschine, die die Seite liest. Hier ist ein kurzer, praktischer Weg, ihn für selbst generierte Bilder zu schreiben.

Wofür Alt-Text wirklich da ist

Er hat eine einzige Aufgabe: dem Leser an der Stelle, an der das Bild steht, das zu geben, was das Bild einem sehenden Besucher gibt. Er ist keine Bildunterschrift (eine Bildunterschrift ist für alle sichtbar und liefert Kontext), und er ist kein Feld für Schlüsselwörter. Suchmaschinen lesen ihn, und eine klare, ehrliche Beschreibung hilft ihnen, die Seite zu verstehen, aber ein mit Suchbegriffen vollgestopfter Satz hilft niemandem, und Screenreader-Nutzer merken es sofort.

Eine einfache Formel

Stellen Sie drei Fragen, in dieser Reihenfolge, und schreiben Sie aus den Antworten einen schlichten Satz.

  1. Was ist es? Das Hauptmotiv in Alltagsworten: eine Keramiktasse, ein Leuchtturm, ein Balkendiagramm.
  2. Was ist hier daran wichtig? Das Detail, das die Seite braucht: die Farbe des Produkts, die Stimmung des Covers, der Trend des Diagramms.
  3. Was für ein Bild ist es? Nur wenn es die Bedeutung ändert: Illustration, 3D-Rendering, fotoartiges Rendering, Aquarell.

Halten Sie es bei ungefähr einem Satz. Lassen Sie «Bild von» und «Foto von» weg: Der Screenreader kündigt schon an, dass es ein Bild ist.

Informativ oder dekorativ: zuerst entscheiden

Fragen Sie sich, bevor Sie etwas schreiben, ob das Bild eine Information trägt, die der Text daneben nicht liefert. Ein Produktfoto auf einer Produktseite tut das. Ein ruhiger, abstrakter Hintergrund hinter einer Überschrift nicht. Ein dekoratives Bild sollte ein leeres Alt-Attribut bekommen (alt=""), das Hilfstechnologien anweist, es zu überspringen. Das ist besser als eine Beschreibung, bei der jemand dreimal pro Seite «violetter Verlauf mit weichem Licht» hören muss.

  • Informativ: Produktfotos, Illustrationen, die etwas erklären, Diagramme, das Cover eines Artikels. Beschreiben Sie sie.
  • Dekorativ: Texturen, Trennlinien, Stimmungshintergründe, ein Kopfbild, das nur den Titel wiederholt. Lassen Sie das Alt leer.
  • Funktional: ein Bild in einem Link oder Button. Beschreiben Sie, wohin er führt oder was er tut, nicht wie er aussieht.

Beschreiben Sie den Stil ehrlich

Ein generiertes Bild ist kein Foto eines echten Ortes, und der Alt-Text sollte das nicht vortäuschen. Wenn der Stil für den Leser wichtig ist, nennen Sie ihn: «Illustration eines Leuchtturms auf einer Klippe in der Dämmerung» oder «Gerendertes Produktbild einer Keramiktasse auf einem Eichentisch». Schreiben Sie nicht «Foto von» für etwas, das nie fotografiert wurde. Es geht nicht darum, für das Werkzeug zu werben, sondern darum, den Menschen nicht in die Irre zu führen, der es nicht selbst prüfen kann. Wenn Sie generierte Bilder veröffentlichen, behandelt der Leitfaden zum Erkennen von KI-Bildern die andere Seite dieser Ehrlichkeit.

Drei Beispiele

Ein Produktbild

Auf einer Shopseite braucht der Leser, was ein Kunde sehen würde: Farbe, Form, die Umgebung nur, wenn sie wichtig ist.

Prompt
Gerendertes Produktbild einer matten grünen Keramiktasse mit breitem Henkel, auf einem hellen Eichentisch im weichen Fensterlicht
Motiv, das wichtige Detail und die ehrliche Art des Bildes. Keine Schlüsselwörter hinzugefügt.

Eine Illustration

Für ein Blog-Cover, das die Stimmung setzt, genügt ein kurzer Satz, und ein leeres Alt ist in Ordnung, wenn der Titel es schon sagt.

Prompt
Illustration im Aquarellstil eines kleinen Boots unter einem großen Mond auf ruhigem Wasser

Ein diagrammartiges Bild

Hier trägt das Bild Daten, also muss das Alt die Aussage tragen. Vorsicht: Bildmodelle zeichnen Dinge, die wie Diagramme aussehen, aber ihre Zahlen und Beschriftungen sind nicht verlässlich (der Leitfaden zu Händen und Text erklärt, warum). Bauen Sie ein echtes Diagramm in einem Diagramm-Werkzeug und schreiben Sie das Alt aus dessen echten Daten. Setzen Sie die vollständigen Zahlen in eine Tabelle oder in den Text daneben.

Prompt
Balkendiagramm der monatlichen Anmeldungen, die von Januar bis Juni jeden Monat steigen, mit dem größten Sprung im April
Die Kernaussage, nicht die Farben. Die genauen Werte gehören in den Seitentext.

Nutzen Sie Ihren Prompt als Entwurf, nicht als Kopie

Der Prompt, den Sie geschrieben haben, ist ein nützlicher erster Entwurf, denn er nennt bereits das Motiv. Fügen Sie ihn aber nicht einfach ein. Ein guter Prompt ist ein Rezept für das Modell: Er enthält Lichtbegriffe, Kamerawörter und Stil-Tags, die einem Zuhörer nichts sagen (der Prompt-Leitfaden erklärt, warum sie dem Modell helfen). Und ein Prompt beschreibt, was Sie wollten, während Alt-Text beschreiben muss, was im fertigen Bild tatsächlich zu sehen ist. Modelle weichen ab: Die dritte Tasse hat vielleicht keinen Henkel. Sehen Sie sich das Ergebnis an, behalten Sie dann das Motiv aus Ihrem Prompt, streichen Sie die technischen Wörter und korrigieren Sie alles, was nicht wie gewünscht herausgekommen ist.

Eine kurze Checkliste

  • Ist das Bild informativ, dekorativ oder funktional?
  • Ein Satz, Motiv zuerst, kein «Bild von».
  • Das Detail, das diese Seite braucht, nicht jedes Detail.
  • Die Art des Bildes genannt, wenn sie wichtig ist (Illustration, Rendering).
  • Passt zum fertigen Bild, nicht nur zum Prompt.
  • Keine Schlüsselwortlisten, keine Dateinamen.

Was das Studio tut und was nicht

Das Studio erstellt das Bild; es schreibt keinen Alt-Text für Sie und fügt ihn Ihren Downloads nicht hinzu. Das Bild kommt in 2K an, und die Beschreibung schreiben Sie dort, wo Sie veröffentlichen, denn dort ist der Seitenkontext bekannt. Das liegt bei Ihnen: Nur Sie wissen, wofür das Bild gedacht ist. Für Produkt- und Cover-Arbeiten zeigen die Beiträge zur Produktfotografie und zu Blog-Headerbildern die Bilder, auf die dieser Rat zutrifft. Öffnen Sie das Studio, um sie zu erstellen, oder sehen Sie sich die Modellseite für die angebotenen Stile an.

Fragen

Wie lang sollte Alt-Text sein?

Etwa ein klarer Satz. Lang genug, um zu sagen, was das Bild zeigt und warum es da ist, kurz genug, um es in wenigen Sekunden anzuhören. Längere Erklärungen, etwa Diagrammdaten, gehören in den Seitentext.

Soll ich meinen KI-Prompt als Alt-Text einfügen?

Nein. Nutzen Sie ihn als Entwurf für das Motiv, entfernen Sie dann Licht-, Kamera- und Stilbegriffe und prüfen Sie ihn am fertigen Bild, denn das Ergebnis kann vom Prompt abweichen.

Braucht dekorative KI-Kunst einen Alt-Text?

Nein. Wenn das Bild keine Information hinzufügt, verwenden Sie ein leeres Alt-Attribut, damit Screenreader es überspringen. Geben Sie informativen Bildern stattdessen eine kurze Beschreibung.

Schreibt das Studio den Alt-Text automatisch?

Nein. Es erzeugt nur das Bild. Die Beschreibung schreiben Sie dort, wo Sie veröffentlichen, denn Sie kennen die Seite, zu der sie gehört.

#Barrierefreiheit#SEO#Bilder

Weiterlesen

Alle Artikel →