Hero

Die Bühne oben auf der Seite mit Überschrift, kurzem Text, Buttons und Bild, in drei Varianten.

Wofür

Der Hero ist der Einstieg einer Seite: eine große Überschrift, ein, zwei Sätze, die wichtigsten Buttons und meist ein Bild. Er steht fast immer ganz oben. Sie finden ihn in der Gruppe Einstieg.

Felder

• Variante:
  • Bild im Hintergrund: das Bild füllt die ganze Bühne, der Text steht hell auf einem dunklen Verlauf darüber.
  • Bild und Text nebeneinander: Text links, Bild rechts. Am Handy steht das Bild unter dem Text.
  • Nur Text: ohne Bild, etwa für Unterseiten.
• Dachzeile und Überschrift (Pflicht): siehe Grundsätzliches. Die Überschrift ist die Hauptüberschrift der Seite, wenn der Hero ganz oben steht.
• Text: ein bis drei Sätze, fett, kursiv und Links sind möglich.
• Bild (Pflicht, außer bei Nur Text) mit Alternativtext (optional).
• Buttons: bis zu zwei.
• Vorteile: bis zu vier kurze Punkte unter den Buttons, jeder mit Häkchen, etwa „Unabhängige Beratung“ oder „Termin in 48 Stunden“.

So verhält sich der Block

• Steht der Hero ganz oben, lädt die Website sein Bild zuerst. So erscheint die Seite schnell.
• Bei Bild und Text nebeneinander wird das Bild auf 4:3 zugeschnitten, bei Bild im Hintergrund auf die Fläche der Bühne. Der Fokuspunkt bestimmt den Ausschnitt.
• Bei Bild im Hintergrund gilt das Bild als Schmuck und wird Screenreadern nicht vorgelesen. Möchten Sie das, tragen Sie einen Alternativtext (optional) ein.
• Fehlt ein Bild, zeigt die Website den Hero als Nur Text.

Tipps

• Eine starke Überschrift sagt in wenigen Wörtern, was Sie anbieten, für wen und warum. Betonen Sie ein Wort mit Sternchen: Steuerberatung, die *mitdenkt*.
• Nur ein Primär-Button. Ein zweiter Button als Sekundär bietet die Alternative.
• Für Bild im Hintergrund eignen sich ruhige Bilder mit Platz unten links, wo der Text steht.
• Querformat mit mindestens 1920 Pixel Breite sieht auch auf großen Bildschirmen scharf aus.