Welchen Einfluss haben Farben im Online-Marketing?

Webdesign: Farben

Farben rufen vielfältige Assoziationen hervor. Abhängig vom Land und der Kultur erhalten sie unterschiedliche Bedeutungen. Für den Umgang mit Farben sind passende Online-Tools unerlässlich.

Informationen gemäss Stand vom 31.8.2024

Inhaltsverzeichnis: Farben

• Wichtige Begriffe
• Die Farben im Detail
• Wie Sie Farben aufgrund eines Fotos wählen!
• Gibt es zur Farbwahl nützliche Online-Tools?
• Farbverlauf
• Weitere Tipps
• Das Video

Wichtige Begriffe

Gelb, Rot und Blau sind die Primärfarben.

Wenn Sie die Primärfarben miteinander mischen, entstehen die Sekundärfarben.

Wenn Sie eine Primärfarbe mit einer Sekundärfarbe mischen, entstehen Tertiärfarben.

Das CMYK-Farbmodell steht für Cyan, Magenta, Yellow und Key.

Das RGB-Farbmodell wurde für digitale Bildschirme entwickelt. RGB steht für die Farben Rot, Grün und Blau.

Die Farben im Detail

In unserem Kulturkreis können den Farben folgende Werte zugesprochen werden:

• Blau
  seriös, spirituell, beruhigend, rational, stabil, göttlich, harmonisch, ruhig, jedoch auch kalt, übermässig tugendhaft, sachlich, lästig, undurchschaubar. Erholung, Vertrauen, Ruhe und Treue
• Rot
  antreibend, stark, leidenschaftlich, erhitzend, impulsiv, anregend, aktiv, wärme, dynamisch, jedoch auch kräftig, warnend und aggressiv.
• Orange
  froh, aktiv, genussvoll, aufbauend, jugendlich, gesundheitsfördernd, vital, lebensfreudig, warm, energetisch, gesellig, jedoch auch billig, aufdringlich und laut. Optimismus, Vertrauen – aber auch Überforderung und physische Leiden.
• Violett
  würdevoll, befreiend, magisch, kreativ, weiblich, fantasievoll, selbstlos, empfindsam, intuitiv, aussergewöhnlich, jedoch auch Spiritualität, Eitelkeit, Einsamkeit, überheblich, unreif.
• Bordeaux
  positiv, selbstbewusst, stark, bestimmt, aufregend, optimistisch, jedoch auch dominierend, aggressiv, herrschsüchtig, bedrohlich.
• Rosa
  zugänglich, sanft, ansprechbar, überhaupt nicht bedrohlich, jedoch auch mitleiderregend, übervorsichtig.
• Grün
  ausgleichend, harmonisch, frisch, Naturverbundenheit, Neubeginn, Hoffnung, Vertrauen, Frische, Entspannung und Ruhe, jedoch auch Unerfahrenheit und Neid.
• Gelb
  Leichtigkeit, hell, heiter, warm, stärkend, aufheiternd, optimistisch, Herbst, Behaglichkeit, Weisheit, Reife, jedoch auch Feigheit, Krankheit, Egoismus, Verrat und Neid.
• Grau
  seriös, neutral, ausgewogen, dezent, zurückhaltend, jedoch auch Elend, Trostlosigkeit, unverbindlich, unbestimmt.
• Weiss
  seriös, rein, klar, frisch, futuristisch, friedlich, aufrichtig, frei, neutral, festlich, jedoch auch nüchtern, kalt. Unschuld und Wahrheit.
• Schwarz
  feierlich, raffiniert, eigenwillig, sinnlich, geradlinig, geheimnisvoll, individuell, stark, dramatisch, neutral, seriös, jedoch auch düster, reserviert, streng, hart, Trauer, Kraft und Tod.
• Braun
  Anpassung, Gelassenheit, Erfahrung und Bequemlichkeit, jedoch auch die Schwere.

Wie Sie Farben aufgrund eines Fotos wählen!

• Farben extrahieren
  Dieses Werkzeug extrahiert aus einem Foto eine Farbpalette. HEX-Codes werden gleich dazu geschrieben. Als Formate sind JPG, PNG und GIF-Dateien erlaubt. Das Werkzeug erstellt auch gleich eine ASE-Datei für Photoshop und eine CSS-Datei mit den Farben.
  bighugelabs.com/colors.php
  
• Farbschema generieren
  Hier lässt sich ein Schema eines Fotos erstellen, welches sich bereits im Internet befinden muss.
  degraeve.com/color-palette/

Gibt es zur Farbwahl nützliche Online-Tools?

• Designguide
  Weitere nützliche Informationen finden Sie bei designguide.at. Die Schwerpunkte:
  ➤ Farben Einführung
  ➤ Licht/Körperfarben
  ➤ Farbsysteme
  ➤ Farbmessung
  designguide.at/farbe.html
• Farbengenerator
  rgbcolorcode.com/
• Weitere Werkzeuge
  rund um Farben und Fonts.

Farbverlauf => Gradient

• Farbverlauf-Generator
  Zur Erstellung eines Farbverlaufes können Sie die gewünschten Farben wahlweise mit den Schiebereglern einstellen, per Mausklick auswählen oder direkt als einen Hex-Wert eintragen.
  migano.de/gradientmaker.php
• Zweifarbig
  Eventuell möchten Sie die Bilder auf Ihrer Website alle im gleichen Farbton verwenden. Dafür eignet sich dieses Online-Tool.
  duotone.shapefactory.co
• Ultimate CSS Gradient Generator (E)
  Erstellen Sie eigene Farbverläufe mit dem ausgefeilten CSS Generator. Sie erhalten den CSS Code für Ihre Website.
  colorzilla.com/gradient-editor/
• CSS Gradient (E)
  CSS Gradient ist eine kleine Website und ein kostenloses Tool, mit dem Sie einen Gradienten-Hintergrund für Websites erstellen können. Neben der Tatsache, dass es sich um einen CSS-Gradientengenerator handelt, ist die Website auch vollgepackt mit bunten Inhalten über Gradienten von technischen Artikeln bis zu realen Gradientenbeispielen wie Stripe und Instagram.
  cssgradient.io

Weitere Tipps

• Weniger ist mehr
  Verwenden Sie nicht zu viele Farben, sondern arbeiten Sie mit Farbpaletten. Der Einsatz zu vieler Farben macht ein Design unruhig und unübersichtlich.
• Kontrast
  Achten Sie auf einen guten Kontrast von Text und Hintergrund. Wenn Sie etwas verkaufen wollen, hat die saubere Lesbarkeit des Textes erste Priorität.

Das Video

Autor: Walter B. Walser, kundennutzen.ch