Zum Inhalt springen

Fokuspunkt (Emphasis)

Männliche Person, frontal, schaut in die Kamera; trägt kariertes Hemd über dunkelfarbigem T‑Shirt; heller Innenraum mit unscharfem Monitor oder Poster links und Fenster rechts.

von Richard Albrecht am 11.11.2026

Der Fokuspunkt ist die Stelle einer Gestaltung, die den Blick zuerst auf sich zieht und am längsten hält. Er entsteht durch Kontrast, Größe oder Abstand zur Umgebung. Auf einer Website ist das meist die Überschrift des ersten Bildschirms, ein Bild oder die wichtigste Schaltfläche.

Fokuspunkt (Emphasis)

Die Stelle einer Gestaltung, die den Blick zuerst auf sich zieht und am längsten hält.
Beispiel: „Der Fokuspunkt der Seite ist der orange Button, alles andere ist zurückhaltend gestaltet.“

Abgrenzung zur visuellen Hierarchie: Sie ordnet alle Elemente nach Wichtigkeit. Der Fokuspunkt ist ihre Spitze.

Wie ein Fokuspunkt entsteht

Steven Bradley beschreibt Fokuspunkte im Smashing Magazine als Stellen, die sich vom Rest unterscheiden. Mittel sind Kontrast, Größe und Isolation: Ein Element mit mehr Raum um sich herum bekommt laut Nielsen Norman Group mehr Aufmerksamkeit.

Zwei Karten mit denselben Inhalten. Links ist alles gleich grau und gleich groß, rechts ist die Überschrift groß und dunkel, der Text kleiner und die Schaltfläche blau.
Rechts bildet die Überschrift den Fokuspunkt, links gibt es keinen.

Wie viele Fokuspunkte eine Seite verträgt

Wer alles hervorhebt, hebt nichts hervor. Auch Linien im Bild und die Blickrichtung von Personen auf Fotos führen zum Fokuspunkt hin, mehr dazu unter Blickführung. Die Nielsen Norman Group rät, das wichtigste Element am größten zu machen und höchstens zwei große Elemente zu verwenden. Bradley empfiehlt drei Stufen: ein dominantes Element, einige untergeordnete und den Rest.

Fokuspunkt prüfen

Ein bewährter Test ist, die Augen zusammenzukneifen oder den Entwurf unscharf zu stellen: Was dann noch hervorsticht, ist der Fokuspunkt. Ist es nicht das, was die Seite erreichen will, etwa der Call-to-Action, stimmt die Gewichtung nicht.

Siehe auch:

Visuelle Hierarchie

Die Rangfolge, in der Elemente einer Seite wahrgenommen werden, festgelegt über Größe, Kontrast, Farbe und Abstand.

#Gestaltungsgrundlagen

Blickführung

Das gezielte Lenken des Blicks über eine Seite, vom Wichtigsten zum Nächsten.

#Gestaltungsgrundlagen

Balance (visuelles Gleichgewicht)

Die ausgewogene Verteilung des visuellen Gewichts auf einer Fläche, symmetrisch oder asymmetrisch.

#Gestaltungsgrundlagen

Kontrast als Gestaltungsmittel

Der bewusst eingesetzte Unterschied zwischen Elementen in Größe, Farbe, Helligkeit oder Form, der Bedeutung sichtbar macht.

#Gestaltungsgrundlagen

Call-To-Action (CTA)

Element, das Besucher zu einer bestimmten Handlung auffordert, meist als Schaltfläche oder hervorgehobener Link.

#Website-Struktur