Kostenloses Tool: Barrierefreiheit

Alt-Text-Check für Bilder

Geben Sie eine Seitenadresse ein, um jedes Bild darauf mit seinem Alt-Text aufzulisten, ausgelesen in einem echten Browser, nachdem die Skripte gelaufen sind. Sie sehen, welche Bilder keinen haben, welche als dekorativ markiert sind und welche einen Alt-Text haben, der nichts beschreibt.

Kostenlos. Prüft die eingegebene Adresse in etwa 20 Sekunden.

Was dieses Tool prüft

  • Bilder ohne Alt-Text

    Jedes img-Element und jeder Bild-Button ohne alt-Attribut und ohne anderen zugänglichen Namen, etwa aria-label.

  • Verlinkte Bilder, die einen Link ohne Namen hinterlassen

    Logos und Icons in Links oder Buttons, die weder Alt-Text noch anderen Text haben, sodass ein Screenreader nur „Link“ ansagen kann.

  • Alt-Text, der wie ein Dateiname aussieht

    Werte wie IMG_2041.jpg, DSC0042 oder eine lange Ziffernfolge, die viele Systeme beim Hochladen automatisch eintragen.

  • Allgemeine Wörter

    Ein Alt-Text, der nur „Bild“, „Foto“, „Logo“ oder „Banner“ lautet, sagt niemandem, was das Bild zeigt.

  • Überflüssiger und wiederholter Text

    Beschreibungen, die mit „Bild von“ beginnen, den Linktext daneben wiederholen oder für drei oder mehr verschiedene Bilder verwendet werden.

  • Dekorative und verborgene Bilder

    Bilder mit alt="" oder role="presentation" sowie Bilder, die mit aria-hidden oder CSS verborgen sind, werden getrennt aufgeführt, damit Sie bei jedem bestätigen können, dass es wirklich dekorativ ist.

  • Eine Vorschau jedes Bildes

    Ein Vorschaubild neben dem Alt-Text, sodass Sie jede Beschreibung in Sekunden beurteilen können. Filter zeigen nur die Probleme oder nur das, was zu prüfen ist.

Was es nicht prüfen kann

  • Beurteilen, ob ein Alt-Text zutrifft. Das kann nur ein Mensch, der das Bild sieht und weiß, warum es auf der Seite ist.
  • Bilder prüfen, die als CSS-Hintergrund gesetzt sind, oder Textalternativen für SVG- und Canvas-Grafiken. Das Tool listet img-Elemente und Bild-Buttons auf.
  • Bilder in Frames prüfen, etwa in eingebetteten Videos, Karten und Anzeigen.
  • Mehr als 150 Bilder auflisten. Auf sehr langen Seiten zeigt es die ersten 150 und gibt an, wie viele es insgesamt sind.
  • Andere Seiten testen. Der vollständige kostenlose Scan prüft Alt-Texte zusammen mit den übrigen WCAG-Kriterien auf bis zu fünf wichtigen Seiten.

Warum das wichtig ist

Der Alt-Text ist das, was ein Screenreader anstelle eines Bildes vorliest und was ein Browser anzeigt, wenn ein Bild nicht lädt. Das WCAG-2.2-Erfolgskriterium 1.1.1 der Stufe A verlangt eine Textalternative für jedes Bild, das Informationen trägt, und eine leere für Bilder, die das nicht tun.

Fehlende Alt-Texte sind der zweithäufigste Barrierefreiheitsfehler im Web: Die WebAIM-Analyse 2026 fand sie auf 53,1 % der Startseiten der Top-1-Million-Websites, und 16,2 % aller geprüften Bilder hatten keinen.

Auch Suchmaschinen lesen ihn. Google gibt an, Alt-Texte zusammen mit Computer Vision und dem Inhalt der Seite zu nutzen, um Bilder zu verstehen, und dass der Alt-Text eines verlinkten Bildes wie der Ankertext des Links wirkt.

So lesen Sie die Ergebnisse

Kein Alt-Text
Das Bild hat kein alt-Attribut und keinen anderen Namen. Je nach Software liest ein Screenreader den Dateinamen vor oder überspringt das Bild.
Dekorativ
alt="" oder role="presentation": Screenreader überspringen das Bild. Richtig für Dekoration; falsch für ein Bild, das Informationen trägt oder der einzige Inhalt eines Links ist.
Hat Alt-Text
Das Bild hat eine Beschreibung. Wir markieren die, die falsch aussehen; bei den übrigen muss trotzdem ein Mensch prüfen, ob sie zutreffen.
Name über ARIA oder title
Kein alt-Attribut, aber ein Name aus aria-label, aria-labelledby oder title. Das besteht automatisierte Tests; alt bleibt trotzdem die zuverlässigere Wahl.
Verborgen
Nicht angezeigt oder mit aria-hidden vor assistiven Technologien verborgen. Nichts zu beheben, es sei denn, das Bild soll sichtbar sein.
Link ohne Namen
Ein Link oder Button, dessen einziger Inhalt ein Bild ohne Textalternative ist. Das ist ein Fehler, selbst wenn das Bild selbst dekorativ ist.
Prüfen
Alt-Text, der wie ein Dateiname oder ein allgemeines Wort aussieht, mit „Bild von“ beginnt, den Linktext wiederholt, sehr lang ist oder für mehrere Bilder verwendet wird.

So beheben Sie die häufigsten Probleme

  • Produkt- und Inhaltsfotos

    Beschreiben Sie im Kontext der Seite, was jemandem ohne das Bild entgehen würde. Bei einem Produkt: der Artikel, seine Farbe und die gezeigte Ansicht. Bei einem Artikelfoto: was es zeigt, das der Text nicht sagt.

  • Logos, die zur Startseite führen

    Ein verlinktes Bild sollte sagen, wohin der Link führt. Bei einem Logo, das zur Startseite verlinkt, verwenden Sie den Firmennamen, zum Beispiel alt="Acme Startseite", statt „Logo“.

  • Icons in Links und Buttons

    Geben Sie dem Icon einen Alt-Text, der die Aktion nennt, etwa „Suche“ oder „Warenkorb“, oder geben Sie dem Link ein aria-label und markieren Sie das Icon mit alt="" als dekorativ.

  • Dekorative Bilder

    Verwenden Sie alt="" (einen leeren Wert, kein fehlendes Attribut) für Trennlinien, Hintergrundverzierungen und Bilder, die Text direkt daneben wiederholen.

  • Dateinamen, die Ihre Plattform einträgt

    Viele Plattformen kopieren beim Hochladen den Dateinamen in das Alt-Feld. Ändern Sie ihn dort, wo das Bild verwaltet wird: in Shopify bei den Medien des Produkts, in WordPress im Feld „Alternativer Text“ der Mediathek.

  • Diagramme und Infografiken

    Geben Sie einen kurzen Alt-Text, der sagt, was das Diagramm zeigt, und stellen Sie die Daten oder eine Zusammenfassung in den Text oder in eine Tabelle daneben.

Bilder ohne Alternativtext: so beheben Sie das in Shopify, WooCommerce und auf jeder Website

Fragen zu diesem Tool

Was ist ein Alt-Text?

Das alt-Attribut eines Bildes enthält seine Textalternative. Screenreader lesen sie vor, und Browser zeigen sie an, wenn das Bild nicht dargestellt werden kann.

Sollte jedes Bild einen Alt-Text haben?

Jedes img-Element sollte ein alt-Attribut haben. Bei einem Bild, das Informationen trägt, beschreibt es das Bild; bei einem dekorativen Bild sollte es leer sein (alt=""), damit Screenreader es überspringen.

Wie lang sollte ein Alt-Text sein?

WCAG legt keine Grenze fest. Ein guter Alt-Text ist meist eine kurze Wortgruppe oder ein Satz. Braucht ein Bild mehr, beschreiben Sie es im Seitentext oder in einer Bildunterschrift und halten Sie den Alt-Text kurz. Alt-Texte über 150 Zeichen markieren wir für einen zweiten Blick.

Hilft Alt-Text bei der SEO?

Google gibt an, Alt-Texte zusammen mit Computer Vision und dem Inhalt der Seite zu nutzen, um Bilder zu verstehen, und dass der Alt-Text eines verlinkten Bildes wie Ankertext wirkt. Google warnt auch, dass mit Keywords vollgestopfte alt-Attribute als Spam gewertet werden können.

Ist das title-Attribut dasselbe wie alt?

Nein. title erscheint als Tooltip, wenn man mit der Maus darüberfährt, wird von Screenreadern nicht zuverlässig angesagt und ist auf Touchscreens nicht verfügbar. Automatisierte Tests akzeptieren es als Namen, wenn alt fehlt, aber alt ist die verlässliche Wahl.

Kann KI meine Alt-Texte schreiben?

Sie kann Beschreibungen entwerfen, weiß aber nicht, warum das Bild auf Ihrer Seite ist. Prüfen Sie jeden Entwurf: Der richtige Alt-Text hängt von einem Kontext ab, den nur Sie kennen.

Quellen

Verwandte Tools

Der Barrierefreiheits-Report ($174, einmalig) baut auf dem vollständigen kostenlosen Scan auf und ergänzt weitere Seiten, die nötige Änderung für jeden Befund, ein PDF und Nachtests, mit denen Sie Ihre Korrekturen überprüfen.

Mehr zum Barrierefreiheits-Report