Alt-Texte für Website-Bilder mit KI erstellen

Das Problem

Frau Müller betreut die Website einer kleinen Zahnarztpraxis. Beim Hochladen eines Bildes fragt das Redaktionssystem nach einem «Alternativtext». Sie schreibt «Bild1.jpg», weil sie nicht weiss, was dort hingehört. Der Praxisinhaber hat gehört, dass dies für Menschen mit Sehbehinderung wichtig sei, und fragt, ob man das nicht mit KI erledigen könne.

Ein Alt-Text (alternativer Text) beschreibt ein Bild in Worten. Menschen, die blind oder sehbehindert sind, nutzen Screenreader, Programme, die Seiteninhalte vorlesen. Bei einem Bild ohne Beschreibung hören sie im schlechtesten Fall nur «Bild» oder einen Dateinamen. Aber auch andere profitieren: Wenn Bilder nicht laden, erscheint der Text. Und Suchmaschinen verstehen, worum es geht.

Viele Betriebe lassen Alt-Texte leer oder füllen sie mit Stichwörtern. Gute Alt-Texte sind kurz, sachlich und passen zum Zweck des Bildes. KI kann Bilder beschreiben und so beim Entwerfen helfen. Aber sie sieht nicht, was auf der Seite wichtig ist, und kann Dinge falsch erkennen. Deshalb gilt: KI schlägt vor, Menschen entscheiden.

So lösen Sie es mit KI – Schritt für Schritt

1. Prüfen Sie, welche Bilder einen Text brauchen. Informative Bilder (Produktfoto, Team, Grafik mit Aussage) brauchen einen Alt-Text. Rein dekorative Bilder (Trennlinien, Hintergrundmuster) sollten leer bleiben, damit Screenreader sie überspringen.

1. Klären Sie den Zweck des Bildes auf dieser Seite. Was soll es vermitteln? Dasselbe Foto kann je nach Seite etwas anderes bedeuten: «Frau Dr. Meier im Behandlungszimmer» auf der Teamseite, «Moderner Behandlungsraum mit höhenverstellbarem Stuhl» auf der Seite zur Ausstattung.

1. Lassen Sie einen Entwurf erstellen. Geben Sie der KI das Bild (sofern erlaubt) oder eine Beschreibung und nennen Sie Zweck und Seite. Das Beispiel unten zeigt eine Vorlage. Beachten Sie Hinweise zu Werkzeugen wie Alt-Text in Canva.

1. Kürzen Sie auf das Wesentliche. Meist genügen ein bis zwei Sätze, höchstens etwa 125 Zeichen. Beginnen Sie nicht mit «Bild von» oder «Foto von», das sagen Screenreader schon.

1. Prüfen Sie auf Richtigkeit. Stimmt die Beschreibung? KI kann Personen, Objekte oder Texte im Bild falsch erkennen oder Alter, Gefühle und Berufe vermuten. Streichen Sie Vermutungen.

1. Nennen Sie Text im Bild. Wenn ein Bild Text enthält, der für das Verständnis wichtig ist (zum Beispiel ein Preisschild), gehört er in den Alt-Text oder in den Fliesstext.

1. Beschreiben Sie Grafiken und Diagramme anders. Bei Diagrammen genügt ein kurzer Alt-Text mit der Kernaussage, die ausführlichen Zahlen stehen in einer Tabelle oder im Text daneben.

1. Kontrollieren Sie die Seite. Lassen Sie sich die Seite mit einem Screenreader oder einer Vorlese-Funktion vorlesen oder bitten Sie jemanden um Rückmeldung. Prüfen Sie, ob die Bildbeschreibungen verständlich sind.

Vorlage zum Kopieren

Laden Sie nur Bilder hoch, die Sie verwenden dürfen und die keine Personen zeigen, deren Daten nicht in den Dienst gehören. Sonst beschreiben Sie das Bild mit eigenen Worten.

Du schreibst Alternativtexte (Alt-Texte) für eine Schweizer Website, nach den Grundsätzen der Barrierefreiheit (WCAG).
Seite: [Titel/Thema der Seite]. Zweck des Bildes auf dieser Seite: [z. B. «zeigt die Ausstattung des Behandlungsraums»].
Bildbeschreibung (von mir): [was zu sehen ist, ggf. Text im Bild].
Aufgabe: Schreibe drei Varianten eines Alt-Textes (maximal 125 Zeichen), sachlich, ohne «Bild von» oder «Foto von», ohne Vermutungen über Personen (Alter, Gefühle, Berufe), ohne Werbesprache. Danach: Gib an, ob das Bild eher informativ, dekorativ oder funktional (z. B. Button) ist, und ob ein Alt-Text überhaupt nötig ist.
Regeln: Beschreibe nur, was ich angegeben habe. Erfinde keine Details. Markiere Unsicheres mit [PRÜFEN]. Deutsch (Schweiz).

Passen Sie Zweck und Beschreibung an. Prüfen Sie den Entwurf und fügen Sie ihn im Redaktionssystem ein.

Worauf Sie achten müssen

• Falsche Beschreibungen: KI-Bilderkennung irrt, besonders bei Details, Personen und Text. Prüfen Sie jeden Vorschlag.
• Keine Vermutungen über Menschen: Alter, Herkunft, Gefühle oder Gesundheit gehören nicht in einen Alt-Text, wenn sie nicht belegt und relevant sind.
• Datenschutz: Fotos von Personen in einen KI-Dienst hochzuladen ist heikel. Beschreiben Sie lieber mit eigenen Worten.
• Keine Stichwortlisten: Alt-Texte voller Suchbegriffe schaden Nutzbarkeit und werden von Suchmaschinen nicht honoriert.
• Rechtlicher Rahmen: Barrierefreiheit ist für Bund und viele öffentliche Stellen verbindlich; für Private nur in bestimmten Fällen. Für Angebote an EU-Kundschaft kann die europäische Richtlinie zur Barrierefreiheit (European Accessibility Act) bei bestimmten Produkten und Dienstleistungen eine Rolle spielen. Ob sie Sie betrifft, klären Sie im Einzelfall.
• Standard: International massgeblich sind die Richtlinien für barrierefreie Webinhalte (WCAG) des W3C, die Alternativtexte für Nicht-Text-Inhalte verlangen.

Ein Beispiel aus der Praxis

Ein Beispiel: Die Zahnarztpraxis in Frauenfeld überprüft 24 Bilder auf ihrer Website. Frau Müller sortiert sie in informativ, dekorativ und funktional und lässt Entwürfe für die informativen Bilder erstellen.

Vorher: Dateinamen wie «IMG_2381.jpg» als Alt-Text. Nachher: «Behandlungsraum mit höhenverstellbarem Stuhl» und «Das Praxisteam vor dem Eingang». Bei einem Bild erkennt die KI «eine lächelnde Frau um die 40», was sie streicht, weil Alter und Stimmung nichts zur Aussage beitragen. Dekorative Bilder erhalten leere Alt-Texte. Eine Patientin, die einen Screenreader nutzt, bestätigt, dass die Seite nun verständlicher ist.

So hilft Ihnen Alpasana

Wenn Sie KI-Bilder und Webinhalte vorbereiten, bietet KI und IT für konkrete Arbeitsaufgaben Lerninhalte zu KI-Bildern und Qualitätsprüfung; Barrierefreiheit ist nicht ausdrücklich als Kursthema ausgewiesen. Für Aufbau oder Überarbeitung einer Website umfasst die Beratung Struktur, UX/UI, Umsetzung, Go-Live und Betreuung.

Häufige Fragen

Wie lang darf ein Alt-Text sein?

Kurz: meist ein Satz, etwa bis 125 Zeichen. Längere Beschreibungen gehören in den Text neben dem Bild.

Brauchen alle Bilder einen Alt-Text?

Informative und funktionale Bilder ja, dekorative sollten leer bleiben.

Hilft der Alt-Text bei der Suchmaschinenoptimierung?

Etwas, aber das ist nicht der Hauptzweck. Schreiben Sie für Menschen, nicht für Suchmaschinen; siehe SEO-Titel und Meta-Beschreibung.

Kann KI das automatisch für die ganze Website erledigen?

Technisch teilweise, aber die Qualität schwankt. Prüfen Sie Stichproben und besonders wichtige Bilder von Hand.