Auswahl von Farben für den Text im Webdesign

Das ist etwas, mit dem ich jetzt eine Weile zu kämpfen habe, und ich möchte es wirklich korrigieren.

Wenn ich ein Webdesign erstelle, verwende ich normalerweise eine Farbpalette mit 2 oder 3 kontrastierenden Farben für Dinge wie Schaltflächen und Hintergründe, aber ich kämpfe damit, die Farben für den Typ so auszuwählen, dass sie für das Auge angenehmer aussehen und zu den 2 passen oder 3 Farben, die ich bereits ausgesucht habe.

Meine Farbauswahl für Fließtext lag in der Vergangenheit bei #999999 oder #aaaaaa, aber ich bemerke, dass in den Designs von Designern, denen ich online folge, ihre Typauswahl ganz leicht in Richtung einer der Hauptfarben in ihren Farbpaletten schwankt.

Gibt es eine bewährte Methode, um auf diese Weise Farbe für den Typ auszuwählen, oder erfolgt dies nur mit dem Auge?

Ich würde gerne wissen, wie es gemacht wird oder ob es Tutorials gibt, wie man Farbe für einen Typ auswählt, der zur vorhandenen Farbpalette passt.

Antworten (1)

Der Hauptzweck von Text ist die Lesbarkeit . Sie sind auf dem richtigen Weg, Ihre Wahl sollte sich in erster Linie am Kontrast orientieren. Während das Auge eines Designers bei Designentscheidungen immer ein Teil der endgültigen Gleichung sein sollte, gibt es Spielraum, sich von Grau zu entfernen.

Kontrast kann in allen Dimensionen erreicht werden: Farbton , Sättigung oder Helligkeit . Der Helligkeitskontrast ist visuell der stärkste , also richten Sie Ihre Entscheidungen hauptsächlich danach aus (dunkler Text auf hellem Hintergrund oder umgekehrt), da er sicherstellt, dass die Schrift unabhängig von Farbton oder Sättigungskontrast lesbar ist (Text mit gleicher Helligkeit, aber unterschiedlichem Farbton oder Sättigungsgrad wird am besten lesbar sein). wahrscheinlich unzureichender Kontrast für ausreichende Lesbarkeit).

Richtlinie

Verwenden Sie zusammengesetzten Kontrast, um die gewünschte Lesbarkeit zu erreichen.

Eine leichte Verringerung des Helligkeitskontrasts kann durch eine Erhöhung des Farbton-/Satt-Kontrasts kompensiert werden. z.B. einen dunkelbraunen Holzhintergrund (30-Grad-Farbton) würde eine helle Schrift erfordern, aber die Helligkeit der Schrift könnte etwas zurückgenommen werden, wenn wir den Farbton auf 210-Grad-Blau setzen, was eine direkte Ergänzung zu einem 30-Grad-braunen Holzhintergrund ist. Der Sat-Kontrast kann stark sein oder man kann die Sättigung nur ganz leicht von Grau wegschieben, gerade genug, um ihm einen leichten Blaustich zu geben. Wie weit wir gehen, zeigt unsere Individualität als Designer.

Der benötigte Kontrast hängt auch von den Schrifteigenschaften ab , dickere Schrift mit höherer x-Höhe benötigt weniger Kontrast um eine ausreichende Lesbarkeit zu erreichen. Monospaced-Typ erfordert auch weniger. Umgekehrt erfordert eine komprimierte Schrift möglicherweise etwas mehr Kontrast als eine normale oder breite.


Es gibt auch so etwas wie zu viel Helligkeitskontrast (da Ihr Bereich Web ist), aufgrund der Beschaffenheit von Bildschirmen (emittiertes Licht statt reflektiertes Licht) kann weißer Text auf schwarzem Hintergrund auf einem Monitor mit hoher Helligkeit etwas zu stark aussehen abends. Wenn Sie es etwas zurückziehen und den Kontrast verringern, wird die Lesbarkeit tatsächlich verbessert. Der Punkt ist, dass so viele Regeln wie es gibt, sie als Richtlinien dienen sollten, das Auge eines Designers ist am Ende immer ein Teil der Gleichung.

Eine Übersicht über Best Practices kann ein hilfreiches Referenzwerkzeug sein: http://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-from-the-best-blogs/