Skip links
KOSTENLOSES Voraudit
Keyweo logo
Pré-audit GRATUIT
Facebook Linkedin

Footer

Definition

Die Fußzeile, besser bekannt unter dem englischen Begriff “Footer”, bezeichnet den unteren Teil einer Seite. In HTML wird dieser Abschnitt durch den Tag < footer > übersetzt, der alle Elemente enthält, die sich dort befinden müssen. In der Regel ist der Footer auf jeder Seite einer Website gleich. Er wird daher in die Templates der Seiten aufgenommen, damit er auf der gesamten Website verwendet werden kann. Da der Footer das letzte Element einer aufgerufenen Seite ist, ist es außerdem wichtig, ihn zu optimieren, um ihn attraktiv und interessant zu gestalten.

Konkret kann die Fußzeile einer Website Folgendes enthalten: einen SEO-optimierten Text mit strategischen Keywords, Kontaktinformationen des Unternehmens (Adresse, Kontaktdaten), die Karte der Website, das Impressum der Website, interne Links zu Seiten der Website (Kontakt, Über uns etc.), sekundäre Navigationslinks, Ihre sozialen Netzwerke etc.

SEO Technique

Schnellzugriff

Welche Relevanz hat der Footer in der SEO?

In der SEO-Logik ist der Footer ein strategischer Bereich, den es zu bearbeiten gilt. Er bietet einen Mehrwert für Ihre Website, indem er Inhalte von tieferliegenden Seiten, externe Links und zusätzliche Informationen anbietet, die für Besucher interessant sein könnten.

Darüber hinaus kann die Fußzeile Ihre interne Verlinkung stärken, indem sie auf tiefere Inhalte verweist, die nicht direkt von der ersten Ebene Ihres Hauptmenüs aus zugänglich sind. Das Erstellen eines Footers auf Ihrer Website ist nicht zwingend erforderlich, wird aber dringend empfohlen, wenn Sie Ihre organischen Suchmaschinenergebnisse optimieren möchten.

Der Footer ermöglicht es Ihnen also, den Inhalt Ihrer Website mit zusätzlichen Informationen anzureichern, die Sie nicht direkt im Hauptmenü anzeigen lassen möchten. Bei der Erstellung einer Website ist der Footer nicht vordefiniert. Sie müssen ihn daher mit den Inhalten optimieren, die Sie für relevant halten.

Gestalten Sie Ihren Footer attraktiv

Die Fußzeile muss, ebenso wie Ihre Seiten, sinnvoll gestaltet werden, um Ihre Besucher anzuziehen und sie dazu zu bringen, den dort präsentierten Inhalt zu durchsuchen. Dafür ist es wichtig, dass Sie einen übersichtlichen Footer präsentieren und ihn nicht mit Informationen überladen. Dies könnte den Besucher abschrecken.

Da der Zweck des Footer darin besteht, interessante Inhalte anzubieten, sollte er außerdem sorgfältig ausgewählt werden. Es geht darum, Ihren Besuchern zusätzliche Informationen zu liefern, um Ihre Leistung zu verbessern. Sie können insbesondere einen Call-to-Action einfügen, um zu einer Handlung aufzufordern: ein Formular ausfüllen, eine Bestellung aufgeben, Kontakt aufnehmen, sich für den Newsletter anmelden. Genauso gut können Sie Ihre sozialen Netzwerke hervorheben, indem Sie auffällige Symbole einbauen, um den Besucher in Ihrer Umgebung zu halten.

Sie haben also verstanden, dass der Footer ein strategisch wichtiger Teil Ihrer Website ist, den es zu optimieren gilt.

Einige gute Praktiken für Ihren Footer

Der untere Teil einer Seite ist für Besucher, aber auch für Suchmaschinen bestimmt. Aus SEO-Sicht dienen die dort angegebenen Informationen dazu, das natürliche Ranking der Seite zu optimieren. In einem zweiten Schritt dienen sie auch dazu, den Besuchern mehr Inhalte anzubieten, um die Nutzererfahrung (UX) zu verbessern. Die Inhalte, die im Footer zu finden sind, werden in der Regel nicht in der Hauptnavigationsleiste angezeigt.

Hier sind verschiedene Elemente, die für Sie von Interesse sein könnten, in Ihren Footer einzufügen.

Die rechtlichen Informationen der Website

Wenn Sie Ihre Website in Betrieb nehmen, ist es Pflicht, ein Impressum für die Website zu verfassen. Dies ist keine sehr interessante Seite für den Nutzer, aber rechtlich gesehen unerlässlich. Es ist daher strategisch sinnvoll, einen Link zu dieser Seite in Ihrem Footer zu platzieren, um ihr nicht zu viel Bedeutung beizumessen, sie aber dennoch auf Ihrer Website zu platzieren.

Wenn Sie im E-Commerce tätig sind, dann müssen Sie auch die Allgemeinen Geschäftsbedingungen auf Ihrer Website veröffentlichen. Normalerweise werden diese Bedingungen dem Nutzer beim Kauf angezeigt, aber es kann auch sinnvoll sein, sie in der Fußzeile zu platzieren, damit die Nutzer vor dem Kauf darauf zugreifen können.

Schließlich sind die letzten legalen Elemente, die in Ihrem Footer erscheinen sollten, die Credits und das Copyright. Dadurch wird der Nutzer über den Ersteller und Besitzer der Website sowie über das Jahr der Veröffentlichung informiert.

Ihre Datenschutzrichtlinie

Ihre Kunden über Ihre Datenschutz- und Datenverarbeitungspolitik zu informieren, ist eine gesetzliche Verpflichtung, der jedes Unternehmen nachkommen muss. Daher müssen Sie diese Informationen auf Ihrer Website aufführen. Und warum nicht auch in Ihrem Footer? So bleiben Sie gegenüber Ihren Nutzern völlig transparent und erfüllen die gesetzlichen Verpflichtungen.

Darüber hinaus ist es auch Pflicht, Ihre Cookie-Richtlinie auf Ihrer Website zu veröffentlichen, falls Sie Cookies verwenden. Fügen Sie sie also in Ihren Footer ein, um die Besucher zu informieren, sobald sie Ihre Website aufrufen.

Ein Call-to-Action

Call-to-Actions können Ihre Konversionsrate erheblich steigern. Wie der Name schon sagt, fordern diese Elemente die Besucher einer Website auf, eine Aktion durchzuführen, im Allgemeinen den Kauf eines Produkts oder einer Dienstleistung.

Verwenden Sie Aufforderungselemente wie “Klicken Sie hier“, “Fordern Sie Ihr Angebot an“, “Vereinbaren Sie einen Termin” usw. Es geht darum, ein ansprechendes Element in Ihre Fußzeile einzufügen, um den Nutzer zu ermutigen, seine Suche fortzusetzen.

Kategorien und Link zu einem Blog

Im Rahmen einer E-Commerce-Aktivität ist es interessant, in Ihrer Fußzeile Links zu Ihren verschiedenen Produktkategorien einzufügen, um den Kunden auf Ihre Produktseiten weiterzuleiten und so Leads zu generieren.

Darüber hinaus können Sie auch einen Link zu einem Blog einfügen, um Ihre potenziellen Kunden zu informieren und ihnen hochwertige Bildungsinhalte zu bieten und so Ihre Glaubwürdigkeit in ihren Augen zu erhöhen.

Navigationshilfen

Die Fußzeile wird häufig verwendet, um den Nutzern die Navigation auf einer Website zu erleichtern, indem sie die Hierarchie Ihrer Website klar angibt. Es ist jedoch wichtig, dass Sie Ihr Menü nicht einfach nur kopieren und einfügen. In der Regel gehen die Nutzer zur Fußzeile, wenn sie im oberen Teil der Seite nicht gefunden haben, wonach sie suchten. Um eine in Bezug auf SEO und UX optimierte Fußzeile zu erstellen, fügen Sie SEO-Suchanfragen ein, d. h. die Schlüsselwörter, die Ihre Nutzer in die Suchleiste eingeben, bevor sie auf Ihre Website gelangen, und verweisen sie auf Ihre wichtigen Seiten.

Kontakt, Newsletter und soziale Netzwerke

Schließlich sollten Sie in der Fußzeile die Kontaktinformationen Ihres Unternehmens angeben: Telefonnummer, E-Mail-Adresse. Sie können diese Informationen in Form eines Kontaktformulars einfügen, um die Kontaktaufnahme zu erleichtern und die Nutzer zu ermutigen, Sie zu kontaktieren. Sie können auch einen Link zu Ihrer “Über uns”-Seite einfügen, um Ihren Kunden weitere Informationen zu geben. Schließlich ist es auch eine gute Idee, einen Link in Ihre Fußzeile einzufügen, über den sich die Nutzer für Ihren Newsletter anmelden können.

Heutzutage findet die Kommunikation zunehmend über soziale Netzwerke statt. Daher ist es unerlässlich, in Ihrer Fußzeile einen Link zu Ihren Netzwerken einzufügen, um den Internetnutzern eine alternative Kontakt- und Informationsmöglichkeit zu bieten.

Für Unternehmen, die an ihrer lokalen SEO arbeiten wollen, fügen Sie eine Google-Karte in Ihre Fußzeile ein.

Wie erstellt man einen Footer in HTML/CSS?

Es ist möglich, Ihren Footer mithilfe von HTML und CSS zu codieren. Im Folgenden finden Sie einen HTML-Code und den dazugehörigen CSS-Code, mit denen Sie einen weißen Basic-Footer erstellen können, der aus drei aneinandergereihten Spalten besteht. Sie können später die Hintergründe, Schriftarten usw. ändern, um den Footer ganz nach Ihren Wünschen zu gestalten!

HTML-Code

				
					<!DOCTYPE html>
<html>
<body>

      <footer>

        <div class=”contenu-footer”>

            <div class=”bloc footer-services”>
              <h3>Nos services</h3>
              <ul class=”liste-services”>
                <li><a href=”#”>Création de sites web</a></li>
                <li><a href=”#”>SEO</a></li>
                <li><a href=”#”>SEA</a></li>
              </ul>
            </div>

          <div class=”bloc footer-informations”>
            <h3>A propos</h3>
            <ul class=”liste-informations”>
              <li><a href=”#”>Actualités</a></li>
              <li><a href=”#”>Notre histoire</a></li>
              <li><a href=”#”>Investisseurs</a></li>
              <li><a href=”#”>Développement durable</a></li>
            </ul>
          </div>

          <div class=”bloc footer-contact”>
            <h3>Restons en contact</h3>
            <p>06 06 06 06 06</p>
            <p>supportclient@contact.com</p>
            <p>12 rue de l'invention, Paris, 75011</p>
          </div>

        <p class="copyright">Company Name © 2022</p>
    
 </div>

  </footer>

</body>
</html>

CSS-Code

				
					body {
  background: #f1f1f1;
  font-family: Arial, Helvetica, sans-serif;
  height: 100vh;
  display: flex;
  flex-direction: column;
}

h1 {
  font-size: 10vw;
  text-align: center;
  margin-top: 20px;
  color: #333;
}

.contenu {
  /* grow shrink basis */
  flex: 1 0 auto;
}

.contenu p {
  padding: 5vw 10vw;
  text-align: justify;
}

footer {
  flex-shrink: 0;
  border-top: 1px dashed #000;
  width: 100%;
  background: #ffff;
  color: #333;
}

.contenu-footer {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  font-size: 20px;
  padding: 50px 0 100px;
}

.bloc {
  width: 25%;
  margin: 0 30px;
}

/* contact */
.footer-services h3,
.footer-informations h3,
.footer-contact h3 {
  font-size: 25px;
  padding-bottom: 20px;
}

.footer-contact p {
  padding: 5px 0;
}

/* Services */

.liste-services,
.liste-information {
  list-style-type: none;
}

.liste-services li {
  padding: 2px 0;
}

.liste-services a {
  text-decoration: none;
  color: #333;
}
.liste-services a:hover {
  color: rgb(3, 3, 3);
}

Die beliebtesten Definitionen

Page Alias
Google AMP-Seite
Doorway Page
Orphan Page
Satellitenseite
Zombie-Seite
Google Indexierung
Footer
Header
Sitemap
Article Spinning
Hn-Tag

Steigern Sie Ihre Sichtbarkeit!

Zögern Sie nicht, uns zu kontaktieren, um ein kostenloses und individuelles Angebot zu erhalten.

Fordern Sie Ihr KOSTENLOSES Audit an
Kontaktieren Sie uns
4.8/5 - (9 votes)