Skip to main content

Was ist above the fold?

Eine Webseite wird in unterschiedliche Bereiche eingeteilt. So kann grob zwischen

unterschieden werden. Der Header ist dabei der Kopfbereich, Body der Hauptteil in dem der Content zu finden ist und im Footer (Fußbereich) Hinweise, Impressum oder anderweitig bereitgestellte Informationen.

Webseiten früher und heute unterscheiden sich ganz deutlich. Wurde früher noch weniger Wert auf responsive Design, saubere Gestaltung des above the folds geachtet, so ist dies heute anders. Im sofort sichtbaren Bereich – also dem above the fold – sollten nur die wichtigsten Informationen gefunden und nicht mit Werbung überlagert werden. Wurde früher verstärkt darauf geachtet, dass weniger gescrollt wird, ist dich heute definitiv anders. Scrollen ist ganz normal, auch weil es auf den mobilen Endgeräten wie Smartphones und Tablets sich anders nicht darstellen ließe. Auch das Laden des sofort sichtbaren Bereichs sollte nicht unterbunden und somit sofort geladen werden.

 

Für above the fold designen

Da heute die Besucher nicht nur mit einem Desktop auf die Internetseite gelangen, sondern auch mit mobilen Geräten, wie z. B. Smartphone, Tablet oder Phablet, ist es wichtig, dass die Webseite nicht nur responsive ist, sondern auch auf diesen Geräten sauber dargestellt wird. Da die Bildschirmauflösungen unterschiedlich sind, ist auch der above the fold Bereich unterschiedlich groß. Dies muss bei der Gestaltung der Webseite beachtet werden.

Wenn du wissen möchtest, welche Bildschirmauflösungen und Browser deine Besucher benutzen, dann kannst du dies über Google Analytics, Piwik oder einem anderen User Tracking Programm herausfinden. Mit Google Analytics kannst du wie folgt vorgehen:

  1. In Google Analytics einloggen
  2. Auf „Besucher“ auf „Technologie“ navigieren
  3. Anschließend auf „Browser und Betriebssystem“ gehen
  4. Und unter „Bildschirmauflösung“ sollten nun die entsprechenden Daten zum Vorschein kommen.

 

Betrachte deine Webseite in unterschiedlichen Bildschirmgrößen

Damit du bei der Gestaltung deiner Webseite für die unterschiedlichen Bildschirmgrößen dir auch selbst ein Bild von dem Aussehen der Internetpräsenz machen kannst, solltest du diese in den unterschiedlichen Bildschirmauflösungen betrachten. Dazu kannst du unter anderem ein Plug-In in deinem Browser verwenden. Für Google Chrome kann unter anderem das Plug-in „Windows Resizer“ verwendet werden. In diesem kannst du entweder die bereits voreingestellten Werte verwenden oder diese individuell definieren.

 

Den Bereich unterhalb above the fold gestalten

Wie du deinen above the fold Bereich gestalten kannst, wurde bereits oben erwähnt. Aber der Content befindet sich in der Regel im Body. Deshalb sollte auch dieser so gestaltet werden, dass der Content ausreichend Platz bietet. Aber zunächst muss der User von oben nach unten gelangen. Dies kannst du beispielsweise mit einem interaktiven Weg gestalten. Damit würde der Besucher sehen, was er weiter unten zu erwarten hat und kann bei Interesse runterscrollen. aber auch andere Elemente würden sich hierfür anbieten, wie zum Beispiel einen Pfeil, der nach unten zeigt, etc.

Wenn du eine Webseite für mobile devices, also für mobile Endgeräte gestaltest und optimierst, solltest du darauf achten, dass die wichtigsten Sachen, ganz oben erscheinen. Mal angenommen, du hast ganz oben im Header einen CTA Button, dann sollte dieser auf der mobilen Version ebenfalls oben und sofort sichtbar sein, ohne zu scrollen. Überall, wo man scrollen muss, wird die Conversion Rate beeinflusst und damit nicht gerade positiv.

Das heißt also, wenn du sehr wichtige Dinge auf der Seite ganz oben hast, dann sollten diese auch auf der mobilen Seite ganz oben sein.

Achte dabei stets, dass der Above the fold Bereich auch schnell gelagen wird. PageSpeed ist in der heutigen Zeit wichtiger denn je. Es heißt vor allem bei der Suchmaschine – und den Benutzern – mobile first. Es werden also die Einstellungen etc. für mobile Endgeräte bevorzugt, weil der meiste Traffic über mobile Devices kommt.

Mit Google PageSpeed Insights kannst du hier deine WordPress PageSpeed – sofern du als CMS WordPress einsetzet – prüfen, Desktop wie auch die mobile Version.

 

 

Ich würde mich sehr freuen, wenn du meine Zeit und Arbeit würdigst und den Beitrag teilst. Es ist nur ein kleiner Klick für dich, aber eine große Hilfe für mich.

Du möchtest viel mehr Sichtbarkeit in Google & Co.?

Dann analysiere deine Positionen im Ranking, verändere die Fehler deiner Webseite & erhalte kostenfrei und unverbindlich deine SEO-Analyse für deine Website. Mache eine kurze WDF*IDF-Analyse und analysiere deinen Content auf doppelten Inhalt.

Jetzt kostenfrei eine SEO-Prüfung durchführen!*

Du möchtest mehr Sichtbarkeit und geilen Inhalt?

Mehr Sichtbarkeit aufgrund top Inhalt und Content Marketing. Analyse deine aktuelle Rankings, verbessere die Schwächen der Webseite und bekomme kostenlos und ohne Verpflichtung eine SEO Prüfung für deine Webseite. Prüfe, wie sich dein Content schlägt & verändere ihn bei Gelegenheit mit der Content Suite.

Loslegen, analysieren, optimieren, dominieren!*

Du hättest gerne mehr Anfragen?

So sind neben dem Besucherstrom eine sehr gute Landing Page & eine möglichst hohe CR sehr wichtig. Hast du eine grottige Landing Page und eine geringe CR, vergeudest du deinen Traffic und verbrennst somit dein Geld. Höre auf deine Ressourcen zu verschwenden und verwende  Profi Werkzeuge.

Jetzt für 1 Euro deutschlands besten Funnel Anbieter ausprobieren!*