Kannst du mir auf Anhieb sagen, wie der unterste Bereich deiner Website aussieht? Der Footer? Welche Elemente er enthält? Ohne zu schummeln und kurz nachzusehen?

Wenn ja, herzliche Gratulation. Dann hast du dem Footer bereits die nötige Aufmerksamkeit geschenkt.

Leider wird dieser Bereich ganz unten auf der Website sehr oft vernachlässigt. Dabei kannst du ihn nutzerfreundlich gestalten und so deinen Besuchern einen echten Mehrwert bieten.

Warum ist der Footer deiner Website so wichtig?

Als ich, vor über 20 Jahren, meine Ausbildung als Webdesignerin gemacht habe, wurde der Footer kaum beachtet. Man brachte allenfalls die Links zum Impressum und den AGB darin unter.

Zum Glück hat sich das geändert. Auch, wenn der Footer nicht an die Bedeutung des Kopfbereichs (Header) hinkommt, ist er wichtig.

Man findet dort oft Informationen wie:

  • Die Adresse
  • Wichtige Links
  • Social-Media-Präsenzen
  • usw.

Der Footer kann, muss aber nicht, auf jeder Seite deiner Website die gleichen Inhalte haben. Optisch sollte er auf jeden Fall überall gleich sein.

Er sollte sich auch klar von der restlichen Website abheben.

Sonst verwirrt das die Besucher.

Was kannst du im Footer unterbringen?

Je nach der Zielsetzung und Inhalten deiner Website kommen da verschiedene Möglichkeiten in Frage.

Der Footer eignet sich für:

  • Gütesiegel – Mit diesen schaffst du Vertrauen.
  • Die Adresse/Kontaktmöglichkeit – So ist sie schnell auffindbar.
  • Eintrag in den Newsletter – So hat der Besucher auf jeder Seite die Möglichkeit sich einzutragen.
  • Social-Media-Icons – So finden dich deine Besucher auf weiteren Kanälen.
  • Wichtige Links zu untergeordneten Seiten – Zum Beispiel zur Über mich-Seite oder Produkte-Seiten.
  • Ein bis drei News – So kannst du deinen Besuchern gleich zeigen, dass deine Website immer wieder Neues zu bieten hat. So lohnt sich ein weiterer Besuch.

Impressum, Datenschutz, AGB – Kurz alle rechtlichen Links.

Du siehst, es gibt sehr vieles, dass du in den Footer packen kannst. Trotzdem solltest du ihn nicht überladen. Er sollte übersichtlich bleiben.

Deshalb ist es wichtig, dass du auch hier das Ziel deiner Website im Auge behältst und den Footer darauf ausrichtest.

Muss der Footer auf jeder Seite gleich aussehen?

Das ist gar nicht so einfach zu beantworten.

Der Footer sollte immer gleich gestaltet sein. So, dass der Besucher weiss, dass er im Footer ist.

Trotzdem würde ich nicht immer exakt die gleichen Inhalte einfügen. Beispielsweise macht es keinen Sinn auf der Kontaktseite auch in der Fusszeile die Adresse und die Kontaktmöglichkeiten zu wiederholen.

Oder auf der News-Seite nochmals unten die News aufzuschalten.

Du siehst, worauf ich hinauswill. Generell sollte der Footer überall das gleiche Design haben. Trotzdem solltest du entscheiden, ob der gleiche Inhalt immer sinnvoll ist.

Aber die Leute scrollen doch nicht gern

Macht die Arbeit für den Footer dann wirklich Sinn?

Ist das wirklich so? Scrollen die Nutzer nicht gern? Gerade wer mit dem Handy unterwegs ist, muss regelmässig scrollen. Deshalb hat sich das Verhalten in diesem Bereich verändert. Nach unten scrollen gehört mittlerweile dazu.

Das bestätigt auch der Artikel: „Niemand scrollt auf Webseiten».

Sicher kannst du das auch selbst bestätigen. Oder stört dich runterscrollen wirklich?

Design des Footers – So kannst du ihn gestalten

Das Design des Footers solltest du zwar individuell auf deine Website abstimmen. Trotzdem gibt es ein paar Regeln, die du beachten solltest.

  1. Der Footer sollte klar vom Rest der Website abgetrennt sein. Zum Beispiel mit einer anderen Farbe. Allenfalls genügt auch eine Trennlinie.
  2. Besonders wichtig ist, dass der Footer übersichtlich ist. Lege 2 – 4 Blöcke fest, die du befüllst. Dazwischen sollte genügend Platz (Weissraum) sein, damit die Inhalte gut erfasst werden können.
  3. Da das Platzangebot gering ist, musst du dir vorher genau überlegen, was du in den Footer packen willst. Wie unterstützt du damit das Ziel deiner Website am besten? Hier gilt ganz klar: Weniger ist mehr.

Damit dir die Links zum Impressum und Datenschutz nicht zu viel Platz wegnehmen, kannst du sie auch in den untersten Bereich packen.

Footer Naturkraft Gort

Es lohnt sich diesen Bereich optisch abzugrenzen. Das kann durch einen anderen Farbton oder eine Linie passieren.

Praxistipp: Schau dir den Footer unbedingt auch auf dem Handy und Tablet an. Auch da muss er noch übersichtlich sein.

Inspiration für grossartige Footer

Das war die graue Theorie. Nun sehen wir uns ein paar Praxisbeispiele an, damit alles für dich greifbarer wird.

Ich empfehle dir, wenn du durchs Netz surfst, einmal auf die Footer zu achten und dir passende Footer abzuspeichern. Oder du machst einen Screenshot.

So kannst du dir deine eigene «Best-Practice-Sammlung» anlegen.

Huplant – Die Gärtnerei

Beginnen wir mit dem wunderschön gestalteten Footer von Huplant.

Footer - Gärtnerei Huplant

https://www.huplant.ch/

Hier wird das Design der Website weitergezogen. Die ganze Website ist sehr liebevoll gestaltet und das zeigt sich auch hier im Footer.

Es gibt 4 Punkte, die hier aufgegriffen werden:

  • Die Adresse der Gärtnerei
  • Die des Cafés
  • Die Social-Media-Präsenzen
  • Die rechtlichen Links

Damit ist der Footer sehr schlicht. Besonders wichtig ist hier, dass sich die Werte der Firma auch im Footer widerspiegeln. Die Liebe zu Pflanzen.

Und das ist auf jeden Fall gelungen.

Obi

Hier haben wir einen rein praktischen Footer, der hervorragend designt wurde.

Der Footer wurde durch klare Blöcke so gestaltet, dass viele Informationen untergebracht werden konnten. Trotzdem ist er übersichtlich geblieben.

Footer - Obi

https://www.obi.ch/

Durch den orangen Block wird die Eintragung in den Newsletter hervorgehoben und gleichzeitig vom Rest der Website abgetrennt.

Danach kommt ein weisser Block, der die wichtigsten Vorteile bei einem Kauf nochmals hervorhebt.

Erst jetzt kommt die eigentliche Fusszeile in einem hellen Grau. Hier gibt es wichtige Links und Informationen rund um Obi und für die Käufer.

Terminal 42

Ein Contao-Webdesigner hat eine ganz spezielle Website mit einem ebensolchen Footer geschaffen.

Footer - Terminal42 - Contao

https://www.terminal42.ch/de/

Achtung: So genial ich das finde, es muss passen! Hier habe ich diesen Footer nur aufgenommen, um dir zu zeigen, was mit Kreativität alles möglich ist.

Du siehst, dass der Footer ähnlich wie ein Flugticket gestaltet ist. So schön das ist, der Platz ist dadurch eingeschränkt. Aber zu der Website passt es natürlich perfekt.

Ausserdem haben sie sich viel Mühe gemacht, damit die Website auch auf dem Handy und dem Tablet toll aussieht. Bei einem solchen Design wird das schnell aufwendig.

Anne Janzen – Gestalttherapie

Die bisherigen Footer waren relativ aufwendig. Sei es, weil viele Inhalte untergebracht worden sind oder vom Design her.

Deshalb hier noch ein schlichter Footer:

Footer - Anne Janzen

https://www.annejanzen-gestalttherapie.de/

Hier werden nur die Adresse/Kontaktmöglichkeit und die rechtlichen Links untergebracht.

Das kann völlig reichen. Es hängt ganz von dir und deinen Lieblingskunden ab.

Mösch AG – Sanitär / Solarenergie / Spengler

Dieser Footer ist mir kürzlich begegnet, als ich nach einem Spengler gesucht habe. Mir haben die geschwungenen Linien sehr gut gefallen.

Footer - Mösch AG

Auch der Call-to-Action ist hervorragend gemacht. Inspiriert? Finde ich viel schöner, als Interessiert.

Dann wird nochmals das Logo wiederholt, die Adresse angegeben und auf die Social-Media-Kanäle hingewiesen. Danach noch die Logos der Partner gezeigt.

Ganz unten dann die rechtlichen Links.

Mein eigener Footer

Der Footer auf meiner Website ist zwar schlicht, aber enthält trotzdem viele Informationen. Sie sind in Blöcke gegliedert. So kann das Auge besser erfassen, was zusammengehört.

Footer - Claudia Barfuss

https://claudiabarfuss.ch/

Du findest dort neben der Adresse mit E-Mail auch die Links zu den wichtigsten Seiten sowie meine Social-Media-Präsenzen.

Unten dann noch die rechtlichen Links.

Jetzt hast du schon einige Inspirationen bekommen, um deinen Footer zu gestalten. Viel Spass dabei!

Hinterlasse einen Kommentar

Bitte fülle alle Felder mit einem * aus. Deine Mailadresse wird nicht angezeigt werden. 

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
Claudia Barfuss - Die Website-Mentorin WordPress Cookie Plugin von Real Cookie Banner