Farben für eine Unternehmenswebsite wählen
Wenn Sie ein Dachdeckerbetrieb, ein HLK-Unternehmen, ein Massagestudio oder ein anderes lokales Gewerbe betreiben, haben Sie wahrscheinlich schon einmal auf einen Farbwähler gestarrt und sich dabei festgebissen. Es gibt Millionen von Farbtönen, jeder Ratgeber sagt etwas anderes, und Sie möchten einfach eine Website, die professionell wirkt und das Telefon zum Klingeln bringt. Dieser Leitfaden zeigt Ihnen, wie Sie Farben für eine Unternehmenswebsite mit einem kleinen Regelwerk wählen, das Sie an einem Nachmittag anwenden können - auch wenn Sie noch nie ein Designtool geöffnet haben.
Das Ziel hier ist kein hübscher Screenshot. Das Ziel ist eine Website, der ein Fremder in den ersten Sekunden vertraut, die er ohne Blinzeln lesen und auf der er handeln kann. Farbe leistet dabei viel stille Arbeit. Studien zeigen, dass Menschen sich innerhalb einer Sekunde einen ersten Eindruck von einer Website bilden - und ein großer Teil dieses Eindrucks besteht aus Farbe und Kontrast, bevor jemand ein Wort liest.
Beginnen Sie mit drei Farben, nicht dreißig
Der häufigste Fehler von Kleinunternehmern ist die Wahl zu vieler Farben. Eine überfüllte Palette wirkt amateurhaft und zieht das Auge überall hin. Die Lösung ist eine einfache Struktur, die professionelle Designer oft als die 60-30-10-Regel bezeichnen.
- Eine dominante Farbe für etwa 60 Prozent der Seite. Dies ist in der Regel ein heller, ruhiger Hintergrund wie Weiß, Cremeweiß oder ein sehr zartes Grau.
- Eine sekundäre Farbe für etwa 30 Prozent. Das ist Ihre Hauptmarkenfarbe, verwendet für Überschriften, Abschnittshintergründe und größere Blöcke.
- Eine Akzentfarbe für etwa 10 Prozent. Das ist die auffällige - reserviert für Schaltflächen und Links, die Sie anklicken lassen möchten.
Stellen Sie es sich wie Anziehen vor. Die 60 Prozent sind Hemd und Hose, die 30 Prozent sind die Jacke, und die 10 Prozent sind der Gürtel oder die Uhr, die den Look abrunden. Wenn alles laut ist, sticht nichts heraus. Die Akzentfarbe hat auf einer Unternehmenswebsite eine einzige Aufgabe: die Schaltfläche "Jetzt anrufen" oder "Angebot anfragen" unmissverständlich sichtbar zu machen.
Wenn Sie sich nichts anderes aus diesem Artikel merken, merken Sie sich das: Wählen Sie ein dominantes Neutral, eine Markenfarbe und einen Akzent. Sie können später einen vierten unterstützenden Ton hinzufügen, aber drei ist eine vollständige, funktionierende Palette.
Farbpsychologie als Orientierung nutzen, nicht als Dogma
Farben tragen grobe emotionale Assoziationen. Das ist keine exakte Wissenschaft und variiert je nach Kultur, aber es ist ein nützlicher Ausgangspunkt bei der Wahl einer Richtung für Ihr Unternehmen.
- Blau wirkt zuverlässig, ruhig und professionell. Deshalb setzen Banken, Klempner und Arztpraxen darauf. Für Handwerksbetriebe signalisiert Blau: "Die kommen pünktlich und machen ihre Arbeit ordentlich."
- Grün steht für Gesundheit, Wachstum, Sicherheit und Geld. Es passt zu Landschaftsgärtnern, Wellnessstudios, Reinigungsdiensten und allem Umweltbewussten.
- Orange und Gelb wirken energetisch, freundlich und dringend. Sie eignen sich hervorragend als Akzentfarben für Schaltflächen, weil sie Aufmerksamkeit erregen - können aber billig wirken, wenn sie über eine ganze Seite eingesetzt werden.
- Rot ist mutig und dringlich. Es funktioniert für Notfalldienste und Restaurierung, kann aber auch beunruhigend wirken - also in kleinen Dosen.
- Schwarz, Anthrazit und Dunkelblau wirken Premium und seriös. Sie passen zu hochwertigen Handwerksbetrieben, Anwaltskanzleien und Luxus-Wellnessmarken.
- Lila tendiert zu Kreativität und Ruhe, was zu Salons, Spas und Schönheitsdienstleistungen passt.
Der Teil, den die meisten Ratgeber überspringen: Wählen Sie keine Farbe nur, weil ein Diagramm sagt, sie bedeute "Vertrauen". Wählen Sie eine Farbe, die zu dem passt, was Ihre Kunden von Ihrer Branche bereits erwarten, und setzen Sie sie konsequent ein. Ein Dachdecker, der von oben bis unten in zartem Lavendel erscheint, verwirrt die Menschen, egal was das Psychologiediagramm behauptet.
Kontrast ist die Regel, die Sie nicht überspringen können
Hier scheitern die meisten kleinen Unternehmenswebsites still - und hier können Sie Mitbewerber mit kaum einem Aufwand schlagen. Kontrast ist der Helligkeitsunterschied zwischen Ihrem Text und dem Hintergrund dahinter. Geringer Kontrast - wie grauer Text auf weißem Hintergrund oder weißer Text auf einer hellblauen Schaltfläche - ist für alle schwer zu lesen und für ältere oder sehbehinderte Besucher unmöglich. Ihre Kunden im Handwerk sind oft älter und surfen häufig auf einem Smartphone im hellen Sonnenlicht. Wenn sie Ihre Telefonnummer nicht lesen können, verlieren Sie den Auftrag.
Es gibt einen tatsächlichen Standard dafür. Die Web Content Accessibility Guidelines empfehlen ein Kontrastverhältnis von mindestens 4,5 zu 1 zwischen normalem Text und seinem Hintergrund. Sie müssen die Mathematik nicht von Hand machen. Fügen Sie Ihre beiden Farben in ein kostenloses Tool wie den WebAIM Contrast Checker ein, das Ihnen sofort sagt, ob Sie bestehen oder nicht.
Einige einfache Regeln, die Sie sicher halten:
- Fließtext sollte sehr dunkel auf einem sehr hellen Hintergrund sein, oder sehr hell auf einem sehr dunklen Hintergrund. Dunkelgrau auf Weiß ist in Ordnung. Mittelgrau auf Weiß nicht.
- Legen Sie niemals Text über ein belebtes Foto ohne ein solides oder halb-solides Overlay dahinter.
- Ihre Akzent-Schaltflächenfarbe braucht genug Kontrast, damit die Schaltflächenbeschriftung leicht lesbar ist.
Wenn ein Besucher blinzeln, sich vorbeugen oder den Bildschirm kippen muss, um Ihr Angebot zu lesen, hat die Farbwahl bereits den Anruf gekostet.
In fünf Schritten Farben für eine Unternehmenswebsite wählen
Hier ist der gesamte Workflow, von Anfang bis Ende, ohne Designjargon.
- Wählen Sie Ihr dominantes Neutral. Wählen Sie Weiß oder ein weiches Cremeweiß für den größten Teil der Seite.
- Wählen Sie Ihre Markenfarbe. Wählen Sie eine Farbe, die zu Ihrer Branche passt und - wenn Sie bereits ein Logo oder eine Fahrzeugbeschriftung haben - zu dieser passt.
- Wählen Sie Ihre Akzentfarbe. Wählen Sie eine energiereiche Farbe, die stark von Ihrer Markenfarbe kontrastiert, und verwenden Sie sie nur für Schaltflächen und Schlüssellinks.
- Prüfen Sie jedes Text-Hintergrund-Paar auf Kontrast. Führen Sie sie durch einen kostenlosen Kontrastprüfer und beheben Sie alles, was nicht besteht.
- Testen Sie es in der realen Welt. Schauen Sie sich die Website auf Ihrem eigenen Smartphone an, draußen, und fragen Sie zwei Personen, die nicht zu Ihrer Familie gehören, ob die Hauptschaltfläche offensichtlich und der Text leicht zu lesen ist.
Das ist alles. Sie brauchen keinen Farbabschluss. Sie brauchen die Disziplin, die Palette klein und den Kontrast hoch zu halten.
Palette auf Ihre Branche abstimmen
Allgemeine Farbratgeber reden über Marken im Abstrakten. Sie führen eine bestimmte Art von Unternehmen, also hier konkrete Ausgangspunkte, die Sie anpassen können.
- Dachdeckerei und Hochbau: tiefes Marineblau oder Anthrazit als Markenfarbe, weißer Hintergrund, ein warmes Orange oder Warngelb als Akzent für Anfragebuttons.
- HLK und Sanitär: eine klare blaue Markenfarbe kombiniert mit einem roten oder orangefarbenen Akzent. Die Blau-Rot-Paarung spielt auch auf warm und kalt an.
- Restaurierung und Notfalldienste: eine starke, seriöse Basis wie Anthrazit oder Dunkelblau mit einem roten Akzent, der Dringlichkeit und schnelle Reaktion signalisiert.
- Garten- und Landschaftspflege: Waldgrün oder Olivgrün als Markenfarbe, Creme oder weißer Hintergrund und ein sonniges Gelb als Akzent.
- Wellness, Massage und Spa: weiches Salbeigrün, gedämpftes Türkis oder staubiges Lila mit viel Weißraum und einem sanften Akzent.
- Reinigungsdienste: helle, frische Blau- und Grüntöne, die Sauberkeit und Hygiene suggerieren.
Anpassen, nicht kopieren. Der Punkt ist, von einer Richtung zu starten, die den Erwartungen Ihrer Kunden entspricht, anstatt von einem leeren Farbmuster.
Häufige Farbfehler, die lokale Unternehmen Anrufe kosten
Selbst mit einer guten Palette summieren sich kleine Fehler. Achten Sie auf Folgendes.
- Ihre Markenfarbe für Fließtext verwenden. Farbiger Absatztext besteht fast immer den Kontrasttest nicht und ermüdet das Auge.
- Jede Schaltfläche in einer anderen Farbe gestalten. Wenn drei Schaltflächen konkurrieren, gewinnt keine.
- Die exakten Farben einer großen nationalen Marke kopieren. Deren Palette wurde für deren Markt entwickelt, nicht für Ihre.
- Trends nachjagen. Eine Farbe, die dieses Jahr cool aussieht, kann Ihre Website schnell veralten lassen.
- Den Smartphone-Bildschirm vergessen. Die meisten lokalen Suchanfragen finden auf Smartphones statt.
- Hover- und besuchte Zustände ignorieren. Links und Schaltflächen sollten sichtbar reagieren, wenn sie angetippt oder berührt werden.
Wo Sie Farben bekommen und kostenlos testen können
Sie brauchen keine kostenpflichtige Software. Einige kostenlose Tools decken alles in diesem Leitfaden ab.
- Coolors und Adobe Color helfen Ihnen, eine Palette zu erstellen und zu betrachten und Farben zu finden, die gut zusammenwirken.
- Der WebAIM Contrast Checker bestätigt, dass Ihr Text lesbar ist.
- Ihr eigenes Smartphone, im Freien gehalten, ist der ehrlichste Test, den Sie haben.
Speichern Sie Ihre endgültigen Farben als kurze Liste exakter Codes - die sechsstelligen Hex-Werte - damit Sie jedes Mal die gleichen auf Ihrer Website, Rechnungen und Social-Media-Profilen verwenden. Diese Wiederholung ist es, was eine Farbe zu einer Marke macht.
Wenn Sie lieber gar nicht wählen möchten
Manche Inhaber genießen das. Viele möchten einfach eine fertige Website, die bereits richtig aussieht. Hier hilft ein Tool wie Saynovo. Es liest, was Ihr Unternehmen bereits ist, und wendet eine zu Ihrer Branche passende Farbpalette an, sodass Sie von einem professionellen Ausgangspunkt beginnen, anstatt vor einem leeren Farbrad zu stehen. Wenn ein Farbton falsch erscheint, sagen Sie, was Sie möchten, in einfachen Worten und die Website passt sich an - ohne dass Sie Hex-Codes per Hand verwalten müssen.
Kurz zusammengefasst
Zu lernen, wie man Farben für eine Unternehmenswebsite wählt, läuft auf eine Handvoll dauerhafter Gewohnheiten hinaus. Halten Sie die Palette auf drei oder vier Farben. Verwenden Sie ein helles Neutral für den größten Teil der Seite, eine Markenfarbe, die zu Ihrer Branche passt, und einen lauten Akzent, der für die Schaltflächen reserviert ist, die Ihnen Geld einbringen. Prüfen Sie, ob jeder Text den 4,5 zu 1 Kontrast-Standard erfüllt, und testen Sie dann alles auf einem echten Smartphone bei echtem Tageslicht. Tun Sie das, und Ihre Website wird professioneller aussehen als die meisten Ihrer lokalen Mitbewerber - und sie wird die stille Arbeit leisten, einen Fremden in einen Anruf zu verwandeln.
