Was es ist
Alt-Text ist eine kurze schriftliche Beschreibung, die im Code einer Seite an ein Bild angehängt wird und die ein Screenreader anstelle des Bildes selbst laut vorliest – denn ein blinder oder sehbehinderter Besucher, der einen Screenreader nutzt, kann das Bild nicht direkt sehen. Während unser SEO-Ratgeber zum Alt-Text erklärt, wie dasselbe Attribut Suchmaschinen hilft, Bilder zu finden, geht es hier ganz konkret darum, was Alt-Text für einen echten Menschen bedeutet, der darauf angewiesen ist, um dieselbe Information zu bekommen, die ein sehender Besucher einfach durch einen Blick auf das Bild erhält.
Dieser Unterschied ist in der Praxis wichtig: Alt-Text, der rein für ein besseres Ranking in der Bildersuche geschrieben wurde, ist manchmal mit Schlüsselwörtern vollgestopft, statt wirklich zu beschreiben, was auf dem Bild zu sehen ist – das nützt einem Screenreader-Nutzer wenig, auch wenn es formal die Anforderung erfüllt.
Warum es wichtig ist
Für jemanden, der einen Screenreader nutzt, wird ein Bild ohne Alt-Text entweder komplett übersprungen (als würde es gar nicht existieren) oder als unbrauchbarer Dateiname wie „IMG_4821.jpg" vorgelesen – so oder so geht jede Information verloren, die dieses Bild einem sehenden Besucher vermitteln sollte. Das wird besonders problematisch, wenn das Bild wichtigen Inhalt trägt: ein Diagramm mit Daten, eine Grafik, die einen Ablauf erklärt, ein Produktfoto, das ein Merkmal zeigt, das nirgendwo im umliegenden Text beschrieben wird.
Es ist in vielen Fällen auch eine rechtliche Anforderung an Barrierefreiheit, etwa nach Standards wie WCAG (Web Content Accessibility Guidelines), die viele Unternehmen erfüllen müssen – wer das aber nur als Häkchen auf einer Compliance-Liste behandelt, übersieht, dass hier ein echtes, alltägliches Zugangsproblem für echte Besucher gelöst wird.
So behebst du es
- Schreibe für jedes Bild, das echte Information vermittelt, einen Alt-Text, der beschreibt, was tatsächlich zu sehen ist – so, als würdest du es jemandem am Telefon beschreiben, der es nicht sehen kann.
- Halte die Beschreibung kurz und konkret – ein Satz oder eine kurze Formulierung reicht meist aus. Wiederhole nicht einfach Informationen, die im umliegenden Text schon stehen.
- Für rein dekorative Bilder ohne eigenen Informationswert (Hintergrundmuster, Trennlinien) nutze ein leeres
alt="", damit ein Screenreader diese Bilder komplett überspringt, statt etwas Bedeutungsloses vorzulesen. - Ist ein Bild selbst ein Link (etwa ein Logo, das zur Startseite führt), beschreibe im Alt-Text, wohin der Link führt – nicht nur, wie das Bild aussieht.
- Teste mit einem kostenlosen Screenreader (NVDA, VoiceOver), wie deine Bilder tatsächlich vorgelesen werden, statt einfach anzunehmen, dass dein geschriebener Text auch laut gut klingt.