Mein Corporate Design sagt aber...

... hoffentlich dazu nichts. Viele Unternehmen haben ein Corporate Design. Darin sind Schriften festgelegt, Farben die verwendet werden dürfen für Text und für Hintergründe genauso wie Formate und Logo-Anwendungen. Das alles ist auch in Ordnung so, aber es darf - niemals - den Grundsätzen für eine barrierefreie Umsetzung einer Webseite widersprechen. Ansonsten machen Sie bitte nicht Ihre Webseite neu, sondern Ihr Corporate Design.

Betroffen von Farbkontrasten

Es ist ein lästige Diskussion, wenn Webseiten entwickelt werden und der Designer eine besonders schön abgestufte Version mit verschiedenen sehr harmonisch zueinander passenden Farben entwickelt hat. Aber es ist keine gute Idee eine Webseite so umzusetzen, dass man den Inhalt - letztlich soll der Ihre Kunden überzeugen - nur auf qualitativ hochwertigen Bildschirmen auch einigermaßen gut lesen kann. Und noch ein wichtiger Faktor: Selbst gute Bildschirme schützen Ihren vor dem Bildschirm sitzenden Kunden nicht vor einer möglichen Sehschwäche, schlechter Raumbeleuchtung...

Barrierefreie Farbkontraste - und der Hausverstand

Eines der wichtigsten Hilfsmittel für barrierefreie Farbkontraste ist er. Oder sie. Wie auch immer Sie diese fiktive Person in Ihrem Leben nennen wollen. Wir nennen diese Person jetzt einfach "Hausverstand". Dieser Hausverstand sagt Ihnen schon viel. Beispielsweise, dass Ihre potentiellen Kunden sich lieber eine andere Webseite von Ihrem Mitbewerb ansehen werden, wenn man den Text dort besser lesen kann als bei Ihnen. Der Hausverstand sollte aber noch mehr können. Und es ist keine erfundene Geschichte:

Farbkontraste und Onlinebanking: Es ist tatsächlich so, dass ein namhaftes Bankinstitut in Österreich als dominante Corporate-Design-Farbe grün hat. Wir nennen das Geldinstitut hier nicht, weil man dort inzwischen dieses Problem behoben hat und das Corporate Design angepasst hat. Was war de facto der Fall?
Das Online-Banking hatte einen durchgehenden grünen Hintergrund. Lastschriftbuchungen oder negative Kontostände wurden in Zahlen mit "-" davor angezeigt und damit man sie besser sieht... waren sie rot. Rot/Grün-Sehschwächen gehören zu den am meisten verbreiteten Sehschwächen /Fachbegriff dafür ist "Deuteranomalie" oder "Deuteranopie") überhaupt. Eine Umsetzung, die sich definitiv nicht nur Freunde gemacht hat...

Wie werden Farbkontraste geprüft?

Wenn Sie einen Farbkontrast prüfen möchten, können Sie das mit Hifle von diversen Internet-Seiten tun. Es gibt etliche Anbieter, die solche Vergleichstools anbieten. Damit eine seriöse Auswertung entsteht, wird meist der Farbwert ("Hexadezimal-Code") der Vordergrundfarbe (also der Textfarbe) und der Farbwert der Hintergrundfarbe erfragt. Außerdem wollen diese Vergleichssysteme noch die Textgröße wissen. Warum das so ist? Die Textgröße selbst hat auch Einfluss auf die Lesbarkeit, das ist jetzt nicht überraschend. Aber in den meisten Staaten so wie auch in der Europäischen Union gelten die Regeln der sogenannten Web Accessibility Initiative (WAI) für etwaige juristische Definitionen in Sachen Barrierefreiheit und Behindertengleichstellung bzw. Diskriminierung. Und in diesen Richtlinien der Initiaitve (die wichtigsten für Webseiten nennen sich WCAG - Web Content Accessibility Guidelines) ist das Mindest-Kontrastverhältnis kombiniert mit der Textgröße versehen.

Es kann also durchaus sein, dass ein Farbkontrast etwa grauer Hintergrund unter schwarzem Text noch nach WCAG ausreichend ist, wenn dieser nur für Überschriften verwendet wird, die eine bestimmte Größe haben. Aber möglicherweise reicht dieser Kontrast nicht mehr aus, wenn sie diesen Hintergrund auch unter den normalen Fließtext einziehen.

Welches Kontrastverhältnis ist wichtig?

Es gibt zwei Kontrastverhältnisse, die man sich ansehen sollte. Einerseits das Kontrastverhältnis zwischen Vordergrund und Hintergrund. Das ist die logische Variante, denn der Kontrast zwischen dem Text und der Farbe des Untergrundes auf dem der Text steht, ist für jeden nachvollziehbar relevant.

Ein zweites wichtiges Kritierum beim Ermitteln der nötigen Kontrast-Verhältnisse ist aber auch die Wechsel-Vorgehensweise zwischen Vordergrund und Vordergrund bzw. zwischen Hintergrund und Hintergrund. Gemeint ist damit die sogenannte "Link-Contrast-Ratio". Die wird einfach so benannt, weil das häufigste Auftreten der Einsatz von "Links" im Internet ist. Und zwar besonders dann, wenn ein Link außer seiner Farbe keine weiteren "Eigenschaften" hat. (Daher ist es ganz gut und sinnvoll Links entsprechend zu unterstreichen, damit nicht nur die Farbe den Ausschlag darüber gibt, dass hier ein Link ist.) Wenn Sie mehr über diese Farbkontraste wissen wollen, wir haben die Kontrast-Verhältnisse auf einer eigenen Seite erklärt. Was ist sonst noch über Kontraste zu wissen gibt, finden Sie wenn Sie zum zweiten Teil dieses Artikels scrollen mit dem hier stehenden Button.

Thema fertiglesen...

Alles rund um barrierefreie Internetseiten

Barrierfreie Webseite - mit Farbkontrasten

(c) videomar.at

Farbversionen?

Die Idee ist nicht, dass man eine nicht barrierefreie Webseite macht und dann Farbkontraste benutzt um sie doch noch barrierefrei zu bekommen - es geht um mehr und das mit einem anderen Hintergedanken.

Farbkontraste

Wie Blinde das Web nutzen?

(c) videomar.at

Blinde Internet-Nutzer

Die Audioausgabe ist manchmal nervig, vor allem kann sie in einem Büro stören, weil dann viele Stimmen durcheinander sprechen. Mit der Braille-Zeile kann man aber auch im Internet unterwegs sein.

Web in Braille-Schrift

Suchmaschinen sind blind!

(c) videomar.at

SEO Barrierefrei?

Zum Thema Barrierefreie Internetseiten: Acuh Suchmaschinen sind blind, sie können nichts mit Richtungsangaben anfagen und benötigen ein funktionierendes HTML-Markup. Es hilft Ihnen, wenn es barrierfrei ist.

Optimieren für Suchmaschinen

Eine Barrierefreie Seite ist nicht altbacken!

(c) Pereanu Sebastian on Unsplash

Altbacken weil Barrierefrei?

Nein, barrierefreie Webseiten sind nicht altbacken. Sie müssen nicht daherkommen, wie eine Schreibmaschine neben einem Smartphone, denn barrierefreie Webseiten sind durchaus auch modern. Überzeugen Sie sich.

Keine Angst!

Farbkontrast-Umschalter im Web

Viele verschiedene Seiten haben sogenannte "Farbkontrast-Schalter". Die unprofessionellste Idee dahinter ist es einfach die komplette Webseite im reinen Textmodus mit einer Farbe im Vordergrund und einer Farbe im Hintergrund darzustellen. Das hilft, dankenswerter Weise, zumindest jenen, die die "Originalversion" nicht lesen können.

Eine "alternative Version" für eine barrierefreie Darstellung darf man übrigens auch nach den WCAG erstellen. Das gilt aber nur, wenn absolut beweisbar ist, dass eine normale barrierefreie Webseite dem Betreiber nicht zuzumuten wäre. Das beweisen Sie bitte dann ohne uns zu zitieren vor Gericht im Fall der Fälle...

Grundsätzlich sollte Ihre Webseite also schon auch mit barrierefreiem Kontrast in der Grundeinstellung vorhanden sein. Trotzdem können diese Farbkontrast-Umschalter für einige Ihrer Kunden nützlich sein. In der "fortgeschrittenen Variante" solcher Umschalter werden nämlich zwei wichtige Dinge berücksichtigt:

  • Darstellende Fotos, die den Inhalt begleiten, bleiben unverändert sichtbar.
  • Das grundsätzliche Layout der Seite bleibt 1:1 erhalten.

Und hier hat der Umschalter einen ganz einfachen Sinn. Er soll den Kontrast nicht nur erhöhen, sondern auch helligkeitsmässig anpassen. Darum werden oftmals, wenn es richtig gemacht wird, Blau-Weiss und Schwarz-Gelb-Varianten angeboten, weil dies extrem starke optische Kontraste sind.

Wer mit Betroffenen spricht - und das haben wir im Rahmen dieser Idee getan -, die ein sehr eingeschränktes Sehvermögen haben, wird lernen, dass diese Menschen eine Sache bewegt: Sie wollen Bilder sehr wohl betrachten können, die sind sogar sehr wichtig für sie. Problematisch ist nur, wenn ein Hintergrund zu dunkel oder zu hell ist - daher ist es gut und richtig die Kontrastschalter anzubieten, aber was ein tatsächliches Bild (nicht eine Grafik, ein Diagramm oder ein Logo, sondern gemeint ist ein Foto) ist, sollte unverändert sichtbar bleiben.

Konsequent bleiben bei Farbkontrasten

Ein wichtiger Aspekt bei Farbkontrasten ist, dass man dabei sehr konsequent bleibt. Da nicht klar ist für den Anbieter der Webseite mit welcher Vergrößerung - beispielsweise per "Bildschirmlupe" - die Person vor der Webseite agiert, sollten auch kleinere Flächen nicht "invertiert" werden. Was eine Fläche ist (zB ein Absende-Button eines Formulares) sollte nicht bei einer Kontrasteinstellung mit schwarzem Hintergrund und gelbem Text plötzlich eine gelbe Fläche mit schwarzer Beschriftung sein. Eine solche Fläche umrahmt man mit der Vordergrundfarbe, behält die Hintergrundfarbe und beschriftet in der Vordergrundfarbe. Mehr dazu kann man auch auf einer Webseite des "Funktionssets" »easy2see« für mehr Barrierefreiheit nachlesen.

Kurz gesagt: Jeder zu lesende Text ist in der Vordergrundfarbe und jeder Text hat als Hintergrundfarbe die definierte Hintergrundfarbe.

Sie wissen nicht ob schwarz oder weiß?

Wenn Sie es noch nicht wissen, ob Sie einen dunklen oder einen hellen Hintergrund haben werden, können wir Ihnen - mit einem Augenzwinkern - eine Antwort geben auf die Frage: Was ist die beste Farbe im Internet?

Startseite Inhaltsverzeichnis

Empfehlungen und Tipps

Werbeplatzierungen auf Domain-Landing-Pages

Sponsored Content

Diese Box für 59,-

Wenn Sie hier Ihr Bild, Ihre Überschrift, Ihren Text und Ihren Link-Button habern möchten, können Sie diese Fläche für nur 59,- Euro pro Jahr oder 5,90 Euro pro Monat buchen. Mehr über unser Netzwerk hier.

Onlinewerbung buchen!

Afterwork in Wien

Sponsored Content

Afterwork mit Italo-Flair

Nach dem Büro auf ein paar Gläser der besseren Version von Prosecco? Mit dem Pignloetto Frizzante im 1. Bezirk in Wien den Arbeitstag im Co-Working-Space mit Freunden und Kollegen ausklingen lassen.

Civediamo

Weiterführende Links

Einladungsmanagement und Gästelistenmanagement
Einladungsmanagement

Einladungsmanagement und Gästelisten verwalten auf ganz einfache Art und Weise mit einem professionellen Tool. Keine Software muss installiert werden, einzig und allein ein Webbrowser genügt.

Einladungsmanagement

Tourismusinfo für Wien, Bratislava, Prag und Budapest
Centrope-Region

Erleben Sie die Centrope-Region mit Wien, Bratislava, Prag und Budapest. Interessante Tipps für Reisen, Kultur und natürlich auch Shopping. Einfach reinklicken und die Region einmal kennen lernen.

RegioTours