Bildbeschreibung

Ein Alternativtext (Alt-Text) ist die kurze Textalternative, die ein Screenreader anstelle eines Bildes vorliest und die erscheint, wenn ein Bild nicht lädt. Ich schreibe Alternativtexte und ausführlichere Bildbeschreibungen auf Deutsch, Englisch und Türkisch für Onlineshop-Kataloge, Websites und Dokumente — nach dem Bilder-Tutorial der W3C WAI: informativ, dekorativ oder funktional, und immer für den Zusammenhang geschrieben, in dem das Bild steht. Sie erhalten die Texte als CSV, fertig für Ihren Shop oder Ihre Entwicklung, und eine ehrliche Einordnung, was automatische Prüfwerkzeuge bestätigen können und was nicht.

Sie sind hier richtig, wenn einer dieser Punkte auf Sie zutrifft:

• Sie betreiben einen Onlineshop in Deutschland, Österreich oder der Schweiz und verkaufen an Verbraucherinnen und Verbraucher in der EU — und Hunderte oder Tausende Produktbilder haben leere oder fehlende Alt-Attribute.
• Ihre Alternativtexte wurden automatisch befüllt, mit Dateinamen, Produkttiteln oder Keyword-Listen, und ein Audit oder eine Kundin hat es bemerkt.
• Sie verkaufen mehrsprachig, aber die Alternativtexte gibt es nur in einer Sprache — oder sie wurden maschinell übersetzt, ohne dass jemand die Bilder angesehen hat.
• Ein Prüfwerkzeug für Barrierefreiheit meldet „Images must have alternative text“, und Sie brauchen die Texte, nicht nur die Fehlerzahl.
• Sie veröffentlichen Berichte, Kataloge oder Präsentationen mit Diagrammen und Schaubildern, die eine echte Beschreibung brauchen.

Öffnen Sie eine Ihrer Produktseiten, klicken Sie mit der rechten Maustaste auf das Hauptbild und wählen Sie „Untersuchen“. Im markierten Code sehen Sie das alt-Attribut.

• Kein alt vorhanden: Ein Screenreader liest womöglich stattdessen den Dateinamen oder die Bildadresse vor.
• alt="IMG_4521.jpg" oder alt="Bild": vorhanden, nutzlos — und von automatischen Prüfwerkzeugen akzeptiert, siehe Praxisbeispiel unten.
• Alternativtext identisch mit dem Produktnamen in der Überschrift darüber: Man hört den Namen zweimal und erfährt nichts über das Aussehen des Produkts.

Ein Alternativtext, der sagt, wie das Produkt aussieht — Farbe, Material, Form, Lieferumfang —, ist ein gutes Zeichen. Machen Sie dasselbe für ein Bild in einem Blogartikel und für ein dekoratives Banner.

Lesen Sie weiter für die Details. Unten: wie man über einen guten Alternativtext entscheidet, ein gemessenes Vorher-nachher-Beispiel mit axe-core-Ergebnissen und CSV-Lieferung, was Prüfwerkzeuge nicht beurteilen können und was das BFSG für Onlineshops bedeutet. Wenn Sie direkt einsteigen möchten, senden Sie mir zehn Bilder mit den Seitenlinks; ich sage Ihnen, was an den bisherigen Texten nicht stimmt, und schreibe einige davon als Probe.

Ein guter Alternativtext beantwortet eine Frage: Was trägt dieses Bild hier bei? Der Entscheidungsbaum der W3C WAI ordnet Bilder wenigen Typen zu, und jeder Typ braucht eine andere Art Text.

Ein Foto oder eine Illustration mit Informationsgehalt erhält eine kurze Beschreibung genau dieser Information. Auf einer Produktseite ist das das Produkt, wie Kundinnen und Kunden es sehen; in einem Artikel das Detail, um das es im Absatz geht. Kein „Bild von“, keine Wiederholung des Textes daneben.

Hintergrundtexturen, Trenner und Stimmungsbilder, die dem Inhalt nichts hinzufügen, erhalten ein leeres Alt-Attribut: alt="". Der Screenreader überspringt sie dann. Ein Text auf einem dekorativen Streifen ist bei jedem Seitenaufruf nur Lärm.

Ein Bild, das der einzige Inhalt eines Links oder einer Schaltfläche ist, beschreibt die Aktion oder das Ziel, nicht das Motiv: „Suchen“, nicht „Lupe“; „Beitrag lesen: Nachtstart in Cape Canaveral“, nicht „Rakete“.

Diagramme, Schaubilder und Karten brauchen einen kurzen Alternativtext und in der Nähe eine ausführliche Beschreibung mit denselben Daten. Bilder von Text sollten im Alternativtext dieselben Wörter enthalten — oder besser durch echten Text ersetzt werden.

Dasselbe Foto kann zwei verschiedene Alternativtexte brauchen. Im Praxisbeispiel erscheint ein Kaffeefoto auf einer Produktseite und in einem Artikel über Espresso-Crema — und bekommt an beiden Stellen einen anderen Text, in allen drei Sprachen.

Jede Sprachfassung entsteht aus dem Bild und der Seite in dieser Sprache, nicht als Wort-für-Wort-Übersetzung: Deutsche Produkttexte folgen deutschen Katalog-Gepflogenheiten, türkische dem türkischen Sprachgebrauch.

Dies ist ein gemessenes Praxisbeispiel auf einer fiktiven Shopseite mit gemeinfreien und CC0-lizenzierten Fotos — kein Kundenauftrag. Ich habe eine typische „Vorher“-Seite mit den üblichen Alt-Text-Fehlern und eine „Nachher“-Seite mit korrigierten Textalternativen gebaut und auf beiden die Prüf-Engine axe-core laufen lassen. Beide Seiten, die axe-Ergebnisse und die CSV können Sie unten herunterladen.

Die fünf Fotos werden mit der Open-Source-Bibliothek scikit-image 0.26.0 ausgeliefert, deren Dokumentation die Lizenz jedes Bildes nennt: eine Kaffeetasse (CC0, Foto: Rachel Michetti), eine Katze (CC0, Foto: Stefan van der Walt), eine Rakete auf der Startrampe (SpaceX, gemeinfrei), ein NASA-Astronautenporträt (gemeinfrei) und eine Ziegeltextur (CC0). Der Shop „Örnek Kafe“, sein Produkt, Preis und die Artikel sind fiktiv und auf den Seiten so gekennzeichnet. Das Suchsymbol ist eine kleine Zeichnung, die ich für die Seite angefertigt habe.

axe-core 4.13.0, ausgeführt in Headless-Chromium 141 mit dem Standard-Regelsatz, fand auf der Vorher-Seite 5 verletzte Regeln an 6 Elementen und auf der Nachher-Seite keine.

Auf der Vorher-Seite hat die axe-Regel image-alt vier eindeutig falsche Alternativtexte durchgelassen. Ein Prüfwerkzeug kann bestätigen, dass eine Textalternative existiert — nicht, ob sie stimmt.

Prüfwerkzeuge beurteilen auch nicht die Richtigkeit (passt der Text zum Bild?), den Zusammenhang (sagt er, was auf dieser Seite zählt?), die Sprache oder ob eine Diagrammbeschreibung dieselben Daten enthält wie das Diagramm. Diesen Teil der Arbeit macht ein Mensch. Einen Test mit Screenreader habe ich nicht durchgeführt; die Seiten sind englisch, die deutschen und türkischen Texte stehen in der CSV.

Die CSV enthält eine Zeile je Bildverwendung — im Beispiel 8 — mit den Spalten filename, context, image_type, alt_tr, alt_de, alt_en, decorative, dem Vorher-Wert, Quelle und Lizenz sowie Anmerkungen zu jeder Entscheidung. In Ihrem Projekt ist die Schlüsselspalte das, was Ihr System verwendet: Dateiname, Artikelnummer, Medien-ID oder Seiten-URL.

Sie erhalten fertige Alternativtexte in den benötigten Sprachen, in einer Datei, die Ihr System übernehmen kann, und die Begründungen schriftlich.

• Eine CSV oder Tabelle mit einer Zeile je Bildverwendung: Schlüsselspalte, Zusammenhang, Bildtyp, Alternativtext je Sprache, Kennzeichen „dekorativ“ und Anmerkungen.
• Ausführliche Beschreibungen für Diagramme, Schaubilder und Infografiken, platziert dort, wo Ihre Seite oder Ihr Dokument sie anzeigen kann.
• Eine Liste bestehender Alternativtexte, die geändert werden sollten, mit Begründung.
• Einen einseitigen Leitfaden für Ihr Team: Länge, Tonfall, was weggelassen wird, wie mit neuen Produkten umzugehen ist.
• Eine axe-core-Prüfung von Beispielseiten vorher und nachher, wenn die Texte schon online sind.

Sie senden zuerst eine kleine, echte Stichprobe; der Preis für den gesamten Bestand steht fest, bevor die Arbeit beginnt.

1. Senden Sie zehn Bilder mit den Seitenlinks — oder einen Produktexport mit Bild-URLs. Ich prüfe die bisherigen Texte und schreibe einige als Probe in den benötigten Sprachen.
2. Sie erhalten Leistungsumfang und Festpreis für den gesamten Bestand, bevor etwas beginnt.
3. Ich schreibe die Texte. Sie erhalten eine als Vorschau gekennzeichnete CSV und prüfen sie mit Ihrem Produkt- oder Content-Team.
4. Mit Ihrer Freigabe erhalten Sie die endgültige Datei und den Leitfaden.

Ich kalkuliere jeden Auftrag, nachdem ich das Material gesehen habe. Eine Serie ähnlicher Freisteller geht schneller als eine Mischung aus Stimmungsfotos, Infografiken und Diagrammen, und jede weitere Sprache ist eigene Schreibarbeit, keine Kopie. Sie erhalten einen Festpreis für den Bestand, bevor die Arbeit beginnt — keine Abrechnung nach Stunden.

Seit dem 28. Juni 2025 fallen Dienstleistungen im elektronischen Geschäftsverkehr für Verbraucher unter das Barrierefreiheitsstärkungsgesetz (BFSG), und fehlende Textalternativen gehören zu den häufigsten Mängeln. Was das für einen bestimmten Shop bedeutet, ist eine Rechtsfrage; diese Seite behandelt die technische Seite.

• Der European Accessibility Act, Richtlinie (EU) 2019/882, erfasst den elektronischen Geschäftsverkehr; die Mitgliedstaaten wenden ihre nationalen Gesetze seit dem 28. Juni 2025 an. In Deutschland nennt das BFSG in § 1 Abs. 3 Nr. 5 „Dienstleistungen im elektronischen Geschäftsverkehr“; in Österreich setzt das Barrierefreiheitsgesetz (BaFG) die Richtlinie um.
• Artikel 4 Absatz 5 der Richtlinie nimmt Kleinstunternehmen, die Dienstleistungen erbringen, aus. Ob das auf Sie zutrifft, klärt Ihre Rechtsberatung.
• Der technische Maßstab in der Praxis sind die WCAG. WCAG 2.2, Erfolgskriterium 1.1.1 „Nicht-Text-Inhalt“ (Stufe A), verlangt eine Textalternative für Nicht-Text-Inhalte und dass dekorative Bilder so umgesetzt sind, dass assistive Technologien sie ignorieren können.

Shops in der Schweiz oder außerhalb Europas betrifft das über ihre Verkäufe an Verbraucher in der EU. Und Alternativtexte dienen nicht nur Screenreadern: Sie erscheinen, wenn Bilder nicht laden, und Suchmaschinen lesen sie, um zu verstehen, was ein Bild zeigt.

Nicht unbedingt. Automatische Prüfwerkzeuge bestätigen, dass eine Textalternative vorhanden ist, nicht, dass sie stimmt. Im Praxisbeispiel akzeptierte axe-core alt="image123.jpg", alt="coffee", eine Kopie der Bildunterschrift und einen Text auf einem dekorativen Bild.

So kurz wie möglich, solange er trägt, was das Bild beiträgt; die WCAG setzen keine Zeichengrenze. Im Praxisbeispiel haben die deutschen Alternativtexte für informative Fotos 86 bis 121 Zeichen, der funktionale Linktext 43. Komplexe Bilder erhalten einen kurzen Alternativtext und zusätzlich eine ausführliche Beschreibung.

Sie sollten das Bild zutreffend beschreiben, in den Worten Ihrer Kundschaft. Eine genaue Produktbeschreibung enthält die natürlichen Suchbegriffe meist ohnehin. Keyword-Listen im Alternativtext verschlechtern die Seite für Screenreader-Nutzende.

Nein. Der Alternativtext hängt davon ab, warum das Bild auf der Seite steht. Im Praxisbeispiel bekommt ein Kaffeefoto auf der Produktseite eine Produktbeschreibung und im Artikel eine Beschreibung der Crema.

Wenn das Bild dekorativ ist oder dieselbe Information direkt daneben schon als Text steht — etwa bei einem Bild in einem Link, der auch den Linktext enthält. Dann ist alt="" richtig; das Attribut ganz wegzulassen dagegen nicht.

Ich schreibe jede Sprache aus dem Bild und der Seite in dieser Sprache. Die Fakten bleiben in allen Sprachen gleich, aber Satzbau, Katalogbegriffe und Länge folgen den Gepflogenheiten der jeweiligen Sprache.

Ja. Ich liefere CSV oder eine Tabelle, verknüpft mit dem, was Ihr System verwendet — Dateiname, Artikelnummer, Medien-ID oder URL —, mit den Spalten, die Ihre Entwicklung vorgibt. Den Import übernimmt meist Ihre Entwicklung; für WordPress und WooCommerce kann ich ihn gesondert anbieten.

• Barrierefreie PDF (PDF/UA)
• Barrierefreie Word- und PowerPoint-Dateien
• Barrierefreies EPUB
• C2PA-Inhaltsnachweise
• ZUGFeRD und XRechnung erstellen
• EUDR-GeoJSON-Geodaten
• GS1-Digital-Link-QR-Code erstellen

Zehn Bilder mit ihren Seitenlinks — am besten gemischt: Produktfotos, Artikelbilder und das Banner, an das niemand denkt. Sie erhalten eine klare Auskunft, was an den bisherigen Alternativtexten nicht stimmt, und einige davon als Probe in den benötigten Sprachen.

Ali Karabüyük · Tekirdağ, Türkei · Zusammenarbeit aus der Ferne, weltweit · Dokumenten- und Bildproduktion seit 2004, hauptberuflich seit 2008.