Design für das Web Gibt es Farben, die Sie vermeiden sollten?

Das Web ist ein Regenbogen von Farboptionen. Farbe ist ein hervorragendes Hilfsmittel, um die Aufmerksamkeit der Benutzer auf sich zu ziehen, visuelles Interesse und Wirkung zu bieten und einen Kontrast für die Lesbarkeit zu schaffen. Farbe steht auch im Mittelpunkt vieler Designtrends, einschließlich Flach- und Materialstile.

Aber können Sie mit Farbe etwas falsch machen? Gibt es Farbtöne oder Kombinationen, vor denen Sie sich scheuen sollten? In einem Wort? Ja! Heute betrachten wir Farben oder Farbkombinationen, die Sie beim Entwerfen von Websites und Apps vermeiden sollten. (Und für den Fall, dass Sie bereits einen dieser Fehler gemacht haben, bieten wir auch alternative Vorschläge an.)

Neon

Neonfarben können Spaß machen, spunkig sein und dem Design viel Pop verleihen. Leider sind sie unglaublich hart für die Augen. Gefühl, wo alles schmerzt, wenn man es anschaut

Das Problem bei Neons ist, dass sie zu hell sind, um sie leicht lesen zu können und Probleme verursachen, die mit dunklen oder hellen Hintergründen gekoppelt sind. In Verbindung mit Text weisen Neons Lesbarkeitsprobleme auf, da die Beschriftung dazu neigt, in den Hintergrund zu bluten. Neon-Hintergründe überwältigen oft und lenken von der Hauptbotschaft im Design ab.

Versuchen Sie es stattdessen: Entfernen Sie einen Teil der Helligkeit von Neonfarben, damit sie auf dem Bildschirm dunkler und dezenter wirken.

Orange You Glad leistet einen tollen Job? Neonfarben in vielfältiger Weise in die Gestaltung ihrer Homepage ein. Das übliche Thema ist, dass die Neons für kleinere Elemente verwendet werden und mit subtilen Farbänderungen, die das Rosa, Gelb und Grün der Augen erleichtern.

Vibrieren? Farben

Wenn stark gesättigte Farben kombiniert werden, erzeugen sie einen "Vibrationseffekt". wo sich die Farben fast in einer verschwommenen oder leuchtenden Bewegung bewegen. Du willst das nicht tun.

Diese Schwingung kann für Benutzer verunsichernd sein, wie der Farbtheoretiker Josef Albers in seinem klassischen Leitfaden Interaction of Color: dargelegt hat. Dieser anfangs aufregende Effekt fühlt sich auch aggressiv an und ist für unsere Augen oft unangenehm. Man findet es selten außer einem schreienden Effekt in der Werbung, und als Folge davon ist es unangenehm, abgeneigt und vermieden.?

Sie können fast vorhersagen, was Farben zum Vibrieren bringen wird, bevor Sie sie nebeneinander stellen.

  • Hohe Sättigung jeder Farbe
  • Komplementär auf dem Farbrad
  • Im Farbrad 180 Grad voneinander beabstandet
  • Das Konvertieren der Farben in Graustufen führt zu einem sehr geringen Kontrast

Ein klassisches Beispiel ist die Kombination von hellem Rot und Grün. Das beliebte? Weihnachten? Kombination ist eine der größten (und am häufigsten verwendeten) Farbverstöße. Diese Kombinationen stellen auch ein Problem der Zugänglichkeit dar, da sie für Menschen mit Farbblindheit nicht zu entziffern sind.

Versuchen Sie es stattdessen: Wenn Sie verwenden müssen? Vibrieren? Farbkombinationen trennen Sie sie mit etwas anderem (vorzugsweise einem neutralen) dazwischen.

Licht auf Licht

Dies ist einer dieser Fehler, die ständig vorkommen. Vielleicht liegt es daran, dass Sie es mit Druckprojekten schaffen können, vielleicht aufgrund bestimmter Bildschirmeinstellungen, durch die das Programm funktioniert, aber Lichtkombinationen lassen sich einfach nicht schneiden.

Sie sind schwer zu lesen. Jedes Mal.

Hier scheinen die größten Verstöße zu passieren: Heldenköpfe, die ein Bild mit weißem Text verbinden, aber der Text fällt auf einen hellen Teil des Bildes. Zu diesem Zeitpunkt sind die Wörter nicht lesbar. Es passiert viel öfter als es sollte. Wenn nicht jeder Buchstabe eindeutig lesbar ist, müssen Sie ihn noch einmal überdenken.

Versuchen Sie es stattdessen: Zum Glück gibt es ziemlich einfache Lösungen für dieses Problem:

  • Wählen Sie ein neues Bild mit durchgehend farbigem Hintergrund.
  • Verwenden Sie ein farbiges Kästchen für Text auf Bildern mit vielen Farbvariationen.
  • Berücksichtigen Sie eine farbige Bildüberlagerung, um den Kontrast zwischen Hintergrund- und Textelementen zu erhöhen.

Alles Regenbogenfarben

Es ist fast selbstverständlich, dass regenbogenfarbene Websites einfach nicht funktionieren. (Denken Sie daran, wie viele Regeln der Farbtheorie Sie brechen, indem Sie sich gerade eine Website mit Regenbogen-Motiven in Ihrem Kopf vorstellen.)

Regenbogenfarbkombinationen sind überwältigend und überwältigend. Sie können die Aufmerksamkeit eines Benutzers auf den ersten Blick erlangen, aber dieser Benutzer wird sicherlich aufspringen, sobald er oder sie feststellt, dass der Inhalt nicht zu entziffern ist.

Versuchen Sie es stattdessen: Wenn Sie eine breite Farbpalette verwenden möchten - entscheiden Sie sich für den Trend - für Farbblockierung oder Kartenstile, bei denen Farben mit Elementen verknüpft werden können. Dieses Design im Containerstil ermöglicht mehr Flexibilität bei der Farbe und schafft gleichzeitig ein Gefühl für Organisation und Fluss.

Hell auf hell / dunkel auf dunkel

Genau wie bei Licht und Licht wird eine Kombination ähnlicher Farbsättigungen Probleme verursachen. Es sollte selbstverständlich sein, aber vermeiden Sie sie.

Wenn Sie der Meinung sind, dass Ihnen dies nicht passieren wird, sollten Sie vorsichtig sein, wenn Sie monotone Farbschemata verwenden. Dann neigen Designer dazu, hierher zu rutschen. (Verwenden Sie im Zweifelsfall mehr Kontrast.)

Versuchen Sie es stattdessen: Denke dagegen. Wenn Sie mehrere helle oder dunkle Farben verwenden möchten, sollten Sie sie als Optionen für Bildschirme in einer scrollenden Site betrachten. Sie können alle dunklen oder hellen Farben verwenden, die Sie mögen, und die Lesbarkeit und Benutzerfreundlichkeit gewährleisten. (Es ist eine Win-Win!)

K Schwarz

Insbesondere wenn Sie häufig zwischen Print- und Webprojekten wechseln - wie viele Designer -, kann reines Schwarz irrtümlicherweise in Webprojekte geraten. Bekannt als? K? schwarz in Druckprojekten, weil nur eine Platte verwendet wird oder? Pure? Schwarz (# 000000) in digitalen Projekten ist diese Farbe nur flach.

Denken Sie an die Realität, alle Kombinationen von Schwarz werden tatsächlich mit anderen Farbtönen gefiltert, um diese Fülle zu erhalten. (Sogar die Federn eines Raben sehen im richtigen Licht oft bläulich oder lila aus.) Verwenden Sie eine Kombination aus Schwarz, die andere Farben enthält, um diese satte, dunkle Farbe zu erzeugen, und speichern Sie reines Schwarz für den Druck.

Versuchen Sie es stattdessen: Versuchen Sie es mit einem Schwarz mit Farbtönen, die zu Ihrer Marke passen, oder fügen Sie genau die richtigen Farbbezeichnungen hinzu. Je mehr Sie Schwarz in Grau aufhellen, desto einfacher sind die Farben des Makeups. Betrachten Sie Schwarz im Einklang mit den umgebenden Farben und denken Sie darüber nach, wie die einzelnen Farben aussehen und wie sie zueinander stehen. (Verwenden Sie beispielsweise ein Schwarz mit etwas mehr bläulichem Ton, um die orangen oder gelben Farbtöne für Text oder andere Elemente zu verschieben.) Die Farbe für Wonderland oben ist beispielsweise # 0a0a0b.

Fazit

Der größte Grund, diese Farben und Kombinationen zu vermeiden, ist mangelnde Lesbarkeit und Kontrast. Die Realität ist mit der richtigen Farbauswahl und viel Kontrast, fast jeder Farbton kann in Maßen wirken.

Aber es gibt einen Haken. Möglicherweise müssen Sie es etwas dunkler oder heller machen, als Sie erwarten, damit es funktioniert. Denken Sie daran, Farben nehmen Attribute von ihrer Umgebung an (einschließlich der Hintergrundbeleuchtung eines Bildschirms) und müssen entsprechend angepasst werden.

Hier ist dein? Trick des Tages :? Wenn Sie den Bildschirm schielen, fragen oder verschieben müssen, um etwas zu sehen, funktioniert die Farbe nicht und Sie müssen zu etwas anderem wechseln.