Alt-Text schreiben
Alternativtexte scheitern selten am Formulieren. Sie scheitern an der Frage, welche Rolle das Bild überhaupt hat – und die Antwort ändert alles, bis hin zum richtigen Markup.
Welche Rolle hat das Bild?
Das ist die Frage, an der die meisten Alternativtexte scheitern – nicht das Formulieren.
Es zeigt etwas Wichtiges
Beschreibe, was zu sehen ist – und zwar das, worauf es an dieser Stelle ankommt. Nicht jedes Detail, sondern die Aussage.
Beispiel: Werkstattmeister repariert die Gangschaltung eines Rennrads
Sichtbar für alle – der Alternativtext nur für Screenreader.
- Noch kein Text eingetragen.
<img src="bild.jpg" alt="" width="" height="">
Die Maße in width und height sind absichtlich leer gelassen: Trag dort die tatsächlichen Pixelmaße ein. Ohne sie springt der Text beim Laden, sobald das Bild eintrifft.
Was dieses Werkzeug nicht tut
Es beschreibt dein Bild nicht. Dafür bräuchte es einen Bilderkennungsdienst, an den das Bild geschickt würde – und auf dieser Seite verlässt nichts deinen Rechner. Ein Werkzeug, das „Ein Bild mit blauem Hintergrund“ ausspuckt, wäre ohnehin keine Hilfe.
Es führt stattdessen durch die Entscheidung, die tatsächlich schwerfällt, und prüft anschließend, was du geschrieben hast.
Der häufigste Fehler
Ein weggelassenes alt-Attribut bei einem Zierbild. Viele denken: Wenn das Bild nichts aussagt, lasse ich es weg. Das Gegenteil passiert – Screenreader lesen dann den Dateinamen vor. Aus einem Trennstrich wird „i-m-g-unterstrich-2-0-2-6-null-drei-punkt-j-p-g“. Richtig ist ein ausdrücklich leeres alt="".
Alt-Text oder Bildunterschrift?
Die Bildunterschrift sehen alle, der Alternativtext nur Screenreader und Suchmaschinen. Beide dürfen sich ergänzen, sollten sich aber nicht wortgleich wiederholen – sonst hört man denselben Satz zweimal.
Ob deine Seite Bilder ohne Alternativtext ausliefert, sagt dir der Seiten-Check – über die ganze Website hinweg der Crawler.