Footer: Design-Tipps und 4 inspirierende Beispiele für Ihre Website

Der Footer einer Website fristet leider oft ein Schattendasein, denn im Fokus eines Internetauftritts stehen zunächst der Content, das Design, die Usability und SEO. Dennoch sollten Sie sich mit der Gestaltung des Footer-Bereichs Ihrer Website auseinandersetzen, da er sehr viel Potenzial bietet. Ein Footer, der User und Userinnen optimal unterstützt, kann sogar das Ranking Ihrer Website positiv beeinflussen.

Lesen Sie in unserem Artikel, wie Sie den Footer Ihrer Webseite optimieren, und lassen Sie sich von Best Practice Beispielen inspirieren. 

Warum ist der Footer einer Website so wichtig?

Der Footer ist der Abschluss einer Internetseite und befindet sich immer an der untersten Position. Als globales Element ist er von jeder Seite aus erreichbar und immer identisch. Er agiert mit dem Header als optische Klammer einer Website und lässt sich hierarchisch in zwei Ebenen untergliedern.

Der Footer ist das, was üblicherweise als Footer bezeichnet wird, nämlich der untere, fixe Bereich einer Website, der weitere Informationen wie Links oder Suchfelder enthält. Der Sub-Footer ist häufig eine Ergänzung zum Footer; dabei handelt es sich um eine farblich abgesetzte Leiste am untersten Rand der Website mit deutlich weniger Inhalten.

Der Footer gehört zu einer der wichtigsten Konstanten beim Website-Layout. Wie auch bei der Navigation oder dem Header handelt es sich beim Footer um ein wichtiges Strukturelement, an welchem sich die Besucher und Besucherinnen der Website orientieren. Je klarer, intuitiver und verständlicher seine Struktur, desto effizienter und schneller können die Inhalte erfasst werden. Der Footer trägt somit wesentlich zur positiven Nutzererfahrung der Website bei. 

Was ist das beste Website Footer Design?

Das Design des Footers sollte sich visuell klar vom Hauptinhalt der Website unterscheiden. So wird den Besuchenden signalisiert, dass er sich am Ende der Seite befindet. Meist wird der Footer farblich anders gestaltet als der Body der Internetseite. Grundsätzlich gibt es keine Vorgaben für das Webdesign des idealen Footers. Er sollte ins Look and Feel der Website passen, gut lesbar und optisch ansprechend sein.

Was kommt in den Footer?

Wichtigster Bestandteil eines Footers sind rechtliche Pflichtangaben wie Impressum, Datenschutz und AGB sowie ein Hinweis zum Copyright. Alle weiteren Elemente sind abhängig von der Art der Seite und der Branche. Meist ist ein Footer in mehrere Sektionen unterteilt, die zum Beispiel Informationen zum Unternehmen, Vorteile und Services sowie Hilfe- und Kontaktmöglichkeiten behandeln.

Bei Shops sollten auch Zahlungs- und Liefermodalitäten sowie etwaige Versandpartner oder Gütesiegel enthalten sein. Auch Newsletter-Masken oder Social Media Icons sind häufig im Footer anzutreffen.

Wie muss ein Footer aussehen?

Das Design eines Footers sollte zum Gesamtbild der Webseite passen, aber sich dennoch vom Rest des Seiteninhalts abheben, zum Beispiel durch dunklere Absetzung des Hintergrunds.

Sein Aufbau muss klar und übersichtlich gestaltet sein, damit sich Userinnen und User schnell und intuitiv zurechtfinden, was in der Regel durch den Einsatz verschiedener Sektionen oder Icons gelöst wird. Wichtig ist, dass alle rechtlichen Angaben gut auffindbar sind. Häufig werden diese in einem separaten Sub-Footer dargestellt. 

Wichtige Footer-Elemente: Copyright und rechtliche Pflichtangaben

Noch bedeutender als das Design sind die Elemente im Footer, denn diese haben die Aufgabe, den User und die Userin während der Websitenutzung bei der Suche nach bestimmten Informationen zu unterstützen. Typischerweise ist ein Footer in mehrere Sektionen unterteilt, die verschiedene Elemente und Themen abdecken. Solche sind zum Beispiel:

• Anmeldungsmaske für Newsletter
• Vorteile und besondere Services
• „Über uns“ mit Unternehmensgeschichte, Jobs und Presse
• Kontaktmöglichkeiten und Help Center
• Social Media Icons
• Sitemap

Bei Online-Shops kommen noch weitere Elemente hinzu, etwa Zahlungs- und Liefermodalitäten oder diverse Gütesiegel und Auszeichnungen, um die Seriosität der Website zu unterstreichen. Daneben findet sich im Footer das Copyright beziehungsweise der Urheberrechtshinweis. Dadurch schützen Sie die auf der Seite genutzten Grafiken, Texte und weiteren Inhalte, sodass diese nicht von Dritten verwendet werden dürfen.

Zu den rechtlichen Pflichtangaben im Footer zählen:

• Impressum: In Deutschland gilt eine Impressumspflicht für Webseiten. Was dieses beinhalten muss, regelt seit 2007 das Telemediengesetz (§ 5 TMG).

• Datenschutzerklärung

• Allgemeine Geschäftsbedingungen (AGB) und Widerrufsbelehrung bei Webshops

Was ist bei der Footer Navigation zu beachten?

Ein Footer-Menü hat den Vorteil, dass die User und Userinnen der Website nicht erst wieder nach ganz oben scrollen müssen, um zurück zum Hauptmenü zu kommen. Das heißt allerdings nicht, dass beide Menüs dieselben Informationen beinhalten müssen oder sollen – orientieren Sie sich dazu am besten an den Standards Ihrer Branche.

Eine optimale Basis für die Entscheidung, ob und welches Menü im Footer angezeigt werden soll, bilden benutzerzentrierte Methoden, beispielsweise Personas, Usability Tests und Fokusgruppen. So können Sie einschätzen, welche Inhalte im Footer benötigt werden.

Wie verhält es sich mit Footer und SEO?

Niemand hat Lust, sich eine halbe Ewigkeit durch eine Website zu klicken, nur um eine bestimmte Information in Erfahrung zu bringen – wenn man sie denn findet. Werden solche relevanten Inhalte direkt im Hauptmenü und im Footer aufgezeigt, steigert dies nicht nur die Zufriedenheit der Besuchenden, sondern auch deren Verweildauer. Dies führt automatisch zu besseren SEO-Werten.

Lassen Sie sich inspirieren: Best Practice Footer Beispiele

Der optimale Aufbau eines Footers hängt immer von der Branche, der Produktpalette und anderen Faktoren ab. Wir stellen Ihnen deshalb eine kleine Auswahl an Footer-Beispielen vor, die die genannten Aspekte kreativ umsetzen. 

Zalando

Beim Onlinehandel Zalando sind alle wichtigen Informationen im Footer nach Themen strukturiert, zum Beispiel „Hilfe & Kontakt“, „Gutscheine“ oder „Über uns“. Icons unterstützen die Menüpunkte zusätzlich. Da beim Shoppen im Web verschiedene Zahlungsarten verwendet werden, listet Zalando die möglichen Zahlarten auf. Die Versandpartner werden ebenfalls aufgelistet, um Vertrauen zu wecken. Zusätzlich finden sich die rechtlichen Angaben sowie alle Social-Media-Kanäle und die unternehmenseigenen Apps.

Quelle: Screenshot Zalando

Uber

Die globale Uber Website nutzt den Footer unter anderem für das Help Center. Weitere relevante Informationen zum Unternehmen und den Produkten werden strukturiert nach Themen angeboten. Praktisch sind auch hier die beiden App-Verlinkungen sowie die jeweiligen Social Media Icons. Das Design ist, wie die Seite an sich, sehr schlicht gehalten. Im Sub-Footer stehen das Copyright sowie Angaben zum Datenschutz, zur Barrierefreiheit und zu den Nutzungsbedingungen.

Quelle: Screenshot Uber

Cerascreen

Der Footer der Website von Cerascreen, einem Anbieter von medizinischen Tests und Gesundheitsprodukten, bietet vergleichsweise detaillierte Inhalte in zehn Sektionen an, darunter auch beliebte Marken, relevante Themen im Gesundheitsportal und Test-Empfehlungen. Darüber findet sich ein Teaser zur Newsletter-Anmeldung und ein Weiterempfehlungslink. Farblich passt der Footer sehr gut zum generellen Website-Design und vermittelt einen rundum professionellen Eindruck.

Quelle: Screenshot Cerascreen

Obi

Recht komplex ist auch der Footer des Baumarkts OBI, der in drei große Bereiche plus Sub-Footer aufgeteilt ist. Den Beginn machen eine Newsletter-Box und ein App-Hinweis. Darunter folgen diverse Vorteile des Unternehmens sowie ein klassischer Footer-Bereich mit Sektionen zu den Zahlungsarten, zum Unternehmen, zu Services, Social Media und vielem mehr. Die unterschiedliche Farbgebung separiert die Bereiche optimal und verschafft dem Footer trotz seiner Größe eine gute Übersichtlichkeit.

Quelle: Screenshot OBI

Fazit: Der perfekte Footer für Ihre Website 

Ein schön gestalteter, übersichtlicher Footer rundet Ihren professionellen Online-Auftritt ab und trägt zu einer Verbesserung der User Experience bei. Gestalten Sie den Footer für Ihre Kunden und Kundinnen ansprechend und bieten Sie diejenigen Informationen an, die auch wirklich gewünscht und benötigt werden.

Berücksichtigen Sie dabei die grundsätzliche Navigation, die Standards Ihrer Branche und die Art Ihrer Website – für einen Shop, Blog, B2B- oder B2C-Kommunikation können unterschiedliche Konzepte notwendig sein. Rechtspflichtige Angaben wie Impressum oder Datenschutz können in einen Sub-Footer gesetzt werden, um diese gesondert zu präsentieren.

Titelbild: Thitiphat Khuankaew / iStock / Getty Images Plus