Was wissen Sie über den Bereich Above-The-fold?

Hier erfahren Sie um was es sich bei Above-The-Fold handelt und wieso dieser Bereich Ihrer Website so wichtig ist.

Das Wort „above the fold“ stammt aus dem englischen und heißt in Deutsch soviel wie „über der Falz“. Die Bezeichnung stammt aus dem Druckereiwesen. Wenn eine Zeitung in der Mitte gefaltet ist, wird die Knicklinie als „fold“ oder in Deutsch als Falz bezeichnet.
Im gefalteten Zustand ist, über dem Falz, nur noch der obere Bereich des Titelblatts zu sehen.

Wo findet man den „above the fold“-Bereich einer Website?

Sie fragen sich jetzt sicherlich was eine Zeitung mit einer Webseite zu tun hat, ich sage Ihnen „so Einiges“. Im übertragenen Sinne ist die Startseite Ihrer Firmenwebsite nichts anderes als ein Titelblatt einer Zeitung. Eine Webseite wird zwar nicht gefaltet aber beim Aufrufen einer Webseite in Ihrem Browser, wird die Webseite auch nicht komplett angezeigt.
Der sichtbare Bereich den Sie in Ihrem Browser zuerst sehen können, ist „der obere Bereich des Titelblatts“ Ihrer Webseite, also der „above the fold“-Bereich.

Wichtig: Das ist übrigens der Bereich Ihrer Webseite der meist 80% der Aufmerksamkeit Ihrer Besucher bekommt.

Es ist wichtig die unterschiedlichen Auflösungen zu berücksichtigen.

Heute werden unzählige Geräte für das Surfen im Internet genutzt und dabei kommen verschiedene Displays und Auflösungen zum Einsatz. Je nach Gerät müssen Sie den oberen Bereich Ihrer Webseite auf diese Auflösungen anpassen. Ein Desktop-PC hat in der Regel einen Bildschirm mit mindestens 19 Zoll, ein Notebook dabei zwischen 13-17 Zoll, mobile Endgeräte haben oft Displays von 4,5 bis 11 Zoll.

Wir sprechen hier von einer Auflösung die in der Regel bei ca. 450 Pixel startet und nach oben quasi offen ist. Es haben sich mittlerweile jedoch bestimmte Auflösungen bei den Nutzern etabliert.

Ein kleines Beispiel mein eigener Bildschirm hat 26,5 Zoll (schon fast ein kleiner Fernseher) und eine Auflösung von 1920 x 1200 Pixel, mein Smartphone hingegen hat nur 5,5 Zoll und eine Breite von nur 650 Pixel. Eine Website muss Heute bei beiden Auflösungen funktionieren.

Die Website problemlos und automatisch für jede Auflösung anpassen.

Wenn Sie nicht wissen wie Sie Ihre Website an unzählige Auflösungen und Bildschirme anpassen können, empfehle ich Ihnen von Anfang an ein Template mit Responsive Design zu nutzen.
Sie bekommen Heute im Internet unzählige professionell gestaltete HTML-Templates schon für wenig Geld.

Tipp: Responsive Websites werden von Suchmaschinen wie Google bevorzugt und mobil optimierte Websites sind seit 2018 ein festes Rankingkriterium.

In einem anderen Beitrag habe ich bereits erklärt was ein Responsive Design ist und welche Vorteile es bringt.

Der „above the fold“-Bereich ist extrem wichtig.

Da es hierbei sich um den Inhalt handelt den Ihr Besucher zuerst sehen wird, ist es sehr wichtig diesen Bereich sinnvoll zu nutzen. Sie sollten in diesem Bereich nur Ihren wichtigsten Inhalt Ihrer Webseite den Besuchern präsentieren.

Im „above the fold“-Bereich ist es vor allem wichtig auf ablenkende Inhalte zu verzichten und nur aussagekräftige Inhalte einzublenden die auch Ihre Kerninformation klar und deutlich kommunizieren. Das können Texte, Bilder und Videos sein oder eine Kombination aus allem, wichtig ist hierbei Sie sollten nur so viel wie nötig in diesem Bereich einblenden.

Nutzen Sie sinnvoll die höchste Aufmerksamkeit Ihrer Besucher.

Bringen Sie einen Call-To-Action (kurz: CTA) ein, dies ist ein Element das Ihren Besucher zu einer gezielten Handlung anregen soll, das Zielvorhaben sollte vorher genau definiert sein.

Ein CTA kann beispielsweise ein Button sein der Ihren Besucher zu einer Produktseite oder einer Informationsseite weiterleitet, es kann aber auch ein Formular sein um bestimmte Daten einzutragen z.B. den Namen und die E-Mail Adresse Ihres Besuchers.
Ein „einfaches Scrollen nach unten“ ist ebenfalls ein CTA um weiteren Inhalt einzusehen.

Tipp: Setzen Sie pro Webseite 2-3 CTA-Elemente zu maximal einem Zielvorhaben ein.

Ich möchte am Rande erwähnen, wenn Sie einen CTA einsetzen ist es auch wichtig die Conversion-Rate mithilfe von Tracking-Tools auszuwerten. Wenn etwas nicht zielführend ist, ändern Sie die Texte oder die Farben Ihrer CTA-Elemente auch als A/B-Test bekannt.

Fazit: above the fold muss berücksichtigt werden

Wenn Ihre Webseite steht, geben Sie Ihrem „above the fold“-Bereich nochmal gesonderte Aufmerksamkeit und überprüfen Sie genau den Inhalt der zu sehen ist. Prüfen Sie ob dieser Inhalt Ihre Kernaussage des jeweiligen Seiteninhaltes auf den Punkt bringt.

Binden Sie maximal einen Call-To-Action in diesen Bereich ein und behalten Sie die Conversion-Rate im Auge, machen Sie gelegentlich A/B-Tests vor allem nachdem Sie etwas geändert haben.
Fragen Sie Personen was diese von Ihrem „above the fold“-Bereich denken, welche Gedanken beim ersten Aufruf ihnen aufkamen, ob Sie weiter gescrollt haben und auch wieso sie es nicht getan haben.

Vernachlässigen Sie den wichtigsten Bereich Ihrer Seite auf keinen Fall und verschenken Sie nicht die Aufmerksamkeit Ihrer Besucher.

Fragen zum above the fold beantworte ich Ihnen sehr gerne in den Kommentaren.

Stichwörter: Content, Onpage, Optimieren, Wissenswertes,
Kategorie: Webdesign
Archiv: Januar 2018
Geschrieben am 17.01.2018 - 15:41 Uhr
Zuletzt geändert am 17.09.2019 - 19:33 Uhr