Image Alt Checker: Alt-Texte einer Seite prüfen
Kostenloser Einzelcheck · ohne Anmeldung
Finden Sie fehlende, leere und auffällige Alt-Attribute im HTML einer URL. Nutzen Sie die Bildliste zur Überarbeitung im CMS und beurteilen Sie jedes Bild anhand seiner tatsächlichen Aufgabe.
- alle gefundenen <img>-Elemente
- fehlendes alt-Attribut
- leere Alt-Texte alt=""
- generische oder sehr schwache Alt-Texte
- Dateiname als Alt-Text
- dekorative Bilder und Lazy-Load-Bilder
- Produkt-, Teaser-, Hero- und Content-Bilder mit hohem SEO-/UX-Wert
- Hinweise für CMS-Felder, Templates und redaktionelle Pflege
| Bild | Alt-Text | Bewertung | Hinweis |
|---|---|---|---|
| — | |||
Fehlende Alt-Texte finden und passend ergänzen
Welche Bilder und Angaben der Check erfasst
Der Server ruft eine Seite ab und untersucht deren img-Elemente. Gezeigt werden Bildadressen, Alt-Texte und regelbasierte Hinweise, etwa zu fehlenden Attributen, generischen Texten oder Dateinamen. CSS-Hintergrundbilder und erst durch JavaScript erzeugte Bilder können fehlen. Das Motiv selbst wird nicht mit KI erkannt; das Tool kann nicht bestätigen, dass eine Beschreibung zum sichtbaren Bild passt.
Fehlend, leer oder dekorativ: den Befund unterscheiden
Ein fehlendes alt-Attribut ist etwas anderes als alt="". Für reine Dekoration ist ein leeres Attribut häufig richtig. Der Checker schätzt dekorative Nutzung anhand von HTML-Merkmalen wie Rollen, Klassen oder Größenangaben. Diese Einordnung kann falsch sein. Prüfen Sie insbesondere kleine Icons manuell: Ein kleines Bild kann trotzdem eine wichtige Funktion vermitteln.
Alt-Texte nach der Aufgabe des Bildes schreiben
Bei einem informativen Bild sollte der Text die wesentliche Information im Seitenkontext vermitteln. Bei einem Bild als Link oder Schaltfläche ist die Funktion beziehungsweise das Ziel entscheidend. Komplexe Diagramme benötigen oft zusätzlich eine ausführliche Erklärung im sichtbaren Inhalt. Wiederholen Sie keine bereits ausreichende Beschriftung und setzen Sie keine Keyword-Liste ein.
Wiederkehrende Fehler im CMS beheben
Wenn viele Bilder ohne Alt-Attribut erscheinen, prüfen Sie zuerst Bildfelder und die Ausgabe im Template. Fehlt das Attribut nur bei einzelnen Inhalten, kann eine redaktionelle Ergänzung genügen. Testen Sie nach der Änderung mehrere Seitentypen und auch mobile Darstellungen. Ein unauffälliger Einzelcheck ersetzt keine vollständige Prüfung der Barrierefreiheit.
Ein Produktbild sinnvoll beschreiben
Praxisbeispiel · zur Veranschaulichung
Ausgangslage
Prüfen Sie die Produktseite mit einem Bild einer blauen Keramiktasse.
Befund einordnen
Fehlendes alt und alt="" sind unterschiedliche Befunde: Ein leeres Attribut kann für reine Dekoration richtig sein.
Konkrete Änderung
Für ein inhaltlich relevantes Produktbild die entscheidende Information knapp beschreiben, etwa „Blaue Keramiktasse mit Henkel“. Keine Keyword-Liste einsetzen.
Kontrolle und Grenze
Ausgabe im HTML und Bedeutung im Kontext prüfen. Das Vorhandensein eines alt-Attributs beweist noch keine gute Beschreibung.
W3C WAI: Entscheidungshilfe für Alt-Texte
Fragen zu Nutzung und Grenzen
Braucht jedes Bild einen beschreibenden Alt-Text?
Nein. Dekorative Bilder können alt="" erhalten. Informative und funktionale Bilder brauchen eine zum Kontext passende Alternative; die Entscheidung lässt sich nicht allein aus der Dateigröße ableiten.
Kann der Checker gute Alt-Texte automatisch erkennen?
Er erkennt ausgewählte Muster, nicht die Bedeutung des Motivs. Auch ein unauffälliger Text kann inhaltlich falsch sein. Vergleichen Sie ihn mit dem Bild und seiner Aufgabe auf der Seite.
Warum wird ein kleines Icon als dekorativ eingestuft?
Die Einordnung nutzt unter anderem HTML-Merkmale und Größenangaben als Hinweise. Ein Icon, das allein einen Link oder Button erklärt, muss trotzdem funktional zugänglich beschriftet sein.
Warum fehlt ein sichtbares Bild in der Ergebnisliste?
CSS-Hintergründe oder per JavaScript nachgeladene img-Elemente können im abgerufenen HTML fehlen. Kontrollieren Sie in diesem Fall zusätzlich die gerenderte Seite.