Checkliste für: Bilder
Hier findest du Erläuterungen zu den einzelnen Anforderungen der WCAG bzw. EN 301 549 und warum sie Teil der Checkliste sind. Zur Liste zum Abhaken kommst du mit einem Klick auf den Button: “Zur Checkliste”.
Die Checkliste
Bilder, die anklickbar sind, brauchen gute Beschreibungen!
Wenn du Bilder als sogenannte Bedienelemente verwendest, wie Icons, die klickbar sind oder Logos, die zur Startseite verlinken, benötigen diese beschreibende Texte im Alt-Attribut.
Zum Beispiel ein Pfeil in einer App, der die Funktion hat, auf die Seite davor zu verlinken, sollte mit „Zurück“ beschrieben sein und nicht mit „Pfeil nach links“.
Die Alt-Attribute von dekorativen Bildern müssen leer sein
Bilder oder Grafiken, die wirklich nur für Layout-Zwecke da sind, benötigen ein leeres Alt-Attribut. Das sorgt dafür, dass diese Bilder von Screenreadern ignoriert werden.
Zu diesen Bildern gehören zum Beispiel Trennstriche oder redundante Icons.
Vermeide Texte in Bildern
Schrift sollte nicht direkt in Bilder eingebaut werden. Ausnahmen: Texte, die essenziell für das Bild sind, zum Beispiel Buch-Cover, Zertifikate, Screenshots.
Zudem ist es erlaubt, wenn die Bilder zur Dokumentation oder Erklärung genutzt werden (wie hier!) oder der Text als Alternative daneben steht.
Kontraste von Texten in Grafiken
Text in oder auf Bildern müssen die Kontrastanforderungen von 4,5:1 erfüllen. Außer der Text ist über 24px groß, dann reicht 3:1.
Verlinkungen auf den BIK-BITV-Tests
Wir verlinken in den Erläuterungen auf die Prüfschritte des BIK-BITV-Tests und nicht der WCAG. Das machen wir, weil es das bekannteste Prüfverfahren ist und weil es für die meisten Menschen einfacher ist, die Prüfschritte zu verstehen und ihnen zu folgen. Die Prüfschritte des BIK-BITV sind nur eine Auslegung der EN 301 549. Es gibt auch andere Prüfverfahren, die legitim sind und als Quelle oder Nachschlagewerk genutzt werden können.