Das Fold-Manifesto: Warum die Knicklinie immer noch von Bedeutung ist

Was oben auf der Seite steht versus dem, was versteckt ist, wird die User Experience immer beeinflussen - unabhängig von der Bildschirmgrösse. Die durchschnittliche Differenz, wie Nutzer den sichtbaren Teil versus denjenigen unter der sogenannten Knicklinie behandeln liegt bei 84%.

© Goss Vitalij - Fotolia.com

by Amy Schade (deutsche Übersetzung) - 01.02.2015

Bildschirmgrössen verändern sich ständig und Designs können auf diese Grössen reagieren, anstatt sich an eine konstante Grösse anzupassen. Wenn Kunden, Designer, Entwickler oder Vermarkter daher von Inhalten "above the fold" sprechen - ein Begriff, der aus dem Zeitungswesen stammt und jenen Teil der Website bezeichnet, der ohne Scrollen sichtbar ist – sollte die Frage erlaubt sein, ob das überhaupt noch Sinn macht.

Ja. Der Falz existiert immer noch und hat weiterhin Gültigkeit. Obwohl die genaue Platzierung des Falzes je nach Gerät variiert, existiert er für jeden Nutzer und auf jedem einzelnen Bildschirm. Vom technischen Standpunkt aus, kann der Falz der gängigsten Bildschirmgrössen bestimmt werden, indem man sich den Webtraffic, sowie Geräte- und Browser-Statistiken ansieht. Ein Responsive Design könnte 2, 3, 4 oder mehr verschiedene Falzlinien aufweisen, welche vom Gerät und den Bildschirmgrössen abhängen, für die das Design optimiert wurde. Jedes Zielgerät verfügt über seinen eigenen Falz, der berücksichtigt werden muss.

Der Falz ist mehr als ein Messwert, er ist ein Konzept. Der Falz muss berücksichtigt werden, da es ausschlaggebend dafür ist, welche Inhalte ganz oben auf der Website platziert werden. Nutzer scrollen zwar - allerdings nur, wenn die Inhalte über dem Falz vielversprechend genug sind. Inhalte, die auf der Website zu sehen sind, ohne dass dafür eine Handlung notwendig ist, motivieren den Nutzer zum Scrollen. Das gilt für jede Bildschirmgrösse, egal ob sich um ein Smartphone, ein Tablet oder einen Desktop-Computer handelt. Verborgene Inhalte, die der Nutzer öffnen muss, werden nur dann anzeigt, wenn der Nutzer der Meinung ist, dass sie den Aufwand wert sind.

Der ausschlaggebende Punkt sind die Interaktionskosten (engl.):

• Sichtbare Inhalte, die keine weitere Handlung voraussetzen (d.h. above the fold) = geringe Interaktionskosten, um die Inhalte zu sehen
• Unsichtbare Inhalte, die eine Handlung voraussetzen, um angezeigt zu werden (d.h. below the fold oder auf andere Weise verborgen) = höhere Interaktionskosten, bestehend aus (a) dem mentalen Aufwand des Erratens, dass etwas versteckt ist, und der positiven Entscheidung, den Inhalt anzuzeigen, sowie (b) dem physischen Aufwand, die notwendigen Schritte zu unternehmen, um die Inhalte zu sehen (z.B. durch die Seite scrollen).

Wir gehen nicht auf eine Website, sehen nutzlose und irrelevante Inhalte und scrollen in der Hoffnung, dass 5 Bildschirme weiter unten nützliche Dinge versteckt sein könnten, nach unten. Was wir im oberen Bereich der Website sehen, hilft uns, zu entscheiden, ob wir weiterscrollen, eine andere Unterseite öffnen, eine andere Website ausprobieren oder die Aufgabe komplett abbrechen möchten. Deshalb profitieren lange Seiten von Wegweisern im oberen Bereich der Seite - entweder in Form von Links oder Inhalten - die Nutzern zeigen, was sie als nächstes zu erwarten haben.

Da Bildschirme immer kleiner werden, sind wir gezwungen, mehr zu scrollen. Wenn nur wenige Inhalte im oberen Bereich eines kleinen Handydisplays angezeigt werden, suchen wir weiter unten nach weiteren Informationen. Wir tun das aber nicht, da wir gerne scrollen. Wir tun es, da wir uns unter dem Falz weitere wertvolle Informationen erwarten.

Zum Scrollen animieren

Websites müssen eine solide Geschichte aufbauen. Nutzer können zum Scrollen motiviert werden, indem ihnen ein guter Grund dafür gegeben wird. Visuelle Elemente lenken die Blicke auf den unteren Bereich der Seite. Fesselnde Inhalte erregen die Aufmerksamkeit der Nutzer. Falls sich die interessantesten Informationen im oberen Bereich der Seite befinden, könnten Nutzer einen Grund haben, sich auch den unteren Bereich der Seite anzusehen.

Wenn Websites jeder Grösse im oberen Bereich wenige Inhalte aufweisen, ist es für Nutzer schwierig, zu wissen, was sonst noch auf der Seite zur Verfügung steht. Die Website kann dadurch zwar attraktiv aussehen, es könnte aber sein, dass Nutzer nicht zum Scrollen motiviert werden. Solche Designs können auch "doppelte Böden" schaffen, die Nutzer glauben lassen, dass sie bereits die gesamte Seite und alle Inhalte gesehen haben.

Die Website von Mod Notebooks beginnt mit einem ganzseitigen Bild und einem Link zu einem Video. Der einzige visuelle Hinweis auf unten stehende Inhalte ist ein Pfeil, der versucht, den doppelten Boden zu durchbrechen. Designs sollten keinen Pfeil benötigen, um den Nutzer zum Scrollen zu bringen.

Sobald der Nutzer zu scrollen beginnt, motiviert die Mod Notebooks Website ihre Besucher allerdings sehr gut zu weiteren Erkundungen. Die Website bietet auf Links basierende Navigationsmöglichkeiten, damit Nutzer zu Themen wechseln können, die sie interessieren. Text und Bilder erstrecken sich auf Bildschirmen verschiedenster Grössen über den gesamten Bildschirm, was dem Nutzer mehr Informationen bietet. Der Inhalt ist gut organisiert und erzählt nach und nach die Geschichte des Produkts, was den Leser zum Scrollen motiviert.

Wenn Nutzer keine wertvollen Informationen sehen, hören sie auf zu scrollen. Bei Usability-Tests passiert es zwar gelegentlich, dass ein/e Nutzer/in einen Scroll zur "Einschätzung der Lage" durchführt und sich so einen Überblick über den Inhalt der Seite verschafft, bevor er/sie sich damit beschäftigt - das kann allerdings nicht als Standard-Verhalten bezeichnet werden. Nutzer scrollen, wenn es einen Anlass dafür gibt.

Der Falz wird immer wichtig sein, da das Scrollen eine zusätzliche Handlung ist, die Nutzer durchführen müssen, um auf Inhalte zuzugreifen. Genau wie das Warten bis eine Website lädt, das Durchblättern eines Karussells oder das Öffnen eines Akkordeon-Menüs, um Texte anzuzeigen, ist das Scrollen ein zusätzlicher Schritt, den Nutzer absolvieren müssen, um ihr Ziel zu erreichen.

Es gibt sicherlich Designs, die erfolgreich wenig Inhalt im oberen Bereich der Website platzieren und die Nutzer dennoch zum Scrollen animieren. Erfolgreiche Designs spornen zu zusätzlichem Aufwand an - sie enthalten einen Einblick in interessante Inhalte, eine fesselnde Einleitung und ansprechende Bilder. Designer, die ansprechende und erfolgreiche lange Websites schaffen, beachten den Falz. Sie wissen, wie man eine Seite erstellt, die Nutzer erkunden - und nicht verlassen - möchten. Sie geben jenen Inhalten die höchste Priorität, die Nutzer in den unteren Bereich der Website führen und die ihre zusätzliche Anstrengung belohnen.

Nachweis der Bedeutung der Falzlinie

Falls beim Designen der Nutzeroberfläche Probleme auftreten, tauchen meistens gegensätzliche Argumente auf, wonach das Nutzererlebnis-Team beurteilen muss, welches Argument stärker ist. In diesem Fall lässt die Theorie allerdings keinen Zweifel zu: die Interaktionskosten unterscheiden sich für Inhalte über bzw. unter dem Falz signifikant, weshalb die beiden Bereiche von Nutzern unterschiedlich behandelt werden.

Es ist dennoch schön, wenn empirische Daten eine Theorie untermauern. Und derartige Nachweise stehen, was den Falz betrifft, in grosser Zahl zur Verfügung. Wir konnten im Rahmen von qualitativen Usability-Studien unzählige Nutzer beobachten, deren Verhalten vom Falz beeinflusst wurde - häufig handelte es sich um eine Verschlechterung, da Websites Inhalten über dem Falz die falschen Prioritäten zuordneten. Nutzer hörten auf zu scrollen, bevor sie die benötigten Informationen fanden, oder - noch schlimmer - bemerkten nicht, dass unter dem Falz weitere Informationen zur Verfügung standen.

Es gibt auch quantitative Nachweise: in Rahmen einer Analyse von 57.453 Eyetracking-Fixationen ermittelten wir eine dramatische Reduktion der Aufmerksamkeit der Nutzer an der Falzlinie. Elemente über dem Falz wurden häufiger angesehen als Elemente unter dem Falz: genau gesagt wurden die 100 Pixel direkt über dem Falz 102% häufiger angesehen, als die 100 Pixel direkt unter dem Falz.

Die folgende Heatmap ist eine Zusammenfassung aller Websites unserer Studien (exklusive Suchmaschinen und Suchresultatseiten). Inhalte unter dem Falz werden zwar gelegentlich betrachtet - allerdings nicht annähernd so häufig wie Inhalte über dem Falz.

Eine aggregierte Heatmap zeigt 57.453 Eyetracking-Fixationen über eine grosse Auswahl von Websites hinweg (exklusive Suchmaschinen und Suchresultatseiten). Rote Stellen wurden von den Nutzern am häufigsten betrachtet, gelbe wurden am wenigsten beachtet. Weisse Bereiche wurden praktisch überhaupt nicht beachtet. Die oberste schwarze Linie ist die Falzlinie der Studie, darunter liegende schwarze Linien repräsentieren nachfolgende Bildschirme, die durch Scrollen erreicht werden.

Ein zweiter Datensatz stammt aus einer aktuellen Analyse von Display-Werbung (engl.), die von Google durchgeführt wurde und eine riesige Anzahl von Websites inkludierte. Die Studie betrachtete, wie „sichtbar“ eine Werbeanzeige ist, wobei Sichtbarkeit mit 50% der Pixel der Werbeanzeige, die eine Sekunde lang am Bildschirm angezeigt werden, definiert wurde. Werbeanzeigen direkt über dem Falz wiesen eine Sichtbarkeit von 73% auf, während Werbeanzeigen direkt unter dem Falz eine Sichtbarkeit von 44% erreichten. In der Google-Studie betrug der durch den Falz bedingte Abfall 66%: so viel häufiger wurden Werbeanzeigen direkt über dem Falz, im Vergleich zu jenen unter dem Falz, angezeigt.

Warum bezifferte Google den Einfluss der Falzlinie mit 66%, während unsere Studie 102% ergab? Die Erklärung liefern die zwei verschiedenen Metriken, die angewandt wurden. Google mass, ob eine Werbeanzeige auf dem Bildschirm angezeigt wurde und damit von Nutzern gesehen werden konnte, falls diese zufällig auf die jeweilige Stelle blickten. Wir massen, ob Menschen tatsächlich auf den Bildschirm schauten und wie lange sie die Inhalte betrachteten.

Die beiden quantitativen Studien liefern unterschiedliche Einschätzungen des Einflusses der Falzlinie auf das Nutzererlebnis. Doch beide Zahlen sind hoch: wir sprechen nicht von einem Unterschied von 5% oder 10% zwischen Informationen über bzw. unter dem Falz. Die Differenz liegt in der Grössenordnung von 66% bis 102%. Falls Sie eine einzelne Zahl bevorzugen, die unsere beste aktuelle Schätzung repräsentiert, nehmen wir den Mittelwert dieser Spanne: 84% ist der durchschnittliche Unterschied, wie Nutzer Informationen über bzw. unter dem Falz behandeln. Enorm. Haben Sie Vertrauen in den Falz. Er ist vorhanden und das Nutzererlebnis verändert sich an dieser Stelle drastisch.

Nutzer scrollen nicht, weil es ihnen Spass macht. Sie scrollen aus einem Grund. Wenn unsere Diskussion des Falzes daher die Konzentration auf die Inhalte der ersten Seite lenkt, sollten wir uns unbedingt weiter unterhalten.

© Deutsche Version. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.