Above the Fold
Above the Fold bezeichnet den Bereich einer Website, den ein Besucher sieht, ohne zu scrollen. Was auch immer in diesem Bereich landet, ist sofort sichtbar. Was darunter liegt, muss erst aktiv erreicht werden.
Was ist Above the Fold?
Der Begriff kommt aus dem Zeitungsdruck. Eine gefaltete Zeitung zeigt nur die obere Hälfte der Titelseite. Was dort steht, entscheidet ob jemand kauft oder weiterschaut. Was „below the fold“ liegt, bleibt verborgen bis man die Zeitung aufklappt. Dieses Prinzip gilt auf Websites genauso, nur dass die „Falz“ heute von der Bildschirmgröße des Nutzers abhängt.
Das ist der erste wichtige Punkt: Above the Fold ist keine feste Größe. Auf einem 27-Zoll-Monitor sieht ein Besucher deutlich mehr als auf einem Smartphone-Display. Was auf dem Desktop noch bequem im sichtbaren Bereich liegt, rutscht auf mobilen Geräten oft schon halb oder ganz unter die Falz. Wer seinen Above-the-Fold-Bereich plant, muss immer beide Kontexte im Kopf haben.
Warum dieser Bereich so wichtig ist
Nutzer entscheiden in den ersten Sekunden, ob sie bleiben oder abspringen. Diese Entscheidung fällt fast ausschließlich auf Basis dessen, was sie ohne Scrollen sehen. Eine Studie von Nielsen Norman Group zeigt, dass Nutzer etwa 57 Prozent ihrer Betrachtungszeit im Above-the-Fold-Bereich verbringen. Der Rest der Seite wird deutlich weniger intensiv wahrgenommen, auch wenn Nutzer prinzipiell scrollen.
Das bedeutet nicht, dass der Rest deiner Seite unwichtig ist. Es bedeutet, dass du im oberen Bereich ausreichend Interesse wecken musst, damit Besucher überhaupt scrollen wollen. Wer oben nicht überzeugt, bekommt keine zweite Chance weiter unten.
Für Unternehmen, die über ihre Website Anfragen generieren wollen, hat das konkrete Konsequenzen. Der primäre Call-to-Action gehört in den Above-the-Fold-Bereich. Nicht weil jeder Besucher sofort klickt, sondern weil er von Anfang an weiß, welche Handlung möglich ist, wenn er soweit ist.
Was in den Above-the-Fold-Bereich gehört
Es gibt keine universelle Antwort, aber es gibt Elemente die fast immer sinnvoll sind.
1. Eine klare Aussage darüber, was du anbietest
Der Besucher muss in drei Sekunden verstehen, wer du bist und was er bei dir bekommt. Kein Rätsel, kein Teaser, kein philosophischer Claim. Eine klare Aussage. „Webdesign für Handwerksbetriebe in NRW“ ist besser als „Wir bringen dein Unternehmen nach vorne“. Ersteres erklärt sofort, für wen die Seite relevant ist. Letzteres sagt im Grunde nichts.
2. Ein visuelles Element das unterstützt, nicht ablenkt
Ein starkes Bild oder eine ruhige Grafik kann die Aussage verstärken. Aber das visuelle Element sollte immer dem Text dienen, nicht umgekehrt. Vollflächige Video-Hintergründe, animierte Slider und überlastete Hero-Bereiche sind häufige Fehler. Sie lenken vom Wesentlichen ab und verlangsamen die Seite, was doppelt schadet.
3. Der primäre CTA
Wie bereits erwähnt: Der wichtigste Handlungsaufruf gehört nach oben. Auf einer Landing Page ist das oft der einzige CTA auf der gesamten Seite. Auf einer normalen Unternehmenswebsite kann es auch nur ein gut sichtbarer Button sein: „Jetzt anfragen“, „Termin buchen“, „Angebot erhalten“.
4. Navigation, die orientiert ohne zu dominieren
Die Navigation hilft Besuchern die sich nicht sofort entscheiden. Sie sollte vorhanden und klar sein, aber nicht den gesamten oberen Bereich einnehmen. Eine schlanke, gut strukturierte Menüleiste reicht. Alles was über das Notwendige hinausgeht, ist Lärm.
Was häufig falsch gemacht wird
1. Zu viel Information auf einmal
Der Above-the-Fold-Bereich ist kein Inhaltsverzeichnis der gesamten Website. Wer dort alle Leistungen, alle Vorteile, einen Einleitungstext, drei Buttons und eine Kontaktleiste unterbringt, erzeugt Unklarheit. Weniger ist hier fast immer mehr.
2. Der CTA fehlt oder ist kaum zu sehen
Ein grauer Button auf weißem Hintergrund, ein Link im Fließtext, eine Schaltfläche die sich optisch nicht von der Umgebung abhebt. All das sind CTAs die nicht funktionieren, weil sie nicht als solche wahrgenommen werden. Kontrast, Größe und Formulierung entscheiden darüber ob ein Button Klicks erzeugt oder ignoriert wird.
3. Kein Bezug zur Zielgruppe
Eine Headline wie „Willkommen auf unserer Website“ ist kein Inhalt. Sie sagt dem Besucher nicht, ob er hier richtig ist. Gerade für Unternehmen die sich an spezifische Branchen oder Zielgruppen wenden, ist der Above-the-Fold-Bereich die Chance, sofort Relevanz zu signalisieren. „Professionelles Webdesign für Steuerberater“ spricht eine Praxis direkt an. „Ihre Agentur für digitale Lösungen“ tut das nicht.
4. Der Bereich ist zu schwer
Bilder die nicht komprimiert wurden, Skripte die beim Laden blockieren, Fonts die spät eingebunden werden. Das alles macht den Bereich langsam. Der Besucher sieht zunächst eine leere Seite oder ein halbgeladenes Layout, und springt im Zweifel ab, bevor der eigentliche Inhalt erscheint. Ladezeit und Above-the-Fold-Gestaltung hängen direkt zusammen.
Above the Fold auf mobilen Geräten
Mehr als die Hälfte aller Website-Besuche findet heute auf Smartphones statt. Das verändert, was „Above the Fold“ konkret bedeutet. Auf einem Smartphone-Display ist der sichtbare Bereich deutlich kleiner. Eine Headline die auf dem Desktop noch gut funktioniert, wird auf dem Handy möglicherweise abgeschnitten. Ein Button der auf dem Desktop gut erreichbar ist, liegt auf dem Smartphone vielleicht außerhalb des Daumenbereichs.
Mobile First bedeutet in diesem Kontext nicht nur, dass die Seite technisch responsiv ist. Es bedeutet, dass der Above-the-Fold-Bereich für kleine Bildschirme durchdacht wurde. Wenige, klare Elemente. Eine Headline die auch in zwei Zeilen noch lesbar ist. Ein Button der groß genug ist um mit dem Daumen getippt zu werden.
Wer eine beauftragt, sollte gezielt nach der mobilen Darstellung des oberen Bereichs fragen. Das ist einer der Punkte wo Laien-Entwürfe am häufigsten scheitern.
Above the Fold im Kontext von SEO
Google bewertet nicht nur Keywords und Backlinks, sondern auch das Nutzerverhalten. Seiten mit hoher Absprungrate, kurzer Verweildauer und wenig Interaktion werden schlechter eingestuft. All das beginnt mit dem, was der Besucher im Above-the-Fold-Bereich sieht oder nicht sieht.
Eine denkt deshalb den Above-the-Fold-Bereich nicht isoliert als Design-Frage, sondern als Rankingfaktor. Seiten die schnell laden, sofort relevante Inhalte zeigen und den Besucher zur Interaktion einladen, performen besser, sowohl bei Nutzern als auch bei Suchmaschinen.
Das wichtigste Keyword einer Seite sollte möglichst früh im sichtbaren Bereich auftauchen, idealerweise in der Hauptüberschrift. Nicht weil Google das mechanisch belohnt, sondern weil es dem Besucher sofort signalisiert, dass er auf der richtigen Seite gelandet ist.
Wer sich fragt, ob sein Above-the-Fold-Bereich das leistet, was er leisten soll, sollte seine Seite mit den Augen eines Erstbesuchers betrachten: Was sehe ich sofort? Weiß ich, was ich hier bekomme? Weiß ich, was ich als nächstes tun kann? Wenn eine dieser Fragen mit Nein beantwortet wird, ist das der Ansatzpunkt.
