Verwenden der Farbtheorie im Webdesign

In einem früheren Beitrag haben wir das Konzept der Farbtheorie in Bezug auf den weißen oder negativen Raum erörtert.


Die Farbtheorie sagt uns, dass verschiedene Farben aus bestimmten Gründen zusammenarbeiten oder nicht. (Eine ausführlichere Definition der Farbtheorie finden Sie unter Dieser Beitrag von der NYU.)

Während Sie möglicherweise nicht darüber nachdenken, wie sich die Farbe auf die Besucher Ihres Blogs auswirkt, betrachtet der Designer dies während des Webdesign-Prozesses als eine sehr wichtige Komponente für die Erstellung der perfekten Website.

Wie Farbe uns fühlen lässt

Schauen Sie sich diesen Farbblock an:

Gelb

Welches Gefühl löst das in Ihnen aus?

Und wie wäre es mit diesem Block:

Blau

Haben Sie sich bei Beispiel A anders gefühlt als bei Beispiel B.?

Wenn ja, ist das keine Überraschung.

  • Gelb ist elektrisch und energetisierend.
  • Hellblau beruhigt.

Farbe ist wichtig. Wir alle haben instinktive psychologische Assoziationen mit bestimmten Farben. Einige davon sind gemeinsame psychologische Assoziationen mit Farbe, während andere individuelle Assoziationen sind, die durch den Kontext unseres Lebens geschaffen wurden. Sogar der verwendete Farbton wird einen Unterschied machen. Ein weicherer Blauton ruft beruhigende Gefühle hervor, während stärkere Farbtöne Stärke bedeuten.

Drei Farbkategorien

Wahrscheinlich haben Sie im Grundschulunterricht etwas über Farbtheorie gelernt. Wahrscheinlich haben Sie inzwischen viel davon vergessen, es sei denn, Sie arbeiten im Grafikdesign!

Das Farbrad enthält drei Arten von Farben:

  1. Primär
  2. Sekundär
  3. Tertiär

Grundfarben kann nicht durch Mischen anderer Farben erstellt werden.

Sekundärfarben werden durch Mischen von zwei Grundfarben gebildet: Blau und Gelb ergeben Grün, Rot und Gelb ergeben Orange.

Tertiärfarben werden durch Kombination von Primär- und Sekundärfarben abgeleitet: blau-grün oder rot-orange.

Webdesigner verwenden diese Farbtypen, um beim Entwerfen eines Blogs Gefühle hervorzurufen.

Komplementärfarben

Um Design zu beherrschen, müssen Sie auch verstehen, welche Farben zusammen gut aussehen. Komplementärfarben befinden sich auf gegenüberliegenden Seiten des Farbkreises. Wenn diese Farben zusammen verwendet werden, kontrastieren sie miteinander und verleihen Ihren Designs ein lebendiges Aussehen. Diese Komplementärfarben können auch verwendet werden, um ein bestimmtes Gefühl zu verstärken oder um zusätzliche Gefühle über die Hauptemotion zu legen, die Sie Ihrem Besucher geben möchten. Sie können beispielsweise Rot auf Ihren Handlungsaufforderungstasten verwenden, um Dringlichkeit zu vermitteln, und es mit Grüns in Ihrem gesamten Layout kombinieren, um Ihren Besuchern ein Gefühl der Sicherheit zu geben.

Sie können ein Tool wie das verwenden Farbrechner Auf der Sessions College-Website finden Sie das perfekte Paar Komplementärfarben für Ihr Designprojekt.

Erstellen Sie die Stimmung Ihres Blogs durch Farbe

Möchten Sie wissen, welche Farben mit welchen Arten von Gefühlen verbunden sind? Hier ist eine praktische Anleitung:

  • rot – Warm, elektrisch, anregend. Großartig als Akzent für Bewegung.
  • Blau – Beruhigend, kraftvoll, professionell. Orte zum Reisen oder Entspannen eignen sich gut für diesen Farbton.
  • Gelb – Aufregend und elektrisch. Zu viel kann zu Ablenkungen auf einer Website führen. Verwenden Sie es daher für Akzente.
  • Orange – Elektrisch; Browser zeigen diesen Farbton jedoch anders an, bleiben Sie also als Akzent dabei. Grün – Cool, beruhigend, professionell; ideal für Websites, die sich auf Natur, Finanzen, Geschäft beziehen.
  • Schwarz – Stärke und Kraft. Während Schwarz als Hauptfarbe im Webdesign verwendet wurde, kann es auch die Augen eines Lesers belasten.
  • Grau – Kann für Stärke, Ruhe, Kraft, Autorität verwendet werden. Toller Farbton für die meisten anderen Farben; Grau wird heutzutage häufig im Webdesign verwendet.
  • Weiß – Auch wenn es im Webdesign als unnötige Farbe erscheint, vergessen Sie nicht, was wir über weißen oder negativen Raum gesagt haben. Ihre Leser benötigen einige weiße Bereiche, damit der Rest der Website in den Fokus gerät. Ohne diesen Leerraum werden Sie Ihre Leser wahrscheinlich überwältigen und sie werden sich wahrscheinlich abwenden.

Einige Beispiele der verwendeten Farbtheorie

Um Ihnen zu zeigen, wie die Farbtheorie in der Webentwicklung verwendet wird, gibt es nichts Schöneres, als ein paar Bilder anzubieten?

Das vielleicht berühmteste Beispiel für eine Website, die die Farbe Blau verwendet, um ein Gefühl von Sicherheit und Vertrauen hervorzurufen, ist Facebook:

Verwendung der Farbtheorie im Webdesign: Facebook

Natürliches Erwachen, Eine Zeitschrift für gesundes Leben, die eine Kombination aus Grün und Blau verwendet, um die Leser in eine ruhige, energiegeladene Stimmung zu versetzen. Es gibt auch einen winzigen Spritzer Orange, um zum Handeln anzuregen.

Natürliches Erwachen

Oi Polloi ist eine E-Commerce-Website, die eine Vielzahl lebendiger Farben verwendet, um Kunden in ihr Geschäft zu locken. Anfangs mag ihr Farbschema chaotisch erscheinen, aber die Vielfalt ist beabsichtigt: Sie repräsentiert die große Auswahl an Marken, die in ihrem Geschäft erhältlich sind.

Oi Polloi

Abschließender Rat

Wenn Ihre Website nicht die gewünschte Traktion erzielt, besteht eine gute Chance, dass Farbe Teil Ihres Problems ist. Nehmen Sie sich Zeit, um wirklich zu verstehen, was die Leute fühlen sollen, wenn sie Ihre Website betreten, und erstellen Sie dann ein neues Design, das Farben verwendet, die ausgewählt wurden, um diese Gefühle hervorzurufen.

Weitere Hilfe zu den Grundlagen des Bloggens finden Sie in unseren Artikeln 5 mit großartigem Blog-Design und einer vollständigen Anleitung zum Starten eines Blogs.

Vergessen Sie nicht, an unserem Crashkurs teilzunehmen, um Ihre WordPress-Site zu beschleunigen. Mit einigen einfachen Korrekturen können Sie Ihre Ladezeit sogar um 50-80% reduzieren:

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map