Warum Webdesigner oft zu tiefe Kontraste verwenden: Schuld sind die Bildschirme!

In unseren Kunden-Projekten erleben wir häufig, dass Texte und Elemente von Websites schlecht erkennbar sind, weil sie einen zu geringen Kontrast zum Hintergrund haben. Ein Grund dafür könnte sein, dass Webdesigner oft mit sehr hochqualitativen Bildschirmen arbeiten. Bei diesen Bildschirmen sind auch geringe Kontraste noch gut sichtbar. Darum haben wir die Probe aufs Exempel gemacht.

Wie gross ist der Unterschied zwischen einem Mac-Bildschirm und einem gewöhnlichen ASUS-Bildschirm? Um das herauszufinden haben wir:

  • beide Bildschirme auf die Standard-Einstellungen zurückgesetzt
  • die Seite Contrast Ratio von Lea Verou angezeigt
  • und dann die Bildschirme fotografiert

Hier die Ergebnisse:

Kontrast-Wert 4.5:1. Links: Mac-Bildschirm, Rechts: Asus-Bildschirm. Noch nicht so grosse Unterschiede in der Erkennbarkeit.
Kontrast-Wert 4.5:1. Links: Mac-Bildschirm, Rechts: Asus-Bildschirm. „How to use“ ist auf beiden relativ gut sichtbar.
Kontrast-Wert 2.2:1. Links: Mac-Bildschirm, Rechts: Asus-Bildschirm. Schlechterer Kontrast rechts ist klar sichtbar.
Kontrast-Wert 2.2:1. Links: Mac-Bildschirm, Rechts: Asus-Bildschirm. „How to use“ ist rechts deutlich schlechter lesbar.

Auf dem Mac-Bildschirm sieht der weisse Hintergrund weiss aus. Auf dem Asus-Bildschirm hingegen sieht der Benutzer die Schrift wie durch einen Schleier, der die Kontraste abdämpft. (Auf diesen Fotos sieht der Unterschied noch relativ harmlos aus, in “echt” sieht es noch dramatischer aus.)

Fazit

Es ist wichtig, dass Webdesigner ihre Designs auf Hardware testen, die auch vom Zielpublikum verwendet werden. Damit die schlechten Kontraste einem stärker auffallen auf hochqualitative Bildschirmen, wie Mac-Bildschirmen, wird weiss als leuchtendes weiss dargestellt. Benutzer haben aber oft ältere und günstigere Bildschirme zuhause, welche Kontraste weniger klar darstellen. Elemente, die auf professionellen Bildschirmen gut sichtbar sind, können auf “normalen” Bildschirmen nur schlecht erkennbar sein.

Mehr dazu wie man schlechte Kontraste vermeidet:  2 Tools für gute Kontraste, damit Texte wieder lesbar werden

Andreas Bossard

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.