Definition
Der Header (Kopfzeile) ist der oberste Bereich einer Webseite, der die Hauptnavigation, das Logo und häufig einen Call-to-Action enthält. Als erstes sichtbares Element beim Seitenaufruf prägt der Header den ersten Eindruck und steuert die Nutzerführung über die gesamte Website.
Bedeutung
Der Header ist das primäre Orientierungselement einer Website. Er muss innerhalb von Sekunden die Markenidentität kommunizieren und dem Besucher die Navigation zu den wichtigsten Seiten ermöglichen. Aus SEO-Perspektive definiert der Header über die Hauptnavigation, welche Seiten als besonders relevant eingestuft werden.
Funktionsweise
Der Header wird als globales Template-Element definiert und auf jeder Seite identisch dargestellt. Technisch wird er als semantisches HTML-Element ausgezeichnet, das Suchmaschinen-Crawlern die Unterscheidung vom Hauptinhalt ermöglicht. Moderne Header verwenden Sticky-Navigation und responsive Breakpoints, die auf mobilen Geräten ein Hamburger-Menü anzeigen.
Praxisbeispiel
Der Header einer Agentur-Website enthält links das Logo (verlinkt auf die Startseite), mittig die Hauptnavigation mit den drei Service-Säulen und rechts einen CTA-Button „Kontakt“. Auf mobilen Geräten kollabiert die Navigation in ein Hamburger-Menü. Das Logo wird als optimiertes SVG geladen.
Verwandte Begriffe
- Footer: Der untere Bereich einer Webseite mit sekundärer Navigation — das Gegenstück zum Header.
- Above the Fold: Der sofort sichtbare Bereich beim Seitenaufruf, zu dem der Header gehört.
- Hamburger-Menü: Ein mobiles Navigationspattern, bei dem die Hauptnavigation hinter einem Icon verborgen wird.
- Sticky Navigation: Eine Technik, bei der der Header beim Scrollen fixiert bleibt.