Above the Fold

Above the Fold meint den Bereich einer Webseite, den ein Besucher sofort sieht — ohne zu scrollen. Der Begriff stammt aus dem Zeitungsdruck: „above the fold" war die obere Hälfte der gefalteten Tageszeitung, die am Kiosk sichtbar war und über Kauf oder Nicht-Kauf entschied. Online ist das Prinzip dasselbe geblieben, nur die Faltung ist jetzt die untere Kante des Browserfensters. Was darüber liegt, entscheidet in Sekundenbruchteilen, ob jemand bleibt oder wegklickt.

Die Kehrseite heißt folgerichtig Below the Fold: alles, was erst durch Scrollen erscheint. Lange galt die eiserne Regel, dass alles Wichtige nach oben muss, weil unten ohnehin niemand hinschaut. Diese Regel stimmt heute nur noch zur Hälfte. Aber die obere Bildschirmkante ist und bleibt der teuerste Quadratzentimeter deiner Website.

Warum der sichtbare Bereich über Conversion entscheidet

Besucher urteilen schnell. Sehr schnell. Studien zur ersten Wahrnehmung von Websites zeigen, dass sich der erste Eindruck im Bereich von Millisekunden bildet — lange bevor jemand bewusst gelesen hat, worum es geht. In diesem Moment ist nur der Above-the-Fold-Bereich im Spiel. Er trägt die volle Last der Frage: Bin ich hier richtig?

Daran hängt eine harte ökonomische Konsequenz. Wer den sichtbaren Bereich verschenkt — mit einem riesigen Stockfoto ohne Aussage, einem Cookie-Banner, das die halbe Seite frisst, oder einer Headline, die nichts verspricht — verliert Besucher, für deren Klick er bezahlt hat. Im E-Commerce ist das doppelt teuer: Der Traffic kostet (über Ads, SEO-Aufwand, Newsletter), und die Absprungrate steigt direkt an der Stelle, an der die Reise eigentlich erst beginnt.

Eine zweite Funktion wird oft übersehen: Der Above-the-Fold-Bereich setzt die Erwartung. Was der Nutzer oben sieht, prägt, ob er überhaupt scrollt. Ist der erste Eindruck stark und macht neugierig, sinkt die Hemmschwelle, weiterzulesen. Wirkt er beliebig, ist die Seite mental schon abgehakt, selbst wenn weiter unten die beste Information steht.

Das Ende der einen Faltlinie

Früher gab es eine ungefähre Pixelgrenze, etwa 600 Pixel Höhe bei den damals üblichen Monitoren. Diese eine Linie existiert nicht mehr. Die Faltung liegt heute bei jedem Gerät woanders:

• Auf einem Desktop-Monitor mit 1920×1080 liegt die Faltung tief, oft erst bei 900 sichtbaren Pixeln Höhe.
• Auf einem Notebook mit kleinerer Auflösung deutlich höher.
• Auf dem Smartphone hochkant ist der sichtbare Bereich schmal und hoch — und durch Browser-Leiste und Adresszeile zusätzlich beschnitten.
• Im Querformat verschiebt sich alles wieder.

Weil der Mobil-Traffic im deutschen E-Commerce regelmäßig über der Hälfte aller Sitzungen liegt, ist die mobile Faltung heute der wichtigere Bezugspunkt. Was auf dem Desktop noch knapp oben sitzt, rutscht auf dem Handy unter die Kante. Das macht das alte „Pack alles nach oben" praktisch unmöglich: Auf einem schmalen Hochkant-Display passt eben nicht alles über die Faltung. Du musst priorisieren.

Was über die Faltung gehört

Statt einer starren Pixelregel gilt heute eine inhaltliche: Above the Fold muss klären, wo der Nutzer ist, was er hier bekommt und was er als Nächstes tun kann. Konkret heißt das fast immer vier Elemente.

Die Reihenfolge ist kein Dogma. Eine Produktdetailseite priorisiert Produktbild, Preis und Kaufbutton; eine Kategorieseite die ersten Produktkacheln; eine Landingpage einer Kampagne die Headline und den einen entscheidenden CTA. Der gemeinsame Nenner: keine verschenkte Fläche, keine Pflicht-Elemente, die nur stören.

Der Mythos vom toten Below-the-Fold

Lange hielt sich die Überzeugung, dass kaum jemand scrollt. Das ist widerlegt. Scrollen ist heute eine selbstverständliche, antrainierte Geste — schon weil mobile Geräte fast nur über Scrollen funktionieren. Auswertungen von Scroll-Tracking zeigen regelmäßig, dass ein großer Teil der Nutzer sehr wohl nach unten scrollt, sofern der obere Bereich Grund dazu gibt. Genau das ist der Punkt: Below the Fold ist nicht tot, aber es ist verdient. Die Faltung ist kein Friedhof, sie ist eine Schwelle.

Daraus folgt eine produktive Umkehr: Du musst nicht alles oben hineinquetschen. Du musst oben genug Spannung erzeugen, damit der Scroll passiert. Eine überladene Above-the-Fold-Zone, die zehn Botschaften gleichzeitig schreit, ist oft schwächer als eine fokussierte, die eine Sache klar sagt und Lust auf mehr macht.

Ein Beispiel: Startseite eines Shopware-Shops

Ein Shopware-Shop für Kaffee-Equipment hatte oben ein großzügiges Slider-Banner mit wechselnden Lifestyle-Fotos, darunter erst die Produktkategorien. Auf dem Smartphone bedeutete das: Faltung mitten im Banner, kein einziges Produkt, keine Kategorie, kein Kaufanreiz sichtbar. Die mobile Absprungrate auf der Startseite lag hoch.

Das Team baute um. Über der Faltung steht jetzt eine konkrete Headline („Frisch gerösteter Kaffee, alle zwei Wochen geliefert"), direkt darunter zwei klare Buttons („Abo starten" und „Einzelkauf") und ein einziges, ruhiges Produktbild statt des rotierenden Sliders. Die Lifestyle-Bilder rutschten nach unten, wo sie als Stimmungselement weiter wirken, aber nicht mehr den Einstieg blockieren. Ergebnis nach mehreren Wochen: spürbar niedrigere mobile Absprungrate und mehr Klicks auf die Kategorie-Ebene. Kein Zauber — nur die Faltung ernst genommen.

Typische Fehler

• Cookie- und Consent-Banner, die den halben Screen verdecken. Rechtlich nötig, gestalterisch oft viel zu groß. Wer das Banner kompakt hält, gibt dem Inhalt seinen Platz zurück.
• Riesige Hero-Bilder ohne Botschaft. Ein schönes Foto, das keine Frage beantwortet, ist im teuersten Bereich der Seite Platzverschwendung.
• Autoplay-Slider. Wechselnde Banner verwirren mehr, als sie nützen, und der Nutzer erwischt selten die Botschaft, die für ihn relevant wäre.
• Langsames Laden des sichtbaren Bereichs. Was oben steht, muss zuerst und schnell da sein. Genau das misst Google mit dem Largest Contentful Paint, einem der Core Web Vitals; Details dazu in der offiziellen Dokumentation auf web.dev zum Largest Contentful Paint.
• Nur den Desktop testen. Wer die Faltung nur am großen Monitor prüft, übersieht, dass die Mehrheit das Gegenteil sieht.

Above the Fold im Page-Building von Shopware

Wer einen Shopware-Shop über die Erlebniswelten (Shopping Experiences) gestaltet, entscheidet faktisch bei jeder Seite über die Faltung — auch wenn das Tool den Begriff nicht verwendet. Jede Sektion, die du oben in den Seitenaufbau ziehst, konkurriert um den sichtbaren Bereich. Ein paar konkrete Konsequenzen für die tägliche Arbeit im Page-Builder:

• Die erste Sektion trägt die Hauptlast. Was in der obersten Block-Reihe steht, sieht jeder. Reserviere sie für Aussage und Aktion, nicht für Deko.
• Bildhöhen bewusst setzen. Ein bildschirmfüllendes Hero-Element auf dem Desktop kann auf dem Smartphone bedeuten, dass nichts anderes mehr über die Faltung passt. Prüfe die mobile Vorschau, nicht nur die Desktop-Ansicht.
• Sticky-Elemente sparsam einsetzen. Eine fixierte Leiste frisst dauerhaft sichtbaren Platz. Auf kleinen Displays kann eine Kombination aus Sticky-Header und Cookie-Banner den Inhalt fast vollständig verdrängen.
• Ladereihenfolge beachten. Bilder im sichtbaren Bereich sollten nicht per Lazy Loading verzögert werden, sonst sieht der Nutzer im entscheidenden Moment eine leere Fläche.

Above the Fold und SEO

Der sichtbare Bereich ist nicht nur ein Conversion-Thema, er berührt auch die Suchmaschinenoptimierung. Google bewertet die Nutzererfahrung mit, und ein Above-the-Fold-Bereich, der von Werbung oder aufdringlichen Interstitials zugestellt ist, kann sich negativ auf das Ranking auswirken. Gleichzeitig fließt die Ladezeit des sichtbaren Bereichs über den Largest Contentful Paint direkt in die Bewertung ein. Kurz: Ein schneller, sauberer, inhaltlich klarer oberer Bereich zahlt doppelt ein — auf die Conversion und auf die Sichtbarkeit.

Es gibt allerdings eine Grenze, die man nicht überdehnen sollte. „Wichtige Keywords müssen above the fold stehen" ist ein hartnäckiger SEO-Mythos in dieser Strenge. Google liest die gesamte Seite, nicht nur den oberen Bereich. Wer den sichtbaren Bereich mit Text vollstopft, nur damit ein Keyword früh erscheint, opfert die eigentliche Funktion — schnelle Orientierung — für eine eingebildete Ranking-Wirkung. Der sichtbare Bereich gehört der Klarheit, nicht der Keyword-Dichte.

Der sichtbare Bereich auf verschiedenen Seitentypen

Es gibt nicht den einen richtigen Above-the-Fold-Aufbau. Was oben stehen muss, hängt vom Seitentyp und der Absicht des Besuchers ab. Ein paar typische Fälle aus dem Shop-Alltag:

• Startseite: Orientierung und Einstieg. Der Besucher kennt das Sortiment oft noch nicht. Hier zählt eine klare Aussage zum Angebot plus ein Weg in die wichtigsten Kategorien — nicht ein Sammelsurium aller Botschaften gleichzeitig.
• Kategorieseite: Produkte zeigen. Wer auf einer Kategorieseite landet, will Auswahl sehen. Die ersten Produktkacheln und die Filtermöglichkeiten gehören über die Faltung, nicht ein großes Kategorie-Bannerbild, das die Ware nach unten drückt.
• Produktdetailseite: Entscheidung ermöglichen. Produktbild, Preis, Verfügbarkeit und der Kaufbutton sind die Stars. Lange Produktbeschreibungen dürfen darunter folgen.
• Kampagnen-Landingpage: ein Ziel, ein Weg. Hier ist die Faltung am unerbittlichsten: eine starke Headline, ein Nutzenversprechen, ein CTA. Alles, was ablenkt, schadet.

Die gemeinsame Logik: Frag bei jedem Seitentyp, in welchem mentalen Zustand der Besucher ankommt, und gib ihm oben genau das, was diesen Zustand bedient. Eine Produktseite, die oben mit Markengeschichte beginnt, statt das Produkt zu zeigen, verfehlt die Erwartung — egal wie schön die Markengeschichte ist.

Eine pragmatische Test-Routine

Statt über die „richtige" Faltung zu philosophieren, lohnt eine einfache Routine vor jedem Seiten-Launch. Öffne die Seite auf einem typischen Smartphone (nicht nur im Desktop-Browser mit verkleinertem Fenster, das täuscht). Schau ohne zu scrollen drei Sekunden auf den Bildschirm und beantworte drei Fragen: Verstehe ich, wo ich bin? Verstehe ich, was ich hier bekomme? Sehe ich, was ich als Nächstes tun kann? Wenn auch nur eine Antwort „nein" lautet, hat der sichtbare Bereich seine Aufgabe verfehlt. Diese drei Sekunden ersparen oft teure Diskussionen.

Unterm Strich ist Above the Fold kein Pixelwert, den man abhakt, sondern eine Priorisierungsdisziplin. Die Frage lautet nicht „Was passt noch oben rein?", sondern „Was muss ein fremder Besucher in der ersten Sekunde verstehen, damit er bleibt?". Beantworte die ehrlich, teste sie über die mobile Faltung hinweg, und der teuerste Quadratzentimeter deiner Website fängt an, seinen Preis zu rechtfertigen.