H1 Seitenintro sieht so aus
Kurzer Introtext der erklärt, was auf dieser Seite los ist und was man hier bekommen kann. Idealerweise ca. 120 – 170 Zeichen, das entspricht 2 – 3 Zeilen auf dem Desktop.
Textbox H2 schmal/linksbündig/hell
Infobox für Schnellentschlossene, die sich direkt weiterleiten lassen wollen. Der Bereich kann natürlich auch für etwas anderes genutzt werden und der Button ist optional bzw. kann auch durch einen secondary button ausgetauscht werden. Damit das Bild gut wirken kann sind ca. 290 Zeichen ideal.
Textbox H2 breit/mittig/dunkel
In einer solchen Textbox können Inhalte beliebig lang und unter Verwendung verschiedener Überschriften, Links und mit Buttons etc. Gestaltet werden. Sinnvoll sind Textabschnitte von drei bis fünf Zeilen auf dem Desktop. Außerdem ist es wichtig, die Überschriften in der logischen Reihenfolge zu verwenden.
H3 kann bei längeren Texten Struktur schaffen
Dieses Textformat ist auch gut für tiefere Erläuterung und oder folgende Beispiele geeignet:
- Listen
- Blogbeiträge
- Rahmung/Hintergrund für visuelle Elemente
- ggf. Einfügen von Bildern
H4 kommt nur selten vor ...
…wird hier aber als weitere Möglichkeit, Texte zu strukturieren, aufgeführt. Außerdem kann die H4 gut verwendet werden, um beispielsweise Grafiken oder Icons zu betiteln.
CTA-Banner volle Breite kein Rahmen
Ein CTA-Banner verweist noch einmal auf den wesentlichen Punkt und ruft zu einer bestimmten Handlung auf. Es kann mit einem Bild hinterlegt sein. Hintergrundfarbe mit Bild veränderbar, ohne Bild diese hier verwenden.
Backdrop-Banner für Text & Grafik
Ein solches Banner kann für CTAs, Grafiken oder als Backdrop für Bilder verwendet werden. Es kann mit einem Bild hinterlegt werden oder nicht. Falls ein Bild gewählt wird, kann die Hintergrundfarbe entsprechend angepasst werden. Ohne Hintergrundbild wird empfohlen, die Farbe wie hier gezeigt zu übernehmen. Achtung! Der Text ist für ein CTA-Banner mittig ausgerichtet. Für andere Anwendungsbeispiele kann eine Linksausrichtung sinnvoller sein (s. u.)Wird ein Banner als Hintergrund für Texte, Bildelemente oder Grafiken verwendet, ist die Standard-Hintergrund-Farbe zu wählen.
Texthervorhebung
Textbox im Banner
Auch Textboxen im Banner sind möglich, sollten aber nur sparsam und für besondere Hervorhebungen angewandt werden.
Texthervorhebung
Textbox im Banner
Auch Textboxen im Banner sind möglich, sollten aber nur sparsam und für besondere Hervorhebungen angewandt werden.
Texthervorhebung
Textbox im Banner
Auch Textboxen im Banner sind möglich, sollten aber nur sparsam und für besondere Hervorhebungen angewandt werden.
Tagline zum Bild
Textbox hell mit Bild
Bild- und Textseite können getauscht werden, um zwischen Hoch und Querformat zu wechseln. Achtung: Die Bilder sind hier als Hintergründe der Container formatiert, nicht als Bilder. Die Höhe ist manuell festgelegt, hier kann also ggf. noch individuell angepasst werden. Auch Überlappungen, beispielsweise bei freigestellten Bildern, sind möglich.
CTA-Banner volle Breite mit Bild
Ein CTA-Banner verweist noch einmal auf den wesentlichen Punkt und ruft zu einer bestimmten Handlung auf. Es kann mit einem Bild hinterlegt sein. Hintergrundfarbe mit Bild veränderbar, ohne Bild diese hier verwenden.