Zeigt her Eure Footers! – Design Patterns für die Webseiten-Fußzeile

5. April 2019

Manch einer sieht ihn nie – denn oftmals verlassen Besucher eine Webseite, noch bevor sie das untere Ende und damit den Footer erreicht haben. Auch beim Designen fällt dieser Bereich immer wieder hinten rĂĽber. Doch auch hier gibt’s einiges zu beachten, denn es kann des Besuchers letzter Versuch sein, etwas auf der Seite zu finden.

Die FuĂźzeile einer Webseite

Webseiten müssen ansprechen und den Nutzer möglichst auf den ersten Blick einfangen. Aus diesem Grund gilt es, den Navigations- und Hauptteil einer Seite möglichst fesselnd aber gleichzeitig nicht zu unübersichtlich zu gestalten. Hier wird das interessante und relevante platziert, sodass der Besucher möglichst schnell findet was er braucht. Je weiter der Besucher herunterscrollt, desto weniger relevant sind oftmals die Informationen und Inhalte, bis er schließlich zum Seitenende, und damit zum Footer gelangt. Dort befinden sich meist nur die Informationen zum Seiteninhaber (Impressum), rechtliche Aufklärung über die Nutzung (AGBs, Datenschutzrichtlinien) und neben den Kontaktmöglichkeiten führen hier typischerweise platzierte Vögel, Kameras und weitere Icons zu den jeweiligen Social Media Seiten.

Der Begriff Footer stammt dabei ursprünglich aus dem Bereich der Printmedien und bezeichnete dort einen konstanten Bereich mit Informationen, meist am unteren (oder auch oberen) Seitenrand. Dieses Design Element wurde im Web-Design übernommen, hat sich über die Zeit jedoch verändert und erweitert, insbesondere durch interaktive Buttons/Links.

Jedem Fuß sein passender Schuh – Grundlagen des Footer-Designs

Die Inhalte eines Footers sind in ihrem Umfang verschieden gestaltbar und sollten sich nach dem Inhalt und Design der Seite richten. Sie beinhalten meist nachrangige Informationen, die nicht direkt den eigentlichen Inhalt betreffen. Sie mĂĽssen dabei nicht zwangsläufig am Seitenende angezeigt werden, sondern können als kompaktes Element auch am rechten Seitenrand platziert werden oder – wie auf der dieser Seite zu sehen – ganz oben. Bei Seiten wie beispielsweise Facebook mit ständig nachrutschendem Content macht ein mitwandernder Footer rechts vom Hauptinhalt mehr Sinn (s. Abbildung 1), denn hier scheint das Seitenende oft unerreichbar. Unabhängig davon sollte der Footer durch die Verwendung von eindeutigen und verständlichen Links und Icons ĂĽbersichtlich sein und bleiben, da der Footer sonst schnell wieder auĂźer Acht gelassen wird. Wichtig ist daher auch eine erkennbare Struktur und Ordnung in der Auflistung der Elemente.


Abbildung 1: Footer auf Facebook.com als mitwanderndes Element am rechten Seitenrand

Im Folgenden werden einzelne Elemente genauer beschrieben und ihre Wichtigkeit fĂĽr den Footer und die Seite genannt:

Kontaktinformationen und Support werden mittlerweile häufig direkt im Footer gesucht. Dies hilft dem Nutzer, bei Fragen zu Produkten oder Informationen schnell Antworten zu finden („FAQs“) oder einen Kontakt herzustellen oder sich mit einem Unternehmen ĂĽber einen Newsletter oder sozialen Kanälen zu verbinden, wie in Abbildung 2 zu erkennen ist. Bei der Erwähnung von sozialen Kanälen sollte jedoch geprĂĽft werden, wie aktuell und regelmäßig der dortige Feed ist. Kontaktinformationen sind aber auch gerade deshalb wichtig, damit klar ist, wer der Betreiber einer Seite ist, um bei Datenschutzverletzungen oder anderen Anliegen den Seiteninhaber direkt kontaktieren zu können.


Abbildung 2: Footer auf ecosia.org mit Links zu sozialen Medienkanälen und weiterführenden Informationen zu den Inhalten (FAQ, Presse, Datenschutz)

In-Page-Links ermöglichen dem Besucher ebenfalls schnell wieder an den Seitenanfang oder beispielsweise in eine der Hauptkategorien zu gelangen (s. Abbildung 3). Dies ist insbesondere dann nützlich, wenn die Seiten viel Inhalt und Informationen zeigen und dadurch viel Scrollarbeit erfordern. Ein Navigationsmenü (in verkleinerter Form) kann daher auch ähnlich einer Sitemap im Footer nützlich sein.

Sitemaps helfen Besuchern insbesondere dann, wenn die Seiten lang und/oder mit vielen Unterseiten und -menüs versehen sind. Weiß der Nutzer sich in der Navigation am Seitenanfang nicht zurechtzufinden, kann er hierüber schnell alle Bereiche relativ übersichtlich einsehen. Gerade hier sollte die meist hierarchische Auflistung aber nicht zu sehr in die Tiefe gehen, sondern sich auf die wichtigsten Kategorien (Hauptkategorien und erste Unterebene) beschränken.

Unternehmensspezifische Anliegen werden, sofern sie nicht direkt mit dem Seiteninhalt in Verbindung stehen ebenfalls häufig hier platziert. Sie richten sich meist an sekundäre Zielgruppen, die weniger an den auf der Seite dargestellten Angebote und Dienstleistungen interessiert sind. Möchte man sich zum Beispiel wie in Abbildung 3 bei einem Reiseportal über offene Stellen informieren, oder Kooperationen mit dem Unternehmen eingehen, können diese im Footer verbaut werden, um so nicht vom Seiteninhalt abzulenken. Hier finden sich häufig auch Links zu Partner- oder Tochterseiten wieder (s. Abbildung 4).


Abbildung 3: Footer auf trivago.de mit Informationen zu Karriere- und Kooperationsmöglichkeiten


Abbildung 4: Footer auf amazon.de mit umfangreichen Informationen zum Unternehmen und den Dienstleistungen

Verweise auf Auszeichnungen und Mitgliedschaften in Organisationen schaffen beim Nutzer vor allem bei unbekannteren Webseiten und Unternehmen Vertrauen und verweisen auf ihre Kompetenz und GlaubwĂĽrdigkeit sowie ihr Engagement (s. Abbildung 5). Hierbei sollte aber auf understatement gesetzt werden, da die Wahrnehmung ansonsten ins ĂĽberhebliche kippen oder auch Misstrauen wecken kann (Versuch von Fehlern abzulenken).


Abbildung 5: Footer auf edeka24.de mit Kontaktinformationen, Hilfemöglichkeiten und Auszeichnungen (bzgl. Sicherheit)

Footers punkten durch Einfachheit und Ăśberschaubarkeit

Der Footer einer Seite sollte beim Designen der Webseite nicht zu kurz kommen. Er sollte zum restlichen Seitenaufbau passen, in seiner Erscheinung aber möglichst schlicht und einfach sein, da sie zum einen eher nachrangige Informationen preisgeben und für den Nutzer der letzte Anker sein können, wenn sie etwas auf der Seite suchen, jedoch im Hauptbereich nicht finden. Gemäß der Erwartungskonformität nach ISO 9241-110 ist es daher sinnvoll diese am unteren Enden der Seite zu platzieren und weiterhin seine Aktionsmöglichkeiten gemäß der Selbstbeschreibungsfähigkeit nach ISO 9241-110 klar und eindeutig definieren.

Quelle: https://www.nngroup.com/articles/footers/

Diesen Beitrag bookmarken bei:
Bookmark bei: Yigg Bookmark bei: Webnews Bookmark bei: Technorati Bookmark bei: Mr. Wong Bookmark bei: Linkarena Bookmark bei: Del.icio.us Bookmark bei: Google Bookmark bei: Favoriten Bookmark bei: Facebook

Autor des Beitrags