Farbe und Screendesign

von Fries Websolutions

Bildschirmarbeit ist sehr ermüdend, das ist jedem bekannt. Weniger bekannt ist aber, das ein gezielter Farbeinsatz im Bildschirmdesign die Augenbelastung deutlich reduziert und die Benutzerführung verbessern kann.

Die Grundlagen hierfür sind in vier Schritten aufbereitet: Von der Farbwahrnehmung über Farbeigenschaften und auch ihre Wirkung bis hin zur Farbpsychologie und dem Bildschirmsystem RGB.

A: Farbwahrnehmung und das Auge
Farben sind ein Teil des Lichts, und werden von dem Auge wahrgenommen und im Gedächtnis gespeichert. Ein Farbeindruck entsteht durch einen Lichteinfall im Auge, der wandelt es auf der Netzhaut. Je nach dem wie das Licht einfällt, öffnet oder schließt sich die Linse des Augapfels. Es wird dadurch die Lichtmenge reguliert, und die Netzhaut stellt das Bild scharf. Es sind die Nervenzellen, die die Farben, Kontraste und Strukturen unterscheiden.

Bei den unterschiedlichen Wellenlängen von Farben, werden im Auge unterschiedlich starke Reize ausgelöst. Das Auge wird vom Gehirn angesteuert. Denn alles was wir sehen, geht sofort zum Gehirn und zurück. Wobei weißes Licht am stärksten ist.

Bei den Bildschirmwahrnehmung gleicht es einem "Blitzlichtgewitter" für das Auge und und dem Gehirn. Die Reize erfolgen direkt, denn die Monitorfarben strahlen direkt ins Auge.

Farbempfindung

B. Farbempfindung und Psyche
Farben wecken aber auch Empfindungen. Das Rot empfinden wir als warm und aktiv. Gelb als anregend , Energie geladen und heiter. Grün als beruhigend und harmonisch. Blau als kalt und ruhig. Braun wird als  langweilig. Je nach einem Farbton kann das  Empfinden schwanken:

1. Farben sind wie Stimmungsmacher. Geheime Energien. In der Mode und Werbung wird dieses Wissen intensiv genutzt.
2. Farbgefühl ist auch an die sinnliche Eindrücke gekoppelt - wie zum Beispiel schmecken und riechen.
3. Die Farbbedeutung erlernen wir in der Natur und der Kultur.
4. Farbe ist nicht gleich Farbe (Blau ist nicht gleich Blau).

C. Farblehre: Farbeigenschaften und ihre Wirkung im Design
Bisher haben wir die Farben an sich unterschieden: Rot, Gelb, Blau, Grün, Orange – jede kann aber in sich ganz unterschiedlich sein.

Kalt/warm -Kontrast
Vergleichen Sie: Tomatenrot mit Purpurrot, Dottergelb mit Zitronengelb, Apfelgrün mit Flaschengrün
Also eine warme Farbe und eine grelle Farbe.

Helligkeitskontrast
Unabhängig vom einem Farbton können Farben verschiedene Helligkeitswerte haben. Gelb ist heller als Rot, grün heller als Violett. Jede der Farben kann in sich kann heller oder dunkler gemacht werden.

• Gestaltungshinweise:
  Helligkeitskontrast sorgt für eine gute Lesbarkeit.
  bei hellen Farben meint man sie sind vorne, dunkle hingegen weichen zurück.

Qualitäts- oder Sättigungskontrast
Damit ist die Buntheit einer jeden der Farbe gemeint: pur, satt, ungemischt. Aber desto höher die Farbsättigung, desto stärker ist auch die Augenbelastung am Monitor. Daher sind die Pastelligen Fonds sehr beliebt.

Komplementärkontrast
Wenn Farbpaare in ihrer Wirkung gegensätzlich sind, z.B. Rot und Grün; Blau und Orange; Gelb und Violett nennen man das komplementär. wenn sie in unmittelbarer Nachbarschaft zueinander stehen, steigern sie sich.

• Gestaltungstipp:
  Komplementäre Farben sind sehr aufmerksamkeitsstark. Sie belasten daher die Augen.

Simultankontrast
Er hat mit der Gleichzeitigkeit von Gegensatz in dem Sehprozess zu tun. Denn ein reines Grau wirkt auf einem knallroten Hintergrund grünlich, aber bei einem orangenfarbenen Hintergrund wirkt es bläulich-grau. Denn das Auge projiziert hier die Komplementärfarbe, sie können es ausprobieren. So können sie dann Ihrem Kunden erklären, warum ein feines Gelb seiner Website seltsam grünlich vorkommt, und zwar in Unabhängigkeit von der Bildschirmwiedergabe.

Menge, Proportion, Raumverhalten
Das Raumverhalten von Farben richtet sich vor allem nach dem Hell und Dunkel und dem Kalt und Warm-Bezügen einer Farbe. Warme Farben kommen dem Betrachter entgegen, wobei kalte Farb-Töne eher zurück weichen.

Hier die Zusammenfassung der Farbeigenschaften

Jede Farbe kann man in fünffacher Weise verändern.
1. In Charakter  - warm oder kalt .
2. In der Helligkeit - zu Schwarz oder Schwarz.
3. In der Qualität - Satt oder getrübt.
4. Durch ihr Umfeld - Die Hintergrundfarbe beeinflusst.
5. Durch Proportion / Menge und Größe.

D. RGB: Screen versus Papier, RGB und CMYK
Farben setzen sich am Bildschirm aber anders zusammen, als auf Papier.

Die vollen Primärfarben Rot /Grün/Blau = RGB des Bildschirms ergeben zusammen Weiß.

Achtung: Farbiges Papier verändert die Farbwiedergabe. Eine Bildschirmdarstellung gleicht in gar keinem Fall einem Druckergebnis. Ausdrucke auf Papier sind generell nur in CMYK möglich.

Die Aufgabe von Farbe am Bildschirm ist, den Inhalte zu visualisieren

1. Wieder Erkennbarkeit eines Erscheinungsbildes
2. Gute Lesbarkeit von Text und Bild
3. Navigation und Benutzerführung durch systematischen Farbeinsatz
4. Animation und Zielgruppenansprache.

Noch ein Wort zu der Beliebtheit von Farben
Nicht nur in der Mode, sonder auch im Marketing wechselt der Rang von Farben. Denn seit einigen Jahren steht bei uns Blau ganz oben auf der Beliebtheitsskala, gefolgt von Rot.

Zum Schluss ein paar Regeln und Tipps zum Umgang mit Farben am Monitor.

1. Weniger ist nicht immer mehr. Viele Farben lenken ab. Wirksamer ist ein bestimmtes Farbschema 
2. Augenfreundlich gestalten
3. Farben Gleichheit, wo man Lesen muss
4. Gute Lesbarkeit braucht einen Hell-Dunkel-Kontrast
5. Inhaltsbezug und Zielgruppen berücksichtigen
6. Farbmengen. Warme, helle Farben zurückhaltend und gezielt einsetzen
7. Farben aus den 256 Bildschirmfarben wählen (Speicher und Ladezeit)
8. Schrift und Farbe
9. Schwarz auf Weiß ergibt ein sehr klares Schriftbild

Tipps zum Einsatz für Farbklima und die Harmonisierung am Bildschirm

Die Wirkung im Umfeld ist zu berücksichtigen:

• Gelb wirkt auf Blau hell und vordergründig
• Blau wirkt auf Gelb wirkt dunkel
• Mehr als bei anderen Farben zählt bei Grün die Sättigung
• Rot hat Signalcharakter. Auf Grün wirkt Rot grell