Above the fold

above the fold wiki
Inhalt des Artikels

Was bedeutet above the fold?


Der Teil deiner Webseite, der ohne jedes scrollen zu sehen ist, wird als „above the fold“ bezeichnet. Scrollt der User, so befindet er sich demnach „below the fold„.

„Fold“ stammt aus dem Druckereiwesen und wird für eine exakt geknickte Papierkante (Falzlinie) verwendet. Die Falzlinie bei deiner Webseite ist also die Unterseite deines Webbrowsers.

Diese Falz ist kein fixer Wert, im Zeitalter von Mobile-First und vielen verschiedenen Auflösungen, handelt es sich mehr um einen relativen Bereich.

Above the fold Beispiel
Above the fold Beispiel

Worauf ist zu achten?

Der Bereich above the fold ist aus mehreren Gründen wichtig für deine Webseite. Zum einen aus Conversion- und Usability-Sicht, zum anderen aus SEO-Sicht!

Es ist generell ratsam, wichtige Inhalte deiner Webseite „above the fold“, also sofort sichtbar, zu platzieren. Dieser Inhalt hat sofort das Augenmerk des Nutzers. Gefällt der Bereich, so führt das oft zu einer höheren Verweildauer und einer verringerten Absprungrate.

Zum Beispiel dadurch, dass der Nutzer in diesem sofort sichtbaren Bereich findet, dass ihn genau das erwartet, wonach er sucht.

Wie erwähnt gibt es mit unterschiedlichen Browsern, Geräten und Bildschirmauflösungen auch verschiedene „above the fold“-Bereiche. In Google Analytics steht ein kostenloses Tool zur Verfügung, welches den sichtbaren Bereich deiner Webseite in unterschiedlichen Browsern und Bildschirmauflösungen anzeigt.

Mit Tools wie z.B. Hotjar könntest du auch Heatmaps erstellen, die die durchschnittliche Fold-Linie zeigen.

Bedeutung für die Suchmaschinenoptimierung

Ein Layout, das „above the fold“ Inhalte gut einsetzt, der erntet positive User-Signale. Schon das wird von Google positiv bewertet. Wer dort hingegen viele Werbebanner platziert, der erntet negative Reaktionen, auch von Google.

Page-Layout-Algorithmus

Google hat eigens dafür Updates und Algorithmen entwickelt, wie den „Page-Layout-Algorithmus“. (Siehe Google-Updates: Version #3 des Page Layout Algorithmus am 6. Februar 2014 hat Gogle seinen Page Layout Algorithmus aufgefrischt und straft Seiten mit zu vielen Werbeanzeigen above the fold ab.)

Etwa zur gleichen Zeit ging es los, dass Webseitenbetreiber nur den sichtbaren Teil für den User bauten und alles Weitere für die Maschine. Der Mehrwert dieser Inhalte hält sich für den User jedoch in Grenzen. Etwa die Erfindung des Schuhs erklärt in einem Online-Shop.

Die ersten Updates dazu gab es im Januar 2012 und nochmal im Oktober 2012. Abgestraft hat Google die „Top Heavy“ Seiten, also Seiten mit zu vielen Werbebannern „above the fold“.

Aus reiner SEO-Sicht sind diese Werbebanner weit oben im Layout nicht Ratsam. Es ist aus Google-Sicht auch nicht ratsam, die eigentlichen Inhalte der Seite unter der Falzlinie (below the fold) zu platzieren.

Auch zu viele AdSense Einbindungen oder Werbeplatzierungen im oberen Bereich deiner Seite kann zu Problemen führen. Generell ist der Einbau von mehr als 3-Bannern zu hoch.

Pagespeeds kritischer Bereich

Und weil dieser sofort sichtbare Bereich so wichtig ist, sollte er auch schnell laden. Vermeide, dass Scripte und CSS das Rendern des so wichtigen Bereichs blockiert. Zum Beispiel durch das Verschieben von kritischen Styles. Und wenn dir Google Pagespeed Insights sagt „Kritischer Bereich“, dann meint es eigentlich den Bereich „Oberhalb der Falz“!

Aufmerksamkeitsverteilung above und below the fold

Was findet Beachtung? Reflektiere dich und deine Webseitenbesuche. Klar bist du auf manchen Seiten viel Unterwegs, kennst und vertraust, du scrollst. Doch was bei einer der vielen unbekannten Seiten, die du gerade zum ersten mal besuchst?

Der Content „above the fold“ bekommt immer noch fast 80 % der Aufmerksamkeit der Nutzer. Daran hat sich seit 2013 nichts geändert. Ja wir haben uns an das Scrollen gewöhnt, doch wir tun das nicht überall.

Gerade deshalb werden oft CTAs dort platziert. Manchmal kommt der eigentliche Inhalt komplett unter dieser Falzlinie. Und nicht selten sieht man ganz oben ein großes Hero-Image und einen CTA-Button.

Ein Spagat ist es, den richtigen Wert zwischen Conversion Rate, Monetarisierung und SEO hinzubekommen. Du solltest immer bedenken, dass eine Seite für organische Besucher nur sehr selten einen reinen Conversion-Fokus hat.

Nutze das Wissen über Aufmerksamkeit doch eher für Seiten, auf die Werbung schaltest oder für Seiten, die weniger SEO-Wichtig sind. Ein Headerbild mit CTA ist oft gut fürs Geld, doch genauso oft schlecht für die Google-Rankings.