Lektion 2

Kontrast

Nutze Unterschied, um Brand-Botschaft, Beleg und Aktion sauber zu trennen.

16 Min. Brand/SocialVisuelle Entscheidungen

Lektionsschritte

IdeeBeispielFehlerQuizÜbung

Kernidee

Kontrast ist eine Entscheidung darüber, welcher Unterschied Arbeit leistet. Ein Element soll durch einen dominanten Hebel gewinnen; alles andere hält genug Wertkontrast, um lesbar zu bleiben.

  • Wähle eine Kontrastaufgabe pro Stück — Headline anheben, Aktion klären oder Status zeigen. Kontrast soll nicht alles auf einmal tun, sonst wird das Stück laut.
  • Die sieben Hebel — Helligkeit, Farbton, Sättigung, Größe, Gewicht, Form, Dichte — sind nicht austauschbar. Wertkontrast trägt die Textlesbarkeit; Farbton und Sättigung allein nicht.
  • Wähle einen dominanten Hebel und kombiniere ihn mit einem ruhigeren Zug (Helligkeit + Größe, Größe + Isolation). Ein einzelner Hebel wird durch alles Laute in der Nähe neutralisiert.
  • Kontrast ist relativ. Wenn alles laut ist, führt nichts — Rang 2 zurückzunehmen ist meist das, was Rang 1 landen lässt.

Visuelles Beispiel

Gib dem Kampagnenclaim einen dominanten Kontrastzug.

Vorher und nachher

Nutze Kontrast für Rollen, nicht für Aufregung.

Vorher: viele mittlere Signale

Claim, Preis, Datum und CTA sind ähnlich betont; die Karte wirkt aktiv, aber nicht geführt.

Nachher: ein nützliches Signal

Der Claim trägt den stärksten Kontrast, Belege treten zurück und die CTA bleibt klar.

Beispiel erklärt

Warum die verbesserte Version funktioniert

Die Headline trägt den dominanten Hebel — Wertkontrast kombiniert mit Größe. Der Block ist das dunkelste Objekt auf einer hellen Fläche und gleichzeitig die größte Schrift der Karte. Ein klarer Gewinner.

Belegtext bleibt im Mittelwert, nicht in Hellgrau. Ihn weiter zurückzunehmen hätte elegant ausgesehen, aber die Lesbarkeit gebrochen. Die CTA nutzt einen kontrollierten Akzentfarbton und leiht sich Gewicht von der Headline darüber, statt mit ihr zu konkurrieren.

Häufige Fehler

Worauf du achten solltest

Rabatt, Headline und CTA nutzen alle die lauteste Behandlung. Gleichstarke Kontraste heben sich auf — wenn alles laut ist, hat das Auge keinen ersten Blick.
Sättigung wird als Ersatz für Hierarchie verwendet. Eine kräftige Farbe zieht einmal Aufmerksamkeit, aber mehrere gesättigte Blöcke lesen sich als Dekoration, nicht als Richtung.
Status wird nur durch Farbton kodiert — Farbe ohne Helligkeits- oder Gewichtsstütze. Der Hinweis verschwindet bei Farbsehschwäche, in Graustufen und bei wenig Kontrast.
Bodytext wird in einen hellen Ton gedimmt, damit es elegant aussieht. Den Kontrastchecker knapp zu bestehen ist nicht dasselbe wie lesbar — Body braucht eine echte Helligkeitsstufe zur Fläche.

Visueller Vergleich

Welche Karte nutzt einen dominanten Kontrasthebel?

Eine Karte hebt den Claim mit einem klaren Hebel. Die andere verteilt fast gleich starken Kontrast über Claim, Details und Aktion.

Wähle eine Option, um die Design-Logik zu sehen.

Kleine Übung

Diagnostizieren, editieren, begründen

Vergleiche zwei Karten und entscheide, welche die Überschrift führen lässt. Finde dann den Bereich, in dem Kontrast zu wenig oder zu viel tut.

Kurze Übung starten Zur nächsten Lektion springen