Scrolling im Webdesign: So lenken Sie Besucher durch Ihre Seite

Scrolling im Webdesign ist ein Thema, das in Designmeetings kaum vorkommt, das Besucher aber stärker spüren als fast alles andere. Seit 2012 arbeite ich an Unternehmenswebsites und Onlineshops. Dabei sehe ich zudem immer wieder dasselbe Muster. Das Team investiert Wochen in den ersten Bildschirm und stapelt danach zehn Abschnitte darunter. Allerdings lesen Menschen scrollend und entscheiden scrollend. In diesem Beitrag geht es um Seitenrhythmus, den Mythos vom ersten Bildschirm, die Messung der Scrolltiefe, fixierte Elemente, Vor- und Nachteile von Infinite Scroll sowie das Leistungsrisiko von Scrollanimationen.

Was bedeutet Scrolling im Webdesign und warum ist es wichtig?

Scrolling im Webdesign beschreibt den gesamten Ablauf, den Besucher beim Herunterscrollen einer Seite erleben: Reihenfolge der Inhalte, Übergänge zwischen Abschnitten, fixierte Elemente, Animationen und das Gefühl von Tempo. Ein gut gestalteter Ablauf weckt Neugier auf den nächsten Abschnitt und führt ohne Reibung bis zur Entscheidung.

Diese Definition ist mir wichtig, denn Scrollen ist keine passive Bewegung. Jede Wischgeste ist eine kleine Entscheidung: „Lohnt es sich weiterzulesen?“ Beantwortet ein Abschnitt diese Frage nicht, schließt sich der Tab. Deshalb hat jede Ebene der Seite genau eine Aufgabe. Sie muss die nächste Ebene verkaufen.

Zudem ist das Thema nicht nur eine Frage der Optik. Eine ruckelnde Animation, ein Bild, das beim Laden springt, oder ein fixiertes Menü über dem halben Bildschirm ruinieren selbst das schönste Layout. Kurz gesagt betrifft es Gestaltung, Inhalt, Messung und Leistung zugleich. Daher habe ich diesen Artikel entlang dieser vier Achsen aufgebaut.

Gilt die Regel „Above the Fold“ heute noch?

Die kurze Antwort lautet: teilweise. Die alte Regel verlangte, alles Wichtige in den ersten Bildschirm zu pressen. Heute scrollen Menschen jedoch ganz selbstverständlich, vor allem auf dem Smartphone. Folglich erzeugt dieser Gedanke oft überladene Einstiegsbereiche ohne Luft.

Trotzdem hat der erste Bildschirm großes Gewicht. In der Eye Tracking Studie der Nielsen Norman Group verbrachten Nutzer rund 57 % ihrer Betrachtungszeit im ersten Bildschirm und 74 % in den ersten beiden Bildschirmen. In der Messung von 2010 lag der Anteil des ersten Bildschirms noch bei 80 %. Die Details finden Sie im Artikel Scrolling and Attention von NN/g.

Meine Schlussfolgerung daraus: Der erste Bildschirm muss das Versprechen klar benennen und andeuten, dass unten mehr wartet. Sie müssen nicht alles unterbringen. Überschrift, Unterzeile und die wichtigste Handlung gehören allerdings nach oben, damit Besucher denken: „Hier bin ich richtig.“ Alles andere folgt dann in einer Reihenfolge, die den nächsten Scroll verdient.

Wie bauen Sie einen guten Seitenrhythmus auf?

Seitenrhythmus bedeutet den ausgewogenen Wechsel zwischen dichten und leichten Abschnitten. Wie in der Musik ermüdet eine Seite, die zu lange im gleichen Takt spielt. Drei Textblöcke hintereinander strengen an. Drei Galerien nebeneinander verwässern dagegen die Botschaft.

Für den Rhythmus starte ich oft mit dieser Abfolge:

• Versprechen: eine klare Überschrift und eine Erklärung in einem Satz.
• Beleg: ein kurzer Vertrauensstreifen, zum Beispiel Kundenlogos oder Kennzahlen.
• Erklärung: ein schlichter Abschnitt darüber, wie die Leistung funktioniert.
• Pause: ein luftiger Abschnitt mit einem Bild oder einem Zitat.
• Details: Funktionen, eine Vergleichstabelle oder Prozessschritte.
• Einwände: häufig gestellte Fragen.
• Handlung: ein wiederholter, passender Handlungsaufruf.

Das ist ein Ausgangspunkt, keine Schablone. Entscheidend ist, dass jeder Abschnitt eine andere visuelle Dichte hat. Somit merkt das Auge beim Scrollen, dass etwas Neues beginnt. Außerdem gehört Weißraum zum Rhythmus. Großzügige Abstände zwischen Abschnitten signalisieren: Hier startet ein neues Thema.

Was motiviert Besucher, weiterzuscrollen?

An erster Stelle steht Neugier. Stellen Sie im ersten Bildschirm eine Frage und beantworten Sie sie direkt darunter, dann nutzen Sie diese Neugier ganz natürlich. Eine Überschrift wie „Warum bringt Ihre Website keine Anfragen?“ weckt zum Beispiel den Wunsch, die drei Gründe darunter zu sehen.

An zweiter Stelle stehen visuelle Hinweise. Ragt die Oberkante des nächsten Abschnitts leicht in den ersten Bildschirm, sagt das leise: „Hier geht es weiter.“ Eine angeschnittene Karte, ein halb sichtbares Bild oder eine Überschrift am unteren Rand erfüllen diesen Zweck. Ein hüpfender Pfeil allein reicht dagegen oft nicht. Manche Besucher halten ihn nämlich schlicht für Dekoration, denn er wirkt verspielt.

An dritter Stelle steht Stimmigkeit. Das Versprechen oben muss sich weiter unten einlösen. Folgt im zweiten Abschnitt ein unpassendes Aktionsbanner, sinkt das Vertrauen und das Scrollen endet. Deshalb lese ich vor dem Abschluss alle Abschnittsüberschriften hintereinander. Erzählen sie für sich eine Geschichte, ergibt auch der Scrollverlauf Sinn. Selbst Teams, die mit Storytelling wenig anfangen können, profitieren von diesem Test.

Wie vermeiden Sie den Fehler des „falschen Seitenendes“?

Ein falsches Seitenende ist ein Layout, das fertig wirkt, obwohl es weitergeht. Es entsteht meist, wenn ein bildschirmfüllendes Bild, eine dicke Trennlinie oder ein großer Leerraum genau mit der Unterkante des ersten Bildschirms abschließt. Besucher vermuten dann, dass nichts mehr folgt, und gehen.

Mein Test dafür ist zunächst ganz einfach. Ich öffne die Seite in mehreren Bildschirmhöhen und prüfe die Unterkante der ersten Ansicht. Endet dort exakt ein Abschnitt, besteht folglich ein Risiko. Stattdessen sollten Überschrift oder Karten des nächsten Abschnitts teilweise sichtbar sein.

Vorsicht gilt vor allem bei Einstiegsbereichen mit voller Höhe. Setzen Sie den Hero Bereich auf exakt 100 % der Bildschirmhöhe, signalisiert die Unterkante auf jedem Gerät „Ende“. In der Praxis genügt meist eine Höhe von etwa 80 bis 90 % des sichtbaren Bereichs, damit der nächste Abschnitt hervorschaut. Das ist ein Startbereich aus meiner Praxiserfahrung, keine Garantie. Testen Sie ihn also bei jedem Design.

Wie verändert sich Scrolling im Webdesign auf dem Smartphone?

Auf dem Smartphone ist Scrolling im Webdesign zugleich natürlicher und gnadenloser. Natürlicher, weil Nutzer ständig mit dem Daumen wischen und das nicht als Mühe empfinden. Gnadenloser, weil der Bildschirm klein ist und jedes überflüssige Element den Inhalt weiter nach unten drückt.

Bei mobilen Layouts achte ich besonders auf diese Punkte:

• Halten Sie den fixierten Kopfbereich schmal. Ein Menü über ein Viertel des Bildschirms verkleinert die Lesefläche.
• Setzen Sie horizontale Karussells sparsam ein. Sie schaffen eine zweite Richtung im vertikalen Fluss.
• Trennen Sie Tippziele von Scrollzonen. Beim Wischen versehentlich einen Button zu treffen, nervt.
• Wandeln Sie lange Tabellen auf kleinen Bildschirmen in Karten um oder markieren Sie den horizontalen Scrollbereich deutlich.

Die allgemeinen Prinzipien erkläre ich im Beitrag Was ist Mobile First Design. Wie sich Ihre Website auf dem Smartphone verhält, prüfen Sie zudem mit meiner Anleitung zum Test der Mobilfreundlichkeit.

Wie messen Sie die Scrolltiefe?

Die Scrolltiefe zeigt, wie viel einer Seite Besucher tatsächlich sehen. Ich empfehle, Designentscheidungen auf diese Daten zu stützen, nicht auf Vermutungen. Sonst bauen Sie also Seiten nach Annahmen wie „Niemand scrollt“ oder „Alle lesen bis zum Ende“ um.

Google Analytics 4 sendet bei aktivierter erweiterter Analyse automatisch ein Scroll Ereignis. Dieses Ereignis löst allerdings nur einmal aus, und zwar wenn Besucher etwa 90 % der vertikalen Seitentiefe erreichen. Die Details stehen auf der Hilfeseite zur erweiterten Analyse in GA4. Die Standarddaten beschreiben also nur Menschen, die fast das Ende erreichen. Wo andere in der Mitte abspringen, zeigen sie nicht.

Deshalb ergänze ich in den meisten Projekten zusätzliche Schwellen. Dann sehe ich konkret, in welchem Abschnitt Besucher verloren gehen. Außerdem stellen Heatmap Tools die Verteilung visuell dar, was Diskussionen im Team erleichtert. Das Ziel ist also nicht, Zahlen zu sammeln. Ziel ist, den Abschnitt zu finden, der wie eine Wand wirkt.

Wie richten Sie eigene Scrollschwellen in GA4 ein?

Am praktischsten gelingt das mit dem Google Tag Manager. Dort gibt es einen fertigen Trigger für die Scrolltiefe. Zunächst tragen Sie vertikale Prozentwerte wie 25, 50, 75 und 90 ein. Danach erstellen Sie ein GA4 Ereignis Tag, das auf diesen Trigger reagiert.

So gehe ich dabei vor:

1. Schalten Sie das Standard Scroll Ereignis in der erweiterten Analyse ab oder geben Sie Ihrem eigenen Ereignis einen anderen Namen. Sonst kommen die 90 % doppelt an.
2. Legen Sie im Tag Manager den Trigger für die Scrolltiefe mit vertikalen Prozentwerten an.
3. Übergeben Sie den Prozentwert als Ereignisparameter. Die integrierte Variable Scroll Depth Threshold eignet sich gut.
4. Registrieren Sie diesen Parameter in GA4 als benutzerdefinierte Dimension. Ohne diesen Schritt sehen Sie ihn in keinem Bericht.
5. Testen Sie im Vorschaumodus und prüfen Sie die Ereignisse im Echtzeitbericht.

Ein Hinweis noch: Auf sehr kurzen Seiten täuschen Prozentschwellen, denn 75 % sind dort oft sofort sichtbar. Für solche Seiten nutze ich lieber den Trigger für die Sichtbarkeit von Elementen, der einen bestimmten Abschnitt erfasst. Wie Sie solche Ereignisse im Bericht lesen, erkläre ich im Beitrag Marketing Report richtig lesen.

Wie interpretieren Sie Scrolldaten richtig?

Scrolldaten sind für sich weder gut noch schlecht. Bleiben zum Beispiel die meisten Besucher einer Kontaktseite bei 25 % stehen, ist das in Ordnung. Steht die Telefonnummer im ersten Bildschirm, haben sie dann sie ihr Ziel erreicht. Verlässt auf einer langen Leistungsseite dagegen die Mehrheit die Seite vor dem Preisabschnitt, gibt es in der Mitte einen Bruch.

Beim Lesen der Daten stelle ich drei Fragen. Erstens: Gibt es einen plötzlichen Einbruch in der Verteilung? Ein scharfer Einbruch deutet meist auf einen unpassenden Abschnitt oder ein falsches Seitenende hin. Zweitens: Konvertieren Besucher, die tief scrollen, häufiger? Dann hilft es oft, zentrale Argumente etwas höher zu ziehen. Drittens: Wie groß ist der Unterschied zwischen Smartphone und Desktop?

Zudem lohnt sich der Blick auf die Absprungrate. Wege, Besucher auf der Seite zu halten, beschreibe ich im Beitrag Absprungrate senken. Anders gesagt: Scrolldaten dienen der Diagnose. Die Therapie liegt im Inhalt selbst.

Wann helfen Sticky Header und fixierte Elemente?

Fixierte Elemente sind Menüs, Buttons oder Infoleisten, die beim Scrollen sichtbar bleiben. Richtig eingesetzt erleichtern sie die Navigation. Falsch eingesetzt erdrücken sie den Inhalt.

Ein fixierter Kopfbereich hilft meist in Onlineshops, in denen Nutzer oft zum Menü zurückkehren, auf langen Leistungsseiten mit vielen Abschnitten und in Katalogen, in denen die Suche zählt. Auf Landingpages mit nur einem Ziel ist ein fixiertes Menü dagegen oft überflüssig. Es lenkt also bloß ab.

Beim Einsatz fixierter Elemente halte ich mich an diese Regeln:

• Verkleinern Sie den Kopfbereich beim Scrollen, statt die volle Größe mitzuschleppen.
• Kopfbereiche, die beim Abwärtsscrollen verschwinden und beim Aufwärtsscrollen zurückkehren, sparen mobil viel Platz.
• Nutzen Sie höchstens ein fixiertes Element oben und eines unten. Cookie Banner, Chatfenster und Aktionsleiste zusammen blockieren den Bildschirm.
• Bevorzugen Sie position: sticky in CSS. Lösungen, die per JavaScript jedes Scrollereignis abfangen, kosten Leistung.

Steigert eine fixierte Call to Action Leiste die Conversions?

Eine fixierte Leiste mit Handlungsaufruf kann gut funktionieren, vor allem mobil. Egal wo Besucher gerade sind, der Button „Angebot anfordern“ oder „Anrufen“ ist einen Fingertipp entfernt. Ein Selbstläufer ist sie trotzdem nicht. Auf manchen Seiten wirkt sie aufdringlich und erinnert an Werbung.

Mein Rat: Blenden Sie die Leiste im ersten Bildschirm aus und zeigen Sie sie erst, wenn Besucher den Hauptbutton passiert haben. Somit stehen nie zwei identische Buttons nebeneinander. Außerdem gibt eine schließbare Leiste Nutzern ein Gefühl von Kontrolle.

Testen Sie eine solche Leiste, bevor Sie sie ausrollen. Vergleichen Sie über einen festen Zeitraum eine Version mit und eine ohne Leiste und messen Sie die Formularanfragen. Mehr zu Buttontext und Platzierung finden Sie in meinen Beispielen für CTA Buttons. Die Logik eines conversionstarken Seitenflusses erkläre ich im Beitrag conversionorientiertes Webdesign.

Infinite Scroll oder Paginierung: Was passt besser?

Infinite Scroll lädt automatisch neue Inhalte nach, sobald Nutzer das Seitenende erreichen. In Social Feeds funktioniert das hervorragend, denn dort geht es um Entdecken und Stöbern. Geht es dagegen darum, ein bestimmtes Produkt zu finden oder zu vergleichen, sieht die Lage anders aus.

Stelle ich die drei Ansätze nebeneinander, ergibt sich folgender Vergleich:

Bei Unternehmenswebsites und Onlineshops wähle ich meist den Button „Mehr laden“. Er gibt Nutzern Kontrolle, hält den Footer erreichbar und macht jedes Nachladen zu einer bewussten Entscheidung.

Wie wirkt sich Infinite Scroll auf SEO aus?

Google veröffentlicht klare Richtlinien zu Paginierung und schrittweisem Laden. Der Kern: Jeder Inhaltsteil braucht eine eigene, direkt aufrufbare URL. Denn der Googlebot scrollt Ihre Seite nicht wie ein Mensch herunter, um neue Inhalte auszulösen.

Der Leitfaden von Google Search Central zur Paginierung gibt dazu konkrete Empfehlungen. Er rät etwa, jeder Seite eine eindeutige URL zu geben, Seiten mit normalen <a href> Links zu verbinden und nicht die erste Seite einer Reihe als kanonische Adresse aller Seiten zu setzen. Zudem weist er darauf hin, dass URL Fragmente (#) allein für Produktlisten nicht genügen.

In der Praxis verknüpfe ich Infinite Scroll oder den Button „Mehr laden“ im Hintergrund mit echten Seitenadressen wie ?page=2. Beim Scrollen aktualisiert sich die Adresszeile. Zudem erreicht die Suchmaschine dieselben Inhalte über normale Links. Somit gewinnen beide Seiten. Bei großen Katalogen gehört auch die Kategoriearchitektur dazu, mehr dazu im Beitrag Kategoriestruktur für große Websites.

Wie beeinflussen Scrollanimationen die Ladezeit und Leistung?

Gut gebaut bringen Scrollanimationen Bewegung und Fluss auf die Seite. Allerdings stammt ein großer Teil der Leistungsprobleme, die ich sehe, genau aus diesen Animationen. Ältere Parallax Bibliotheken, die bei jedem Scrollereignis JavaScript ausführen, sind die üblichen Verdächtigen. Auf schwachen Smartphones ruckelt die Seite deshalb spürbar.

Zwei der Core Web Vitals von Google spielen hier direkt hinein. Das erste ist CLS, also die visuelle Stabilität. Laut dem CLS Leitfaden auf web.dev braucht eine gute Nutzererfahrung einen Wert von 0,1 oder weniger. Der Leitfaden empfiehlt außerdem, transform und opacity zu animieren statt Layouteigenschaften wie top, left, width oder height. Das zweite ist INP, die Reaktionszeit auf Interaktionen. Scrollcode, der den Hauptthread blockiert, verschlechtert diesen Wert.

Konkret rate ich: Animieren Sie nur transform und opacity. Markieren Sie Scroll Listener als passiv. Prüfen Sie die Sichtbarkeit von Elementen mit dem Intersection Observer statt mit einem Scroll Handler. Messen können Sie Ihre Seite mit meiner Anleitung zum Lighthouse Test. Wie die Ladezeit das Ranking beeinflusst, beschreibe ich im Beitrag Ladezeit und SEO.

Warum sollten Sie Scroll Hijacking vermeiden?

Scroll Hijacking, auch Scrolljacking genannt, überschreibt das natürliche Scrollverhalten des Browsers. Ein Beispiel: Eine Drehung am Mausrad lässt die Seite zum nächsten bildschirmfüllenden Abschnitt springen. Künstlich verlangsamtes Scrollen gehört zur selben Familie.

Auf den ersten Blick wirkt das beeindruckend, deshalb setzen Showcase Websites es gern ein. Nutzer fühlen sich allerdings entmündigt. Auf Touchpads, bei anderen Mauseinstellungen und bei Tastaturnavigation verhält sich die Seite uneinheitlich. Wer schnell zu einer früheren Stelle zurück möchte, muss zudem jeden Abschnitt einzeln passieren.

Meine Regel ist einfach: Finger weg von Scrolltempo und Scrollrichtung. Wünschen Sie Bewegung, wählen Sie leichte Effekte, etwa Inhalte, die beim Sichtbarwerden sanft einblenden. Wollen Sie bildschirmfüllende Abschnitte, bietet CSS Scroll Snap im Modus proximity eine ähnliche Struktur, ohne das Scrollen zu kapern. Weitere Fehler, die Umsatz kosten, beschreibe ich im Beitrag UX Fehler, die Umsatz kosten.

Wie schützen Sie bewegungsempfindliche Nutzer?

Manche Menschen reagieren auf viel Bewegung am Bildschirm mit Schwindel oder Übelkeit. Betriebssysteme bieten ihnen deshalb die Einstellung „Bewegung reduzieren“. Browser geben diese Präferenz über eine eigene Media Query an Ihre Website weiter.

Laut der MDN Dokumentation zu dieser Media Query erkennt sie, ob Nutzer im System darum gebeten haben, unnötige Bewegung zu minimieren. In diesem Fall können Sie Parallax, große Scrollanimationen und automatisch bewegte Hintergründe abschalten oder abschwächen.

Ich betrachte das als Standardschritt, nicht als Extra. Außerdem prüfe ich diese Punkte:

• Lässt sich die Seite mit der Tastatur, also mit Tab und Leertaste, sauber scrollen?
• Verdeckt der fixierte Kopfbereich den fokussierten Link? Dann schaffen Sie per CSS einen oberen Scrollabstand.
• Haben automatisch laufende Elemente einen Pausenknopf?

Barrierefreiheit verbessert meist die Bedienbarkeit für alle. Daher rate ich, diese Schritte nie zu überspringen.

Wie erleichtern Sie die Navigation auf langen Seiten?

Lange Seiten sind nicht das Problem. Problematisch sind Seiten, auf denen man sich verirrt. Leistungsseiten, Ratgeber und Produktvergleiche werden von Natur aus lang. Deshalb brauchen Besucher eine Landkarte.

Das erste Werkzeug ist ein Inhaltsverzeichnis. Ein Kasten am Seitenanfang oder eine fixierte Seitenleiste auf dem Desktop lässt Leser direkt zum gewünschten Abschnitt springen. Zudem kann Ihr Vertrieb Interessenten einen direkten Link zum passenden Teil schicken, wenn jede Überschrift einen Anker hat.

Das zweite Werkzeug ist eine Fortschrittsanzeige. Bei langen Artikeln zeigt ein schmaler Balken oben, wie viel noch fehlt. Das dritte Werkzeug ist ein Button „Nach oben“, den Menschen auf langen mobilen Seiten wirklich nutzen. Im ersten Bildschirm ergibt er allerdings keinen Sinn. Er sollte erst nach einigen Bildschirmen erscheinen.

Schließlich sind Abschnittsüberschriften selbst Navigationshilfen. Wer überfliegt, schaut nur auf Überschriften und fette Begriffe. Fassen die Überschriften den Inhalt nicht zusammen, verlassen Leser die Seite, bevor sie finden, was sie suchen. Wie leicht Ihr Text lesbar ist, prüfen Sie mit dem Tool zur Lesbarkeitsprüfung.

Welche Abschnitte gehören an den Anfang der Seite?

Die Reihenfolge der Abschnitte ist das Rückgrat des Scrollens. Dieselben Inhalte in anderer Abfolge hinterlassen einen völlig anderen Eindruck. Daher orientiere ich mich an der Reihenfolge der Fragen im Kopf der Besucher.

Wer auf einer Leistungsseite landet, fragt zunächst: „Löst das mein Problem?“ Dann folgt „Wie funktioniert das?“, danach „Wem vertraue ich hier?“ und schließlich „Was kostet es und wie starte ich?“ Beantworten die Abschnitte diese Fragen in derselben Reihenfolge, wirkt der Scrollverlauf logisch.

Zur Prüfung nutze ich zwei Quellen. Die erste sind die Fragen, die Ihr Vertrieb am Telefon am häufigsten hört, denn sie zeigen echte Einwände. Die zweite ist die Zielgruppenanalyse. Wie ich ein Besucherprofil erstelle, beschreibe ich im Beitrag Zielgruppenanalyse.

Noch ein letzter Hinweis: Betrachten Sie die Reihenfolge nicht als endgültig. Zeigen die Scrolldaten, dass ein Abschnitt ständig übersprungen wird, verschieben oder kürzen Sie ihn. Somit reift die Seite mit echtem Verhalten. Ehrlich gesagt erzielte ich die besten Ergebnisse mit Seiten, die ich nach dem Start zwei oder drei Mal überarbeitet habe.

Welche Checkliste hilft beim Test von Scrolling im Webdesign?

Vor dem Livegang sollten Sie das Scrollverhalten systematisch testen. Diese Liste gehe ich in jedem Projekt durch:

1. Deutet die Unterkante des ersten Bildschirms bei verschiedenen Höhen den nächsten Abschnitt an?
2. Ergeben die Abschnittsüberschriften hintereinander gelesen einen sinnvollen Ablauf?
3. Ist Platz für Bilder und Werbeflächen reserviert, oder springt der Inhalt beim Laden?
4. Wie viele fixierte Elemente sind gleichzeitig sichtbar? Bleibt mobil genug Lesefläche?
5. Laufen Animationen nur über transform und opacity?
6. Beruhigt sich die Seite, wenn „Bewegung reduzieren“ aktiv ist?
7. Entsprechen nachgeladene Teile echten URLs?
8. Kommen die Scrollereignisse korrekt in GA4 an?
9. Landen Nutzer nach dem Zurückgehen wieder an derselben Stelle der Liste?

Gehen Sie diese Liste auch auf einem einfachen Android Smartphone durch. Eine Seite, die auf einem starken Laptop flüssig läuft, kann auf einem Mittelklassegerät ruckeln. Notieren Sie danach die Probleme und priorisieren Sie sie, damit die Arbeit überschaubar bleibt.

Wie hängt das Scrollverhalten mit SEO und Conversions zusammen?

Scrollverhalten ist kein direkter Rankingfaktor. Google hat nicht erklärt, die Scrolltiefe als Rankingsignal zu nutzen. Dennoch können Dinge, die das Scrollen stören, zu messbaren Signalen werden: Core Web Vitals wie CLS und INP, mobile Nutzbarkeit und crawlbare Inhalte.

Auf der Conversionseite ist der Zusammenhang deutlich klarer. Denn wer die überzeugenden Abschnitte nie erreicht, konvertiert nicht. Stehen Preise, Referenzen und Kontakt ganz am Ende und kommen die meisten Besucher dort nie an, liegt das Problem im Design. Deshalb lese ich Scrolldaten immer neben den Formularanfragen.

Wo sich SEO und Nutzererfahrung treffen, beschreibe ich ausführlicher im Beitrag SEO und UX. Zusammengefasst sorgt ein guter Scrollverlauf dafür, dass Besucher aus der Suche nicht verpuffen.

Wo starten Sie mit Scrolling im Webdesign?

Für besseres Scrolling im Webdesign brauchen Sie keinen kompletten Relaunch. Konkret beginne ich meist mit den drei Seiten mit dem meisten Traffic. Zunächst messe ich die aktuelle Scrollverteilung. Dann suche ich den Abschnitt, an dem Besucher abspringen. Anschließend vereinfache ich ihn, verschiebe ihn oder entferne ihn ganz.

Der zweite Schritt betrifft die Leistung. Schwere Animationen und unnötige fixierte Elemente zu entfernen, bringt oft schneller Ergebnisse als die Designarbeit selbst. Der dritte Schritt heißt testen und erneut messen. Beobachten Sie jede Änderung einige Wochen, bevor Sie die nächste angehen. Sonst wissen Sie nicht, was wirklich gewirkt hat.

Brauchen Sie eine Lösung, die Scrollfluss, Messung und Leistung gemeinsam abdeckt, übernehme ich diese Arbeit im Rahmen meiner Webdesign Leistung von Anfang bis Ende. Möchten Sie besprechen, wo Sie bei Ihrer aktuellen Website ansetzen sollten, erreichen Sie mich über die Kontaktseite.