barrierefrei·Newsletter

vom 01. bis 24. Dezember als Adventskalender
Barrierefreie Farbkombinationen. Darüber ein Feld mit der Zahl 12, verziert mit Schneeflocken.
9 von 10 Websites haben einen zu schwachen Kontrast zwischen Text und Hintergrund. Die Lesbarkeit wird damit vor allem für Menschen mit verringertem Sehvermögen erschwert. Ein deutlicher Kontrast erhöht den Komfort aber natürlich für alle Seitenbesucher:innen.
Zu dieser Zahl kam die gemeinnützige Organisation WebAIM, die zum Center for Persons with Disabilities an der Utah State University gehört. In ihrem Projekt The WebAIM Million untersuchen sie jährlich die Barrierefreiheit von einer Millionen Websites. Wie diese Auswahl zustande kommt und was wie untersucht wurde, kannst Du dem verlinkten Bericht (auf englisch) entnehmen.
Die erschreckendste Zahl dabei ist sicherlich, dass nicht einmal 2% der untersuchten Websites vollständig barrierefrei sind! Barrierefrei ist eine Website dann, wenn sie die Richtlinien für barrierefreie Webinhalte (WCAG) 2.0 erfüllen. Im Abstract zu den Richtlinien heißt es:
Die Richtlinien für barrierefreie Webinhalte (WCAG) 2.0 decken einen großen Bereich von Empfehlungen ab, um Webinhalte barrierefreier zu machen. Wenn Sie diesen Richtlinien folgen, dann werden Inhalte für eine größere Gruppe von Menschen mit Behinderungen barrierefrei sein.
(...)
Darüber hinaus wird das Befolgen dieser Richtlinien Ihre Webinhalte in vielen Fällen für Nutzer im Allgemeinen benutzbarer machen.

86,3% der Websites besitzen ein zu geringes Kontrastverhältnis

Das verbreitetste Problem stellt der Kontrast zwischen Text und Hintergrund dar. Das ist allerdings auch eine Sache, die jede:r mit einer eigenen Website selbst und in den meisten Fällen sehr einfach beheben kann. Oder wie ich es sage: #EineBarriereWeniger.
Für die Darstellung auf Bildschirmen ist in der WCAG die Berechnung des Kontrastverhältnisses geregelt. Die Bandbreite reicht von 1 (weiß auf weiß) bis 21 (schwarz auf weiß). Die Untergrenze für einen ausreichend starken Kontrast liegt bei 4,5. Für Texte kleiner als 17pt liegt er sogar bei 7,0.
Ich zeige Dir mal ein paar Beispiele. Der Hintergrund des folgenden Abschnitts ist weiß. Den Text werde ich in sieben unterschiedlichen Farben angeben und dabei von einem Kontrastverhältnis von 21 (schwarzer Text) zu 1 (weißer Text) gehen.
#EineBarriereWeniger (K=21,0)
#EineBarriereWeniger (K=13,5)
#EineBarriereWeniger (K=7,0)
#EineBarriereWeniger (K=4,0)
#EineBarriereWeniger (K=2,0)
#EineBarriereWeniger (K=1,1)
#EineBarriereWeniger (K=1,0)

Jetzt selbst aktiv werden

Die richtigen Kontraste sind natürlich nicht nur bei Websites wichtig, sondern zum Beispiel auch bei allen Bild- und Videoinhalten auf Social Media. Wie hoch das Kontrastverhältnis zwischen zwei Farben ist, kannst Du super einfach und kostenlos mit dem Kontrastrechner von leserlich.info überprüfen.
Schau Dir doch einfach mal die Farben an, die Du regelmäßig verwendest. Ist das Kontrastverhältnis hoch genug? Wenn nicht, dann kannst Du mit dem Kontrastrechner mal ein wenig rumprobieren, welche Farbe einen besseren Kontrast bietet.
Viel Spaß dabei!
P.S.: Meine Farben haben zueinander übrigens ein Verhältnis von K=8,9 👍
Ich wünsche Dir heute einen farbenfroh bunten Samstag
Dein Martin
Du erhältst diesen Adventskalender, weil Du Dich für den barrierefrei·Newsletter angemeldet hast. Falls Du nur den montags erscheinenden Newsletter erhalten möchtest, kannst Du hier Deine Einstellungen anpassen. Der nächste reguläre Montags-Newsletter erscheint am 30. Dezember.

barrierefrei·Newsletter

twitter instagram linkedin