Analytics & TestingContent MarketingE-Commerce und EinzelhandelMarketing-InfografikenMarketing WerkzeugeMobile und Tablet MarketingSocial Media & Influencer-Marketing

So entwickeln Sie Website-, E-Commerce- oder Anwendungsfarbschemata

Wir haben eine ganze Reihe von Artikeln über die Bedeutung von Farben für eine Marke veröffentlicht. Für eine Website, eine E-Commerce-Website oder eine Mobil- oder Webanwendung ist dies ebenso wichtig. Farben haben Einfluss auf:

  • Der erste Eindruck einer Marke und ihres Wertes – bei Luxusgütern wird beispielsweise oft Schwarz verwendet, Rot impliziert Aufregung etc.
  • Kaufentscheidungen – Das Vertrauen einer Marke kann durch den Farbkontrast bestimmt werden. Sanfte Farbschemata können femininer und vertrauenswürdiger sein, harte Kontraste können dringender und rabattorientierter sein.
  • Usability und User Experience – Farben haben eine psychologische und physiologische Auswirkungen, wodurch es einfacher oder schwieriger wird, durch eine Benutzeroberfläche zu navigieren.

Wie wichtig ist Farbe?

  • 85% der Menschen gaben an, dass Farbe einen großen Einfluss darauf hat, was sie kaufen.
  • Farben steigern den Wiedererkennungswert der Marke um durchschnittlich 80 %.
  • Der Farbeindruck ist für 60 % der Annahme oder Ablehnung eines Produkts verantwortlich.

Bei der Festlegung eines Farbschemas für eine Website sind einige Schritte in der begleitenden Infografik beschrieben:

  1. Primärfarbe – Wählen Sie eine Farbe, die der Energie Ihres Produkts oder Ihrer Dienstleistung entspricht.
  2. Aktionsfarben – Dies fehlt in der Infografik unten, aber die Identifizierung einer primären Aktionsfarbe und einer sekundären Aktionsfarbe ist äußerst hilfreich. Es schult Ihr Publikum, sich auf bestimmte Elemente der Benutzeroberfläche basierend auf Farbe zu konzentrieren.
  3. Azusätzliche Farben – Wählen Sie zusätzliche Farben, die ergänzen Ihre Primärfarbe, idealerweise Farben, die Ihre Primärfarbe ergeben Pop.
  4. Hintergrundfarben – Wählen Sie eine Farbe für den Hintergrund Ihrer Website – möglicherweise weniger aggressiv als Ihre Primärfarbe. Denken Sie auch an den Dunkel- und Hellmodus.. Immer mehr Websites integrieren Farbschemata im Hell- oder Dunkelmodus.
  5. Schriftfarben – Wählen Sie eine Farbe für den Text, der auf Ihrer Website erscheinen soll – denken Sie daran, dass eine durchgehend schwarze Schrift selten ist und nicht empfohlen wird.

Als Beispiel mein Unternehmen DK New Media entwickelte eine Online-Marke für einen Kleiderhersteller, der eine E-Commerce-Website direkt an den Verbraucher aufbauen wollte, auf der Menschen Kleider online kaufen konnten. Wir verstanden unsere Zielgruppe und den Wert der Marke und konzentrierten uns – da die Marke überwiegend digital war, aber auch über ein physisches Produkt verfügte – auf Farbschemata, die sowohl im Druck (CMYK) als auch in den Stoffpaletten (Pantone) gut funktionierten digital (RGB und Hex).

Testen eines Farbschemas mit Marktforschung

Unser Prozess für unsere Farbschemaauswahl war intensiv.

  1. Wir haben mit unserer Zielgruppe eine Marktforschung zu einer Reihe von Primärfarben durchgeführt, die uns auf eine einzige Farbe reduziert hat.
  2. Wir haben mit unserer Zielgruppe eine Marktforschung zu einer Reihe von Sekundär- und Tertiärfarben durchgeführt, bei der wir einige Farbschemata eingegrenzt haben.
  3. Wir erstellten Produktmodelle (Produktverpackungen, Halsetiketten und Hängeetiketten) sowie E-Commerce-Modelle mit den Farbschemata und stellten diese sowohl dem Kunden als auch der Zielgruppe zur Rückmeldung zur Verfügung.
  4. Da ihre Marke stark von der Saisonalität abhängt, haben wir auch saisonale Farben in den Mix aufgenommen. Dies kann für bestimmte Sammlungen oder Visuals für Anzeigen und Social-Media-Shares nützlich sein.
  5. Wir haben diesen Prozess mehr als ein halbes Dutzend Mal durchlaufen, bevor wir uns für das endgültige Schema entschieden haben.
Schrank52 Farbschema

Während die Markenfarben Hellrosa und Dunkelgrau sind, haben wir die Aktionsfarben der Grünton sein. Grün ist eine aktionsorientierte Farbe, daher war es eine großartige Wahl, um die Augen unserer Benutzer auf aktionsorientierte Elemente zu lenken. Wir haben die Umkehrung von Grün für unsere sekundären Aktionen integriert (grüner Rahmen mit weißem Hintergrund und Text). Wir testen auch einen dunkleren Grünton für die Aktionsfarbe für Hover-Aktionen.

Seit dem Start der Site haben wir Maus-Tracking und Heatmaps integriert, um die Elemente zu beobachten, die unsere Besucher am meisten anziehen, und mit denen sie am meisten interagieren, um sicherzustellen, dass wir ein Farbschema haben, das nicht nur gut aussieht, sondern auch gut funktioniert.

Farben, Weißraum und Elementeigenschaften

Die Entwicklung eines Farbschemas sollte immer durch Testen in einer Gesamtbenutzeroberfläche erfolgen, um die Interaktion der Benutzer zu beobachten. Für die obige Site haben wir auch sehr spezifische Ränder, Auffüllungen, Umrisse, Randradien, Ikonographie und Schriftarten integriert.

Wir haben dem Unternehmen einen vollständigen Branding-Leitfaden zur Verfügung gestellt, um ihn intern für alle Marketing- oder Produktmaterialien zu verteilen. Markenkonsistenz ist für dieses Unternehmen von entscheidender Bedeutung, da es neu ist und in der Branche derzeit noch nicht bekannt ist.

Hier ist die resultierende E-Commerce-Site mit Farbschema

  • Closet52 - Kleider online kaufen
  • Closet52 Sammlungsseite
  • Closet52 Produktseite

Farbverwendbarkeit und Farbenblindheit

Vergessen Sie nicht, die Benutzerfreundlichkeit zu testen, um den Farbkontrast zwischen den Elementen Ihrer Website zu überprüfen. Sie können Ihr Schema mit dem testen Tool zum Testen der Barrierefreiheit von Websites

. Bei unserem Farbschema wissen wir, dass wir einige Kontrastprobleme haben, an denen wir in Zukunft arbeiten werden, oder wir haben möglicherweise sogar einige Optionen für unsere Benutzer. Interessanterweise ist die Wahrscheinlichkeit von Farbproblemen bei unserer Zielgruppe ziemlich gering.

Farbenblindheit ist die Unfähigkeit, Unterschiede zwischen einigen der Farben wahrzunehmen, die nicht farbbehinderte Benutzer unterscheiden können. Farbenblindheit betrifft etwa fünf bis acht Prozent der Männer (ca. 10.5 Millionen) und weniger als ein Prozent der Frauen.

Benutzerfreundlichkeit.gov

Das Team von WebsiteBuilderExpert hat diese Infografik und einen ausführlichen Begleitartikel dazu zusammengestellt So wählen Sie eine Farbe für Ihre Website das ist extrem gründlich.

So wählen Sie ein Farbschema für Ihre Website

Douglas Karr

Douglas Karr ist CMO von Öffnen Sie EINBLICKE und Gründer der Martech Zone. Douglas hat Dutzenden erfolgreicher MarTech-Startups geholfen, war bei der Due Diligence von MarTech-Akquisitionen und -Investitionen im Wert von über 5 Milliarden US-Dollar behilflich und unterstützt weiterhin Unternehmen bei der Umsetzung und Automatisierung ihrer Vertriebs- und Marketingstrategien. Douglas ist ein international anerkannter Experte und Redner für digitale Transformation und MarTech. Douglas ist außerdem Autor eines Dummie-Ratgebers und eines Buchs über Unternehmensführung.

Ähnliche Artikel

Nach oben-Taste
Menu

Adblock erkannt

Martech Zone ist in der Lage, Ihnen diese Inhalte kostenlos zur Verfügung zu stellen, da wir unsere Website durch Werbeeinnahmen, Affiliate-Links und Sponsoring monetarisieren. Wir würden uns freuen, wenn Sie Ihren Werbeblocker entfernen würden, während Sie unsere Website besuchen.