Dir stehen mehrere Header-Layouts für deine Website zur Verfügung. Finde das Layout, das am besten zu deinen Wünschen passt und verändere so das Aussehen deiner Website, z. B. indem du dein Logo oder den Namen deiner Website hervorhebst.
Springe zu:
So änderst du das Header-Layout
- In der Seitenleiste deines Cockpits, navigiere zu Editor.
- In der Fußleiste, wähle .
- Wähle den Tab .
- Wähle das Header-Layout, das am besten zu deinem Business passt. Bewege deine Maus über ein Header-Layout oder wähle die zugehörige Abbildung, um mehr Informationen zu der Ausrichtung des Headers und seinen Eigenschaften zu erhalten. Außerdem kannst du auf der Seite im Hintergrund eine Vorschau des Headers sehen, sobald du ein Header-Layout gewählt hast. Du kannst auch in der rechten oberen Ecke des Header-Layout-Fensters gedrückt halten und dann das Fenster bewegen, um so andere Bereiche der Seite im Hintergrund sehen zu können.
- Sobald du dich für ein Header-Layout entschieden hast, wähle Speichern.
Die verschiedenen Header-Layouts
In allen Headern werden deine Alleinstellungsmerkmale (USPs) und/oder die Ankündigungsleiste (falls aktiviert) ganz oben auf deiner Website angezeigt. Außerdem werden der Warenkorb (falls aktiviert) sowie das Symbol zum Anmelden für Kunden immer in der rechten oberen Ecke angezeigt.
Unabhängig von deinem gewählten Header-Layout wird dein Header immer in einer Version dargestellt, die für das jeweils genutzte Gerät optimiert wurde. Weitere Informationen findest du unter „Responsive Design“. Das bedeutet allerdings auch, dass dein Header auf kleineren Geräten ein wenig anders aussehen kann als beschrieben.
Du bist dir unsicher, welches Header-Layout am besten zu deinem Business passt? Sehen wir uns mal die verschiedenen Header und ihre Struktur einmal genauer an.Für die meisten Header-Layouts kannst du zwischen zwei Menü-Typen wählen. Weitere Informationen dazu findest du unter Wähle einen Menü-Typ.
Hinweis
Beachte zudem, dass deine Logo-Einstellungen sich auf dein gewähltes Header-Layout auswirken können. Du kannst die Ausrichtung des Logos in den entsprechenden Logo-Einstellungen ändern.Info
Du kannst frei entschieden, ob du dein Logo oder den Namen deiner Website im Header anzeigen möchtest. Erfahre mehr in unserem Artikel Lade ein Logo hoch.Option 1
Allgemein | Marke | Menü | Suche |
Das Suchsymbol, das Logo bzw. der Website-Name und das Hauptmenü werden in einer Zeile angezeigt. | Das Logo bzw. der Website-Name ist zentriert und wird zwischen dem Menü und dem Suchsymbol angezeigt. | Besucher können ganz links wählen, um das Menü zu öffnen. Für dieses Header-Layout ist nur dieser Menü-Typ verfügbar. | Besucher können rechts ein Suchsymbol wählen, um die Suchleiste zu öffnen. |
Mit diesem schmalen Header kannst du dein Logo / deinen Website-Namen, das Menü und das Suchsymbol in einer Zeile anzeigen. Da das Menü eingeklappt ist, liegt der Fokus dieses Layouts auf deiner Marke.
Außerdem ist der Header aufgrund des eingeklappten Menüs eine gute Wahl für große Menüstrukturen, da dieses nur dann sichtbar wird, wenn es ausgewählt ist. Das ermöglicht deinen Besuchern, sich ganz auf deine Website zu konzentrieren, ohne von einer großen Zahl von Menüeinträgen abgelenkt zu werden.
Option 2
Allgemein | Marke | Suche |
Das Logo bzw. der Website-Name, das Hauptmenü und das Suchsymbol werden in einer Zeile angezeigt. | Das Logo bzw. der Website-Name wird ganz links angezeigt. | Besucher können rechts das Suchsymbol wählen, um die Suchleiste zu öffnen. |
Da in diesem schmalen Header-Layout das Hauptmenü sehr prominent angezeigt wird, eignet es sich gut für kleine Menüstrukturen. Bei einer Struktur mit vielen Menüeinträgen im Hauptmenü könnte dieses Layout deine Besucher überfordern und den Header unübersichtlich wirken lassen.
Option 3
Allgemein | Marke | Suche |
Das Logo bzw. der Website-Name und das Suchsymbol werden in einer Zeile angezeigt. Das Hauptmenü wird in einer separaten Zeile darunter dargestellt. |
Das Logo bzw. der Website-Name ist zentriert. |
Besucher können rechts ein Suchsymbol wählen, um die Suchleiste zu öffnen. |
Mit diesem Header-Layout kannst du deinen Logo-Bereich und das Menü hervorheben.
Da das Hauptmenü in einer separaten Zeile dargestellt wird, ist dieses Layout für kleine, mittlere und große Menüstrukturen geeignet. Für sehr große Menüstrukturen ist Option 1 besser geeignet, da eine große Zahl an Menüeinträgen im Hauptmenü deine Besucher überfordern und den Header unübersichtlich wirken lassen kann.
Option 4
Allgemein | Marke | Suche |
Das Logo bzw. der Website-Name und die Suchleiste werden in einer Zeile angezeigt. Das Hauptmenü wird in einer separaten Zeile darunter angezeigt. | Das Logo bzw. der Website-Name wird ganz links angezeigt. | Die Suchleiste wird rechts angezeigt. |
Dieser linksbündige Header bietet ein erweitertes Suchfeld und hebt deine Marke sowie die Suchfunktion hervor. Dies kann hilfreich sein, wenn du eine große Produktpalette anbietest. So können deine Besucher bequem die Suchfunktion nutzen, um das gewünschte Produkt zu finden.
Da das Hauptmenü in einer separaten Zeile dargestellt wird, ist dieses Layout für kleine, mittlere und große Menüstrukturen geeignet. Für sehr große Menüstrukturen ist Option 1 besser geeignet, da eine große Zahl an Menüeinträgen im Hauptmenü deine Besucher überfordern und den Header unübersichtlich wirken lassen kann.
Option 5
Allgemein | Marke | Suche |
Die Suchleiste, das Logo bzw. der Website-Name und das Hauptmenü werden jeweils in einer eigenen Zeile dargestellt. | Das Logo bzw. der Website-Name wird ganz links angezeigt, unter der Suchleiste aber über dem Menü. | Die Suchleiste wird ganz oben links angezeigt, über dem Logo / dem Website-Namen und dem Menü. |
Dieses breite Header-Layout betont deine Marke, da es den Logo-Bereich besonders hervorhebt. Es betont zudem die Suchfunktion. Dies kann hilfreich sein, wenn du eine große Produktpalette anbietest. So können deine Besucher bequem die Suchfunktion nutzen, um das gewünschte Produkt zu finden.
Da das Hauptmenü in einer separaten Zeile dargestellt wird, ist dieses Layout für kleine, mittlere und große Menüstrukturen geeignet. Für sehr große Menüstrukturen ist Option 1 besser geeignet, da eine große Zahl an Menüeinträgen im Hauptmenü deine Besucher überfordern und den Header unübersichtlich wirken lassen kann.