• Language
E-Commerce

„Above the Fold“ vs. „Below the Fold“: Zählt das 2019 immer noch?

by Sonia Hofmann
Share on linkedin
Share on Linkedin
Share on facebook
Share on Facebook
Share on twitter
Share on Twitter

„Above the fold“ bleibt ein wichtiger Bestandteil im Design von Webseiten, auch wenn dieser Begriff mit jedem Jahr komplexer wird. Webseiten, die ihren Benutzern eine gute Experience bieten wollen, sollten dieses Konzept immer noch verstehen und berücksichtigen, auch wenn es nicht mehr als so entscheidend gilt, wie es einmal war.

Was ist „above the fold“?

Das Konzept „above the fold“ reicht Jahrhunderte zurück bis hin zu den Anfängen der Druckerei. Zeitungen wurden gefaltet, sobald sie im Zeitungskiosk ankamen, da sie auf großen Blättern gedruckt wurden. Somit war nur die obere Hälfte der Zeitung für Passanten direkt zu sehen.

Die Zeitungsindustrie verstand schnell, dass sie Schlagzeilen, Inhalte und Bilder auf der oberen Hälfte der Titelseite präsentieren mussten, um Aufmerksamkeit zu erregen. Dieses Grundprinzip gilt auch für digitale Inhalte.

Webseiten haben natürlich keinen fühlbaren Knick wie Zeitungen, der „fold“ bezieht sich hier auf die Scrollbarkeit.

Alles was nicht unmittelbar sichtbar ist und scrolling benötig, wird als „below the fold“ gesehen. Leider ist die digitale Version von „above the fold“ nicht ganz so einfach zu definieren wie die gedruckte Version.

Dimensionen

Für eine Webseite sollte demnächst über deren Dimensionen und wie diese auf den Leser wirken nachgedacht werden. Nicht alle Screens sind gleich. Zusätzlich wird jede Seite durch die weite Verbreitung von Tablets und Smartphones in sehr verschiedenen Ausführungen angezeigt. Weitere Themen sind hier Bildschirmauflösungen und Browser Plug-Ins.

Die Dimensionen von Smartphones sollten hierbei besonders berücksichtigt und durchdacht werden, vor allem da deren Nutzung seit 2016 die von Desktops übertrifft. Smartphones, genauso wie ihre Screens, werden in verschiedensten Formen und Größen produziert; im Gegensatz zur einheitlichen Zeitung ist der „fold“ hier ein sehr viel schlechter definierbares Konzept.

Online Tools zur Definition von „above the fold“ Platzierung

Es gibt viele kostenlose Online-Tools die Sie benutzen können, um Ihre Webseite visuell zu testen und einzelne Aspekte an verschiedenen Stellen bezogen auf den „fold“ zu platzieren. Sie sind sehr hilfreich um eine greifbare Idee des Layouts zu erhalten, zeigen aber nur eine oberflächliche Präsentation der Webseite und keine ausführliche Analyse. Daher wird empfohlen, eine vollständige Websiteoptimierung durchzuführen.

Best Practices

Auch wenn es keine festen Regeln für „above the fold“-Platzierung gibt, können ein paar Best Practices als hilfreiche Guidelines dienen. Manche davon basieren auf gesundem Menschenverstand, wie zum Beispiel die Platzierung des interessantesten Inhaltes „above the fold“. Andere Empfehlungen beziehen sich auf die bereits genannten Dimensionen wie zum Beispiel die standardisierte 1.000 Pixel breite/ 600 Pixel hohe „fold“-Größe bei 1,024/768px Screens. Die meisten Bildschirmgrößen sind heute allerdings größer, daher ist eine entsprechende Anpassung Ihrer Webseite wichtig.

Man sollte auch im Hinterkopf behalten, dass Best Practices nicht in Stein gemeißelt sind. Webseiten wurden lange wie die Titelseite einer Zeitung designt, was zu einer Art Schablone wurde und dazu geführt hat, dass die meisten Seiten gleich aussehen. Neuentwicklungen wie vertikales Scrolling (oder Klicken) bedeuten, dass das Konzept von „above the fold“ sprichwörtlich auf den Kopf gestellt wird und sich das Nutzererlebnis sehr viel natürlicher anfühlt.

Manche Webseiten haben das „above the fold“ Konzept komplett aufgegeben und Seiten designt, die überhaupt keinen Inhalt unterhalb des „folds“ haben, und somit das Problem komplett gelöst. Diese „kompakten“ Designs sind ästhetisch für das Auge und passen für alle Bildschirmgrößen.

The New Rules for Scrolling in Web Design

Einer der größten Fehler von Webseiten ist, wenn sie einen „False Bottom“, also ein falsches Ende der Seite anzeigen. Dabei bietet eine Seite mehr Informationen, die durch Scrolling erreicht werden können; dass diese Informationen existieren ist für den Besucher aber nicht sichtbar. Das ist der Worst Case. Ein „fold“ muss kein Hindernis sein, er sollte natürlich fließen und den Besucher einnehmen.

Call To Actions „above“ oder „below the fold“?

Eine der Mythen im „above the fold“-Design ist die Best Practice, einen Call to Action (CTA) immer so zu platzieren, dass er sofort sichtbar ist. Dies ist, wie vieles rund um dieses Thema, eine Vereinfachung des Konzepts. Wo ein CTA platziert werden sollte hängt von mehreren Faktoren ab, entscheidend zum Beispiel von:

  • Überzeugten Besuchern
  • Unsicheren Besuchern, die Ihr Produkt kennen – oder wenn die Proposition einfach ist
  • Unsicheren Besuchern, denen eine komplexe Proposition gezeigt wird

Überzeugte Besucher sind diejenigen, die sehr wahrscheinlich auf den CTA reagieren, da sie schon vor dem Besuch der Webseite ihre Entscheidung zum großen Teil bereits getroffen haben. Hier haben bekannte Marken Vorteile, ein überzeugter Besucher braucht wenig Informationen über ein Produkt oder einen Service. In diesen Fällen hat die Platzierung eines CTAs über dem „fold“ eher praktische Gründe.

Im Fall von unsicheren Besuchern, die den CTA einfach verstehen oder etwas Vorwissen über das Produkt oder den Service mitbringen, ist die Platzierung des CTAs über dem „fold“ aus den oben bereits erwähnten Gründen im allgemeinen Best Practice, auch wenn die informativen Inhalte hier auch wichtig sind.

Für unsichere Besucher, die mit einer komplexen Proposition konfrontiert werden, wie einem Produkt oder Service, das für sie nicht offensichtlich vorteilhaft ist, ist die Platzierung des CTAs über dem „fold“ nicht ausreichend. Sie benötigen eine tiefergehende Erklärung, warum sie dem Call to Action folgen sollen. Hier kann die Positionierung zu Beginn aufdringlich wirken.

Einfach gesagt sollte der CTA dort platziert werden, wo der Besucher am ehesten überredet werden kann, die gewünschte Aktion durchzuführen.

Platzierung von Werbung

Es sollte immer klar sein, dass der Großteil der Aufmerksamkeit „above the fold“ gerichtet sein wird, egal wie taktisch Sie Ihre Webseite designen. Sollte man daher, um Werbeeinahmen zu erhöhen, diesen Bereich mit Werbung pflastern? Die Antwort ist nein. Google Algorithmen bestrafen dieses Verhalten schwer, Sie könnten damit das Ranking Ihrer Webseite stark beschädigen, wenn Sie nicht vorsichtig sind. Zusätzlich können Sie so wichtige Informationen nicht nur „below the fold“ schieben, sondern potentiell auch über die Geduld des Besuchers hinaus.

Die Platzierung von Werbung ist eine komplexe Balance, welches Wissen über Bounce Rates, sowie Analysen von Engagements und Nutzerverhalten erfordert. Diese Entscheidungen werden am besten getroffen, wenn man die richtigen Daten zur Hand hat.

Warum „above the fold“ wichtig ist

An diesem Punkt sollte klar geworden sein, dass das „above the fold“-Design wichtig und unverzichtbar, gleichzeitig aber auch komplex ist. Daher sollte man Ratschlägen, die von Absoluten sprechen, misstrauisch gegenüber treten. Man kann sicherlich sagen, dass die heutigen Nutzergewohnheiten sich stark von denen aus der Anfangszeit des Internets unterscheiden. In den 1990ern lasen die meisten „Surfer“ selten unterhalb der „fold“, durch langsame Verbindungsgeschwindigkeiten und sich langsam aufbauenden Webseiten. Heutzutage benutzen User viel eher das Scroll-Rad ihrer Maus.

Dies führt glücklicherweise dazu, dass vollgestopften Seiten, bei denen die Informationen über dem „fold“ gehäuft werden, aussterben. Heutzutage sind minimalistische, elegante Designs, die dem Besucher erlauben selber zu entdecken, was die Seite zu bieten hat, viel häufiger.

Eine kürzlich durchgeführte Google-Studie hat gezeigt, dass Werbung, die „above the fold“ liegt, eine Sichtbarkeit von 73% erreicht, während die „below the fold“ nur 44% erreicht. Hier sollte allerdings berücksichtigt werden, dass Inhalt, der den Besucher abholt, diese Lücke stark verkleinert, und Werbung hierfür ein Hindernis sein kann. Wie bei diesem Thema bereits üblich, sind Kontext und Balance die wichtigsten Faktoren, die es zu beachten gilt.