Above the fold
Above the Fold bezeichnet den Bereich einer Website, der direkt nach dem Laden sichtbar ist, ohne dass Nutzer scrollen müssen. Welche Inhalte dort erscheinen, kann den ersten Eindruck sowie Orientierung und Nutzerführung beeinflussen.
Dabei handelt es sich nicht um einen fest definierten Bereich mit einer bestimmten Pixelhöhe. Je nach Bildschirmgröße, Browserfenster, Endgerät und Seitengestaltung liegt der sogenannte Fold an einer anderen Position. Der Begriff beschreibt daher immer den jeweils sichtbaren Ausschnitt einer Website.
Das Wichtigste zu Above the Fold in Kürze
- Above the Fold ist der Bereich einer Website, der ohne Scrollen sichtbar ist.
- Der Begriff stammt ursprünglich aus dem Zeitungswesen.
- Einen festen Fold in Pixeln gibt es nicht, da Bildschirmgrößen und Viewports variieren.
- Zentrale Inhalte wie Headline, Seitenkontext und Orientierung sollten möglichst früh verständlich sein.
- Für SEO ist Above the Fold kein isolierter Rankingfaktor, kann aber im Zusammenhang mit Nutzererfahrung, Zugänglichkeit und Performance relevant sein.
Was ist Above the Fold?
Der englische Ausdruck „Above the Fold“ bedeutet sinngemäß „oberhalb der Falz“. Im Webdesign bezeichnet er den Teil einer Webseite, den Besucher unmittelbar nach dem Aufrufen sehen. Alles, was erst durch Scrollen sichtbar wird, befindet sich entsprechend „Below the Fold“.
Für Websites ist diese Unterscheidung vor allem deshalb relevant, weil der erste sichtbare Bereich die erste inhaltliche Orientierung liefert. Nutzer können dort erkennen, auf welcher Seite sie sich befinden, welches Thema oder Angebot behandelt wird und welche weiteren Inhalte zu erwarten sind.
Above the Fold ist kein einzelnes Gestaltungselement, sondern ein Bereich des aktuellen Viewports. Er kann beispielsweise eine Navigation, eine Überschrift, erläuternden Text, ein Bild oder einen Call-to-Action enthalten.
Woher kommt der Begriff Above the Fold?
Der Begriff stammt ursprünglich aus dem Zeitungswesen. Gefaltete Zeitungen werden häufig so ausgelegt oder präsentiert, dass nur die obere Hälfte der Titelseite sichtbar ist. Wichtige Schlagzeilen und Bilder wurden deshalb bevorzugt oberhalb dieser Falz platziert. Dieses Prinzip wurde später auf Websites übertragen. Auch hier erhält der unmittelbar sichtbare Bereich besondere Aufmerksamkeit. Während die Falz einer Zeitung physisch festgelegt ist, verändert sich der Fold einer Website abhängig vom Endgerät und vom jeweiligen Viewport.
Above the Fold und Below the Fold – wo liegt der Unterschied?
Above the Fold und Below the Fold beschreiben keine unterschiedlichen Arten von Content, sondern dessen Position innerhalb einer Seite.
- Above the Fold umfasst alles, was Nutzer beim ersten Laden ohne Scrollen sehen.
- Below the Fold beginnt dort, wo weitere Inhalte erst nach einer Scrollbewegung sichtbar werden.
Wichtige Informationen müssen nicht ausschließlich im ersten Viewport stehen. Umfangreiche Texte, Produktdetails, Referenzen oder FAQs benötigen meist mehr Platz. Entscheidend ist, dass der Einstieg ausreichend Orientierung bietet und der weitere Seiteninhalt logisch anschließt.
Warum ist der Above-the-Fold-Bereich wichtig?
Der erste sichtbare Bereich beeinflusst, wie schnell Besucher eine Website inhaltlich einordnen können. Innerhalb kurzer Zeit sollte verständlich werden, worum es auf der Seite geht und welchen Zweck sie erfüllt. Das bedeutet nicht, dass Above the Fold möglichst viele Informationen enthalten sollte. Zu viele Texte, Buttons, Bilder oder Navigationselemente können die Orientierung erschweren. Die Auswahl und Gewichtung der Inhalte ist daher wichtiger als ihre reine Menge.
Aufmerksamkeit und erster Eindruck
Above the Fold bildet häufig den visuellen und inhaltlichen Einstieg einer Website. Gestaltung, Überschrift, Navigation und Bildsprache vermitteln bereits einen ersten Eindruck von Thema und Struktur der Seite. Ein großer Hero-Bereich erfüllt diese Aufgabe jedoch nicht automatisch. Ein visuell auffälliges Bild ersetzt keine verständliche Aussage. Wenn ein Bild viel Platz beansprucht, ohne zusätzlichen Kontext zu vermitteln, kann der eigentlich relevante Inhalt weiter nach unten verschoben werden.
Orientierung und Conversion
Auf Landingpages oder Leistungsseiten kann der erste Viewport auch für die Conversion relevant sein. Eine klare Headline, ein verständliches Nutzenversprechen und gegebenenfalls ein passender Call-to-Action können dabei helfen, mögliche nächste Schritte zu erkennen. Ein Button muss jedoch nicht auf jeder Website zwingend vollständig Above the Fold sichtbar sein. Bei komplexeren oder erklärungsbedürftigen Angeboten kann zunächst zusätzlicher Kontext erforderlich sein. Die sinnvolle Position hängt deshalb vom Seitentyp, Inhalt und Nutzungskontext ab
Was gehört Above the Fold auf eine Website?
Welche Inhalte im ersten Viewport sinnvoll sind, hängt vom Seitentyp und von der jeweiligen Such- oder Nutzungsintention ab. Ein Glossareintrag benötigt einen anderen Einstieg als ein Online-Shop, eine B2B-Leistungsseite oder eine Kampagnen-Landingpage. Typischerweise sollte eine klare Überschrift früh erkennen lassen, welches Thema oder Angebot die Seite behandelt. Ergänzend können ein kurzer erläuternder Text, Navigationselemente oder eine Handlungsoption sinnvoll sein.
Headline und Nutzenversprechen
Die Headline ist häufig eines der wichtigsten Textelemente im ersten Viewport. Sie sollte möglichst konkret benennen, was Besucher auf der Seite erwartet.
Auf kommerziellen Seiten kann ein ergänzender Text dabei helfen, das Angebot oder dessen Nutzen genauer einzuordnen. Wichtig ist vor allem, dass die Aussage verständlich bleibt und nicht erst aus mehreren Gestaltungselementen erschlossen werden muss.
Call-to-Action
Ein Call-to-Action kann Above the Fold sinnvoll sein, wenn Nutzer an dieser Stelle bereits genügend Informationen für eine Handlung besitzen. Das kann beispielsweise bei klar definierten Anfragen, bekannten Angeboten oder fokussierten Landingpages der Fall sein.
Bei erklärungsbedürftigen Inhalten ist eine sofortige Handlungsaufforderung dagegen nicht zwangsläufig erforderlich. Ein sichtbarer Button ist kein allgemeingültiges Merkmal eines guten Above-the-Fold-Bereichs.
Weitere mögliche Elemente
Je nach Website können Bewertungen, Zertifikate, Kundenlogos oder andere Orientierungselemente im ersten Viewport erscheinen. Sie sind jedoch kein notwendiger Bestandteil von Above the Fold und sollten die zentrale Aussage der Seite nicht überlagern.
Auch Bilder und Grafiken können den Einstieg unterstützen. Ein Hero-Bild ist jedoch ebenfalls keine Voraussetzung. Sinnvoll ist ein visuelles Element vor allem dann, wenn es den Inhalt ergänzt, ein Produkt zeigt oder einen Sachverhalt schneller verständlich macht.
Wie groß ist der Above-the-Fold-Bereich?
Für den Above-the-Fold-Bereich gibt es keine allgemeingültige Höhe in Pixeln. Bereits zwei Desktop-Nutzer können aufgrund unterschiedlicher Monitorgrößen, Bildschirmauflösungen oder Browserfenster verschiedene Ausschnitte derselben Website sehen. Zusätzlich beeinflussen Browserleisten, Header, Cookie-Hinweise und andere Interface-Elemente die tatsächlich verfügbare Fläche. Ein universeller Wert wie „600 Pixel sind Above the Fold“ lässt sich daher nicht sinnvoll auf alle Websites und Endgeräte übertragen.
Auf größeren Desktop-Bildschirmen steht meist mehr horizontaler und vertikaler Raum zur Verfügung. Dennoch verwenden nicht alle Besucher dieselbe Auflösung oder dieselbe Größe des Browserfensters.
Auch auf dem Desktop ist der Fold deshalb variabel. Responsive Layouts passen Inhalte und Anordnung entsprechend an unterschiedliche Viewports an.
Auf Smartphones ist der verfügbare Bereich schmaler. Gleichzeitig können Browserleisten, Cookie-Hinweise oder umfangreiche Header einen Teil des sichtbaren Viewports einnehmen.
Dadurch können beispielsweise große Bilder oder mehrzeilige Navigationselemente dazu führen, dass zentrale Inhalte erst nach dem Scrollen erscheinen. Auf kleinen Viewports ist deshalb eine besonders klare Priorisierung der Inhalte erforderlich.
Ist Above the Fold wichtig für SEO?
Above the Fold ist kein isolierter SEO-Rankingfaktor, mit dem sich Rankings allein durch die Position bestimmter Inhalte verbessern lassen. Suchmaschinen berücksichtigen die gesamte Seite und nicht ausschließlich den ersten sichtbaren Ausschnitt. Dennoch bestehen Zusammenhänge mit anderen Qualitätsaspekten. Hauptinhalte sollten gut zugänglich sein und nicht durch störende Elemente verdrängt werden. Auch Ladegeschwindigkeit und visuelle Stabilität können die Nutzererfahrung einer Seite beeinflussen. Besonders große Bilder oder andere Medien im ersten Viewport können technisch relevant sein, wenn sie viel Ladezeit benötigen. In diesem Zusammenhang kann unter anderem die Core-Web-Vitals-Kennzahl Largest Contentful Paint (LCP) eine Rolle spielen.
Für SEO ist daher nicht entscheidend, ob ein bestimmtes Keyword oder ein Button Above the Fold steht. Entscheidend ist, dass zentrale Inhalte verständlich, zugänglich und technisch zuverlässig dargestellt werden.
Häufige Fehler im Above-the-Fold-Bereich
- Unklare Kernaussage: Besucher sehen einen aufwendig gestalteten Einstieg, können das Thema oder Angebot jedoch nicht eindeutig einordnen.
- Sehr große Hero-Fläche: Ein Bild oder Video nimmt einen Großteil des Viewports ein und verschiebt zentrale Informationen nach unten.
- Zu viele gleichwertige Elemente: Mehrere Buttons, Hinweise oder Botschaften konkurrieren um Aufmerksamkeit.
- Nur für große Bildschirme gestaltet: Auf kleineren Viewports verändert sich die Reihenfolge oder Sichtbarkeit wichtiger Inhalte deutlich.
- Fehlende Priorisierung: Navigation, Bilder, Hinweise und Texte erhalten eine ähnliche visuelle Gewichtung, obwohl sie unterschiedliche Funktionen erfüllen.
Nicht jedes dieser Muster ist grundsätzlich problematisch. Ob eine Gestaltung funktioniert, hängt vom Inhalt, dem Seitentyp und dem Nutzungskontext ab.
Welche Merkmale können bei Above the Fold relevant sein?
Welche Elemente im ersten sichtbaren Bereich sinnvoll sind, hängt vom Seitentyp, vom Inhalt und vom Nutzungskontext ab. Es gibt daher keine allgemeingültige Checkliste, die für jede Website gleichermaßen gilt. Bestimmte Merkmale können jedoch dabei helfen, den Above-the-Fold-Bereich einzuordnen. Dazu zählen insbesondere:
- Erkennbarkeit des Themas oder Angebots: Nutzer sollten möglichst schnell erfassen können, worum es auf der Seite geht.
- Verständlichkeit der Hauptüberschrift: Die Überschrift sollte das zentrale Thema oder den Inhalt der Seite nachvollziehbar benennen.
- Visuelle Hierarchie: Überschriften, Texte, Bilder und andere Elemente sollten so angeordnet sein, dass ihre jeweilige Bedeutung erkennbar bleibt.
- Funktion von Bildern und Grafiken: Visuelle Elemente können Inhalte unterstützen, sollten zentrale Informationen jedoch nicht unnötig verdrängen.
- Darstellung auf unterschiedlichen Endgeräten: Da sich der sichtbare Bereich je nach Viewport verändert, kann dieselbe Seite auf Desktop und Smartphone unterschiedlich wirken.
- Zugänglichkeit zentraler Inhalte: Wichtige Inhalte sollten ohne unnötige visuelle oder technische Barrieren erreichbar sein.
- Ladeverhalten im ersten Viewport: Große Bilder, Videos oder andere Medien können beeinflussen, wie schnell der sichtbare Bereich vollständig dargestellt wird.
Diese Merkmale sind keine festen Qualitätskriterien. Welche Gewichtung sinnvoll ist, hängt davon ab, welche Funktion die jeweilige Seite erfüllt. Ein Glossarartikel stellt andere Anforderungen an den ersten Viewport als beispielsweise eine Landingpage, ein Online-Shop oder eine redaktionelle Startseite.
Fazit: Above the Fold schafft vor allem Orientierung
Above the Fold beschreibt den ersten sichtbaren Bereich einer Website und damit einen wichtigen Teil der Nutzererfahrung. Seine Funktion besteht nicht darin, möglichst viele Inhalte ohne Scrollen unterzubringen, sondern zentrale Informationen verständlich zu priorisieren.
Eine klare Überschrift, ein nachvollziehbarer Seitenkontext und eine erkennbare visuelle Hierarchie sind in der Regel wichtiger als die starre Platzierung einzelner Elemente. Gleichzeitig muss die Darstellung auf unterschiedlichen Geräten funktionieren, da es keinen universellen Fold gibt.
Für SEO ist Above the Fold kein direkter Rankinghebel. Für Nutzerführung, Conversion und technische Performance kann die Gestaltung des ersten Viewports dennoch relevant sein. Ein verständlicher Above-the-Fold-Bereich beantwortet vor allem drei Fragen: Wo bin ich, worum geht es hier und was kann ich als Nächstes tun?
Häufige Fragen zu Above the Fold
Auf Websites bezeichnet Above the Fold den Bereich, der nach dem Laden ohne Scrollen sichtbar ist.
Das hängt vom Seitentyp ab. In der Regel sollten Thema, Angebot oder Zweck der Seite möglichst schnell erkennbar sein. Häufig gehören deshalb eine verständliche Headline und ein kurzer erläuternder Inhalt dazu.
Above the Fold ist kein eigenständiger Rankingfaktor. Eine gute Zugänglichkeit der Hauptinhalte, Nutzererfahrung und technische Performance können jedoch für die Gesamtqualität einer Website relevant sein.
Es gibt keinen festen Pixelwert. Bildschirmgröße, Browserfenster, Endgerät und responsive Gestaltung bestimmen, welcher Teil einer Website ohne Scrollen sichtbar ist.
Nein. Ein CTA kann dort sinnvoll sein, ist jedoch nicht in jedem Fall erforderlich. Bei erklärungsbedürftigen Inhalten kann zunächst zusätzlicher Kontext notwendig sein.
Nein. Die Hero-Section ist ein Gestaltungselement im oberen Bereich einer Website. Above the Fold bezeichnet dagegen den gesamten sichtbaren Ausschnitt des Viewports. Eine Hero-Section kann diesen Bereich vollständig oder nur teilweise ausfüllen.
