Footer-Struktur: Von Basics bis zur Mega-Footer
Lern die Unterschiede zwischen Standard-Footern und Mega-Footern. Wir zeigen dir, wann welche Struktur sinnvoll ist.
Zum ArtikelWie du Telefonnummern, E-Mail-Adressen und Social-Media-Links sinnvoll im Footer platzierst — für verschiedene Website-Typen
Der Footer ist oft der letzte Eindruck, den Besucher von deiner Website haben. Viele Nutzer scrollen direkt nach unten, um Kontaktinformationen zu finden — nicht nach oben zur Navigation. Das heißt: Wer hier keine klaren, gut erreichbaren Kontaktdaten anbietet, verschenkt potenzielle Anfragen.
Es geht nicht nur darum, deine Telefonnummer irgendwo hinzuschreiben. Es’s vielmehr eine strategische Entscheidung, wie du deine Kontaktdaten strukturierst, welche Informationen du priorisierst und wie du sie visuell hervorhebst. Unterschiedliche Website-Typen — ob E-Commerce, Agentur, lokales Geschäft oder Dienstleister — brauchen unterschiedliche Ansätze.
Nicht jede Information gehört in jeden Footer. Es kommt darauf an, was dein Geschäft ist. Trotzdem gibt es einige Basis-Elemente, die du fast immer brauchst:
Formatiert mit Link (href=”tel:”). Nicht alle Besucher wollen E-Mails schreiben — manche wollen direkt anrufen.
Mit mailto-Link. Sichtbar und clickable. Manche setzen sie auch als grafisches Element ein, aber das ist weniger barrierefrei.
Falls du ein Geschäft mit physischem Standort hast. Mit Link zu Google Maps erhöhst du die Usability erheblich.
Zeige Montag bis Freitag, Samstag (falls relevant), und ob du gerade offen oder geschlossen bist. Das spart dir viele unnötige Anfragen.
Wie viel Platz hast du? Das hängt von der Größe deiner Website ab. Bei 5-10 Seiten brauchst du keine Sitemap im Footer. Bei 50+ Seiten ist ein strukturierter Mega-Footer sinnvoll.
Die Kontaktinformationen gehören aber immer prominent platziert — ganz oben im Footer oder in einer separaten Spalte, die nicht übersehen wird. Manche Designer setzen Kontaktdaten sogar in eine Highlight-Box, um sie hervorzuheben.
Wichtig: Mobile First! Im mobilen Footer braucht der Nutzer die Kontaktdaten sofort. Lange Sitemaps nach oben scrollen — das nervt. Sortiere deine Footer-Elemente nach Relevanz, nicht nach Struktur.
Hier ist ein Support-Link das Wichtigste. Telefonnummer für Notfälle. Adresse nur, wenn du ein Geschäft mit Ladenöffnung hast. Newsletter-Anmeldung gehört auch her, aber untergeordnet.
Telefon, Adresse, Öffnungszeiten sind König. Google Maps Link ist essentiell. Reservierungs-Button kann hier sinnvoll sein. Social Media Links (Instagram für Food-Fotos!) sollten prominent sein.
E-Mail und Kontaktformular-Link sind zentral. Mehrere E-Mail-Adressen (Sales, Support, Info) für verschiedene Anliegen. Vielleicht auch Telefon für schnelle Anfragen. Öffnungszeiten helfen bei Timezone-Missverständnissen.
E-Mail ist meist ausreichend. Telefon optional. Social Links (LinkedIn, Behance, GitHub) sind wichtig für Glaubwürdigkeit. Kurze Öffnungszeiten können helfen, Erwartungen zu managen.
Telefonnummern sollten mit href=”tel:” verlinkt sein. So können Mobile-Nutzer direkt anrufen. E-Mails mit href=”mailto:”. Adressen idealerweise mit einem Google Maps Link.
Strukturierte Daten helfen auch. Mit Schema.org kannst du deine Kontaktinformationen so markieren, dass Google sie richtig versteht. Das verbessert deine Chancen, in den lokalen Suchergebnissen zu erscheinen.
Farben: Kontaktdaten sollten in einer anderen Farbe sein als normale Text-Links. Das macht sie sofort erkennbar. Achte aber auf Kontrast — weiße Schrift auf gelbem Hintergrund ist unlesbar.
Bevor du deinen Footer live nimmst, überprüfe diese Punkte:
Telefonnummer ist clickable (tel: Link) und mobil-freundlich
E-Mail ist funktionsfähig (mailto: Link) und deutlich sichtbar
Adresse mit Google Maps Link versehen
Öffnungszeiten aktuell und präzise
Social-Links sind aktiv und führen zu gepflegten Profilen
Mobile-Ansicht: Kontaktdaten sind nicht gequetscht
Kontrast-Check: Alle Texte sind lesbar
Strukturierte Daten (Schema.org) implementiert
Eine gut strukturierte Kontaktsektion im Footer ist keine Nice-to-Have — es’s eine Notwendigkeit. Nutzer wollen schnell wissen, wie sie dich erreichen können. Gib ihnen das, was sie suchen.
Mehr über Footer-Design erfahren
Lern die Unterschiede zwischen Standard-Footern und Mega-Footern. Wir zeigen dir, wann welche Struktur sinnvoll ist.
Zum Artikel
So gestaltest du einen übersichtlichen Footer mit mehreren Spalten — mit logischer Gruppierung und gutem Spacing.
Zum Artikel
Schrift, Farbe und Abstände gezielt einsetzen, um deinen Footer übersichtlich und benutzerfreundlich zu machen.
Zum ArtikelDieser Artikel bietet allgemeine Best Practices für die Gestaltung von Kontaktinformationen im Footer. Die konkrete Umsetzung hängt von deinen spezifischen Anforderungen, deiner Zielgruppe und deinem Design-Ansatz ab. Datenschutz- und Barrierefreiheits-Richtlinien sollten immer beachtet werden. Testen deinen Footer mit echten Nutzern, um sicherzustellen, dass die Kontaktdaten leicht zu finden und zu nutzen sind.
Social-Media-Links im Footer: Sichtbar, aber nicht dominant
LinkedIn, Instagram, Facebook — viele Websites verlinken ihre Social-Media-Profile im Footer. Das ist sinnvoll, aber bitte nicht zu prominent. Die Kontaktdaten sollten Vorrang haben.
Nutze kleine Icons (24-32px) statt großer Buttons. Gruppiere sie zusammen, idealerweise rechts oder unten. Verlinke nur zu Profilen, die du aktiv pflegst — ein inaktives Facebook-Profil wirkt unprofessionell.