Homepage selbermachen 7.851 Themen, 35.615 Beiträge

Wirkung von Hintergrundfarben bei Webseiten

Olaf19 / 13 Antworten / Baumansicht Nickles

Hallo zusammen.

Zur Zeit bin ich auf der Suche nach einer geeigneten Hintergrunfarbe für meine künftige Homepage. Bilder und Schriften im Vordergrund sollen helle Farben bekommen, deswegen wäre ein kräftiger, dunkler Ton sinnvoll. Ich dachte an eine Art dunkles Weinrot wie z.B. x660000 (40% Rot, 0% Grün, 0% Blau). Diese Farbe wäre sogar noch kompatibel zum 8-Bit-System (256 Farben), wenngleich das heutzutage nicht mehr zwingend erforderlich ist :-)

Nun ist mir aufgefallen, daß dieser Farbton sich, abhängig von äußeren Gegebenheiten, verändert wie ein Chamäleon: Auf einer kleinen Fläche wirkt er (noch) dunkler, auf einer großen Fläche heller (optische Täuschung?). Bei starker Sonneneinstrahlung wirkt der Ton grimmig-rostbraun statt rot. Bei künstlichem Licht tritt dieser Effekt ebenfalls auf, wenn auch weniger; bei diffusem Licht (z.B. bei bedecktem Himmel) ist der Ton gut zu erkennen. Das gleiche gilt für die Monitor-Einstellungen: Wenn ich Helligkeit und Kontrast weit aufdrehe, wirkt der ton "roter"; bei geringer Helligkeit bzw. schwachem Kontrast verfärbt er sich wiederum in Richtung rostbraun.

Was meint ihr, ist diese Farbe ungeeignet für Webseiten? Mit anderen dunklen Farben habe ich ähnliche Erfahrungen gemacht, wenn auch nicht so deutlich.
Die Seite soll ja möglichst bei jedem Betrachter gleich bzw. gleich gut aussehen. Ich unterstelle mal, daß niemand seinen Monitor so unglücklich postiert, daß die Sonne genau draufknallt, aber es gibt eben noch ein paar andere Unwägbarkeiten - siehe oben. Gibt es für Monitore bestimmte Referenzwerte, die besonders geeignet sind, um Farbtöne einigermaßen objektiv zu beurteilen? Momentan habe ich sowohl meinen SONY 17"er hier zuhause als auch meinen Video7-TFT 15"er in der Firma auf Helligkeits- und Kontrastwerte so um 50 - 60 eingestellt - so weit das überhaupt von Fabrikat zu Fabrikat vergleichbar ist.

CU
Olaf19

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen
Heinz_Malcher Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Um das Problem mal von biologischer Seite zu betrachten und zu erläutern:

Das Auge hat R(ot)-G(rün)-B(lau) Rezeptoren und kann diese wahrnehmen. Diese Farben sind also die additiven Grundfarben und Vorraussetzung für das menschliche Sehen. Alle Farben werden also aus diesen gemischt (Vorsicht, nicht verwechseln mit den Druckfarben (CMYK))

Nimmst du nun eine Farbe, die nur einen Rezeptor im Auge extrem anspricht, wie zum Beispiel Blau oder in deinem Falle Rot, dann hast du den unschönen Effekt, dass sich das Auge beim umherschweifen auf Buttons, die eine andere Farbe haben, sofort umgewöhnen muss, da beim Anblick des Roten Hintergrundes nur die roten Rezeptoren im Auge aktiv sind. Die anderen müssen erst wieder aktiviert werden, wenn du auf eine andere Farbe schaust. Daher empfehle ich keine für die drei Rezeptoren ausschließlich empfänglichen Farben zu verwenden.

bei Antwort benachrichtigen
Olaf19 Heinz_Malcher „Um das Problem mal von biologischer Seite zu betrachten und zu erläutern: Das...“
Optionen

Das heißt, um das zu vermeiden, müßte ich entweder grün beimischen (ergäbe braun :-() oder Blau (ergäbe Purpur/Violett - schon bessser). Allerdings ist die Farbe Rot am Monitor keine reine Grundfarbe; sie ist schwer gelb-lastig, im dunkleren Bereich bräunlich (das gilt in noch stärkerem Maße für das Grün; eine "reinrassige" Grundfarbe ist eigentlich nur das Blau). Es fragt sich also, ob bei diesem Rot (x660000) nicht doch der Gelb/Grün-Rezeptor mit angesprochen wird.

Eine grundsätzliche Frage zur Farbenlehre: Ich bin's von Kindesbeinen an (erste Erfahrungen mit Aquarellfarben) gewöhnt, daß Grün keine Primärfarbe ist, sondern eine Mischung aus den Primärfarben Blau und Gelb, wobei diese Farben "a priori" vorhanden sind und sich nicht aus anderen Farben mischen lassen. Warum ist das bei Fernsehgeräten und Computer-Monitoren so anders? Warum ergibt Rot und Grün hier Gelb, anstatt daß Gelb und Blau Grün ergibt - weißt Du da etwas drüber?

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen
Heinz_Malcher Olaf19 „Farbenlehre in Theorie und Praxis“
Optionen

Pures Rot (additiv) ist am Monitor mit FF0000 darzustellen.

Das verwechseln viele: Die additiven Grundfarben, die sogenannten Lichtfarben, die also durch Lichtquellen wie den Monitor erzeugt werden sind Rot Grün Blau (RGB) NUR diese Farben können die Rezeptoren deiner Auten wahrnehmen. Diese Rezeptoren sitzen auf der Netzhaut. Siehst du also ein Poster, dann ist das mit CMYK gedruckt. Das heisst mir subtraktiven Farben. Was du als Gelb empfindest wird erst durch die Mischung von Rot und Grün im Auge erzeugt. Das Licht, das auf das Poster trifft, remittiert dann in dein Auge, durchdringt die Hornhaut, trifft auf die Linse, wird gebündelt und fällt auf die Rezeptoren. Dann werden die Informationen an dein Gehirn weitergeleitet, dort entsteht die Farbempfindung, die Farbe Gelb.

Wenn du auf den Monitor schaust, ist das anders, hier wird das Rot gleich von deinem Auge als Rot erkannt, nur die für Rot empfänglichen Rezeptoren werden also angeregt, die anderen sind nicht aktiv.

Es gibt nicht DIE Grundfarben. Man muss zwischen additiver und subtraktiver Farbmischung unterscheiden.

Die additive ist wie erwähnt die Mischung von Lichtfarben, bei der Mischung addiert sich die Lichtquelle, die resultierende Lichtfarbe, auch sekundärfarbe genannt, ist heller, da sich die Lichtpunkte addieren (Zum Beispiel erscheint am Monitor die Mischung von Blau und Gründ zu Cyan heller als die primärfarben Blau und Grün es waren). Bei der additiven Farbmischung sind die Grundfarben Rot Grün Blau.
Bei der Mischung aller Grundfarben erscheint die Farbe weiss, ist keine Grundfarbe vorhanden, ist die Farbwahrnehmung schwarz.


Bei der Subtraktiven Farbmischung werden Körperfarben addiert, das heisst hier sind die Grundfarben Cyan - Yellow - Magenta - Schwarz.
Mischt man zwei dieser Farben, so ist die entstehende sekundärfarbe dunkler als die Primärfarbe, da hier licht subtrahiert (also abgezogen) wird. Die Mischung aller Farben ergibt im Optimalfall ein Schwarz (da es allerdings nie ein sattes schwarz ergibt, hat man im Druck ein vorgefertigtes Schwarz, da es ausserdem zu teuer wäre, immer alle 3 subtraktiven Grundfarben zu mischen).

Beispiele für die verschiedenen Farbmischungen:

Additive Farbmischung wird verwendet bei:

  • Monitor (keine Farbe vorhanden, also Monitor aus = schwarz)
  • Fernseher
  • Dia
  • Projektor

    Subtraktive Farbmischung:
  • Offset Druck (Zeitungen, Poster etc etc)
  • Buchdruck
  • Digitaldruck
    -> schau mal bei Bushaltestellen oder so nach, welche Punkte dort zu sehen sind, das sind immer Gelb, Magenta und Cyan Punkte

    CMYK wird oftmals auch als RGB verwechselt, doch ein Drucker kann ein Magenta von Rot und ein Cyan von Blau unterscheiden. Weil das viele über einen Kamm scheren, taucht verwirrung auf.

    In der Hoffnung, dir geholfen zu haben.
bei Antwort benachrichtigen
-IRON- Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

man additive/subtraktive Farbmischung

Farbcodes,Theorie
Farbenlehre

Wer Trolle toleriert, toleriert Lügen.
bei Antwort benachrichtigen
Olaf19 Nachtrag zu: „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Danke für Eure ausführlichen Statements bzw. Links. Das ist mal wieder jede Menge Lesestoff...
Was mich nach wie vor total verwirrt: Überall wird Grün als Grundfarbe gehandelt und nicht Gelb.
Also Rot-Grün-Blau statt Rot-Gelb-Blau. Das verstehe ich nach wie vor überhaupt nicht - wie gesagt: Gelb und Blau gibt Grün - also kann Grün keine Primärfarbe sein. Wird aber überall behauptet. Okay, das Wochenende ist noch lang - Zeit, das alles in Ruhe nachzulesen...

CU
Olaf

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen
Heinz_Malcher Olaf19 „@Heinz & IRON“
Optionen

Hehe, merke dir eines:

Rot Grün Blau = Grundfarben der additiven Farbmischung = Monitor oder Fernseher

Cyan Magenta Yellow (Schwarz) = Grundfarben der subtraktiven Farbmischung = Druck

bei Antwort benachrichtigen
OWS Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Nochmal zu deiner eigentlichen Frage: Grundsätzlich sollte man mit zwei bis drei Farben auskommen (z.B. Hintergrund und Menü). Je weniger Farben, desto weniger Chance auf Geschmacks-Ver(w)irrung ...

Dein Problem ist eben das Haupt-Problem des Web-Designs: dass man nie weiss, wer, wo, wie, und womit eine Internet-Seite betrachtet. Muss ja kein Lynx-Browser sein, aber zwischen 800x600, 1600x1200, Mono-Chrom und 16 Mio. Farben ist eben alles drin. Dazu Tageslicht, Kunstlicht etc..
Ich hatte mir auch gestern abend/nacht ein paar Farben herausgepickt, heute morgen sahen sie blass und grau aus. Am besten, du orientierst dich an den Web-Farben ("Standard"), dann sollte nicht viel schief gehen.

bei Antwort benachrichtigen
Andreas Roth Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Hallo Olaf!

Über die Grundlagen der additiven sowie der subtraktiven Farbmischung wurde ja schon ausführlich gesprochen, also widme ich mich Deinem eigentlichen Anliegen:

Für großflächige Objekte (wie z. B. die Hintergrundfarbe auf einer Website) sollte man gerade nicht die "websicheren" Farben nehmen, jedenfalls keine Primärfarben wie Rot, Grün (Gelb ;-) oder Blau. Die wirken meist viel zu grell. Nimm lieber etwas gebrochene Töne; Dein Weinrot ist schon ein Anfang, aber ist immer noch zu "rein". Wie Du gesehen hast, bekommt man je nach Monitor, Grafikkarte, Betriebssystem und Lichtsituation sowieso keine wirklich gleichmäßigen Farben hin (vor allem bei dunklen Hintergründen, wie Du schon leidvoll erfahren mußtest), deshalb ist es wichtiger, sich auf eine gute Farbkombination zu konzentrieren (entweder Ton-in-Ton oder kontrastierend).

Gerade bei Websites mit [viel] Text wäre IMO ein heller Hintergrund angebracht, da man "schwarz auf weiß" einfach besser lesen kann, aber ich weiß ja nicht, ob das bei Dir zutrifft. Lies mal diesen Artikel von Dr. Web, da finden sich einige Infos über Farbe auf Websites.

Viele Grüße,
Andreas

bei Antwort benachrichtigen
Olaf19 Nachtrag zu: „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Hallo zusammen,

zunächst einmal danke für all Eure Tipps.

Heinz & Iron: Daß es zweierlei Farbenlehre gibt - additiv und subtraktiv, je nachdem, ob es um Bildschirm- oder Druckfarben geht - war mir schon klar. Was mich nur so beschäftigt hat, war die Frage, warum die Mischfarbe Grün und nicht Gelb Grundfarbe beim Additiven Prinzip ist. Aber ich muß Iron's Links nochmal in Ruhe lesen, und falls das nicht reicht, wohl noch ein bißchen zu dem Thema googlen.

OWS: Genau deshalb - weil ich mich auf wenige (genauer gesagt: zwei!)Farben konzentrieren möchte (dunkelroter Hintergrund, goldgelbe Schrift) - ist die Qualität jeder einzelnen Farbe sehr wichtig. Der von Dir geschilderte Effekt ("am nächsten Morgen war alles blaß und grau") beschreibt exakt mein Problem mit der Hintergrundfarbe, die übrigens um so düsterer wirkt, je kleiner die Fläche ist.

Nur in einem Punkt muß ich Dir widersprechen: Mit dem Thema Standard-Web-Farben (siehe auch Link in meinem Ausgangs-Posting!) hat das Ganze überhaupt nichts zu tun. Dieser Standard ist ja nur ein Raster mit 256 Farben für Monitore, die nicht mehr als 8 bit könenn. Das von mir geschilderte Problem gäbe es auch mit diesen Standardfarben, wenn sie sehr dunkel sind (z.B. 000033 = nachtblau). Mein Weinrot (660000) ist übrigens eine solche Standardfarbe.

Andreas: Ich bin jetzt mal von der websicheren Farbe 660000 auf das unsichere 770000 gegangen - der Zugewinn an Helligkeit ist schon recht deutlich. Ein 8-bit-Monitor würde den Rot-Anteil wieder auf 66 abrunden, damit müßte man dann eben leben.
Der Ton wirkt aber auch ohne Beimischung von Blau- oder Grün-Anteil in sich schon gebrochen, das Rot ist nur auf dem Papier ein reines, es wirkt gelblastig und tendiert im dunkleren Bereich ins Bräunliche.

CU
Olaf

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen
LadyH Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

*g* das ganze bringt mich echt zum schmunzeln.
Ich habe das gleiche Problem auf www.adventshop.de gehabt. Problem war dabei vorrangig, das die Farben der einzelnen Frames sich abgesetzt haben, obwohl überall #680000 eingestellt ist.
Meine Lösung dazu: Grafik 1x1 Pixel gross in der gewünschten Farbe als Hintergrundbild einstellen und trotzdem die Hintergrundfarbe im body belassen.
;-)

bei Antwort benachrichtigen
Olaf19 LadyH „ g das ganze bringt mich echt zum schmunzeln. Ich habe das gleiche Problem auf...“
Optionen

Hey LadyH, das ist ja genau mein Rot - und schön sieht das aus! :-)
Muß gestehen, diese Farbe immer nur als Desktop-Hintergrund getestet zu haben. Im Kontext mit den anderen Elementen der Page sieht das doch gleich viel edler aus.

Obwohl es auch Mißklänge gibt: Im Vordergrund tauchen weitere, z.T. etwas knallige Rot-Töne auf, z.B. bei den unterstrichenen Links, bei der Weihnachtsmann-Mütze und beim Schlitten. Das beißt sich etwas. Deswegen fände ich es besser, eine Farbe zu nehmen, die mit all diesen Tönen kontrastiert, z.B. dunkelblau.

Tja. Die wahre Motivation für diese Anregung ist natürlich: Ich will das schöne Rostrot ganz für mich allein haben :-)

CU und danke auch für deine Info
Olaf

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen
SeitenBauer Olaf19 „Wirkung von Hintergrundfarben bei Webseiten“
Optionen

Weiss ist übrigens auch ein hervorragender Hintergrund für Webseiten.
Darauf kontrastiert dunkle Schrift gut und das erfreut wiederum die geschundenen Augen. Bücher werden meines Wissens auch immer auf weißem Hintergrund gedruckt. Das Internet ist IMO weder Fernsehen noch Kunstgalerie ;-)

SeitenBauer
*mit puritanischem Lächeln*

bei Antwort benachrichtigen
Olaf19 SeitenBauer „Im Rausch der Farben...“
Optionen

Für textlastige Seiten würde ich das auch so machen - es soll nun mal mehr in Richtung Kunstgalerie gehen ;-)
Statt eines etwas sterilen reinen Weiß würde ich dann allerdings lieber ein gedämpftes Weiß nehmen, z.B. xEEEEEE.

CU
Olaf

Die Welt ist ein Jammertal ohne Musik. Doch zum Glueck gab es Bach, Beethoven, Haendel und Goethe (Helge Schneider)
bei Antwort benachrichtigen