Wie Ladezeiten ihren Schrecken in vier Schritten verlieren

Wartezeit als UX-Faktor – 4 Tipps gegen User-Frust
Kommentare

Kein Mensch wartet gerne – das gilt insbesondere im Internet. Gehörte das Warten in den 90ern noch zum guten Ton, ist spätestens seit der Einführung mobiler Endgeräte ein Ende der Leidenszeit absehbar. Denn die Performance spielt in Fragen einer guten User Experience eine immer entscheidendere Rolle – aber ist sie das Maß aller Dinge?

Bereits 2009 ergab eine Studie von Forrester Research, dass Kunden, die in einem Onlineshop einkaufen, erwarten, dass eine Seite innerhalb von zwei Sekunden geladen sein muss. Dauert ein kompletter Seitenaufbau mehr als drei Sekunden, verlässt der größte Teil der Nutzer die besuchte Seite wieder.

Lag die Marke bereits vor sieben Jahren bei zwei Sekunden, sollte man es heutzutage gänzlich vermeiden, seine Anwender warten zu lassen. Aber ist es sinnvoll, die Optimierung der Ladezeit vor alles andere zu stellen? Nicht immer ist dieser Schritt der richtige. Auch wenn eine gute Performance die User Experience eines Internetauftritts steigert, ist sie nicht das einzige Element, das die Erfahrung der Nutzer positiv beeinflussen kann.

Hinzu kommen meist noch weitere Bausteine wie etwa interaktive Grafiken, Videoclips oder hochauflösende Bilder. Wäre die Performance das ausschlaggebende A und O, dürfte es Hero-Headers oder HD-Background-Videos im Webdesign gar nicht geben. Und doch prägen diese beiden Konzepte mittlerweile das Bild vieler Webseiten und gelten als Trends für das Jahr 2016.

Neben der Performance gibt es also noch weitere wichtige Faktoren, die für eine gute User Experience verantwortlich sind. Aber was bedeutet das für den Umgang mit Wartezeiten im Netz? Die Frage ist relativ einfach zu beantworten: Ladezeiten sind nicht per se schlecht, solange sie für eine positive Erfahrung beim User sorgen. Aber ist so etwas überhaupt möglich? Gibt es Techniken, die dafür sorgen, dass sich die Anwender beim Laden einer Seite nicht langweilen?

Ausgehend von Anja Frosts Vorschlägen, stellen wir vier Methoden vor, mit denen man seinen Nutzern die Wartezeit versüßt und für einen positiven ersten Eindruck sorgt.

1. Feedback strategisch einsetzen

Egal ob man am Flughafen auf sein Gepäck wartet oder im Supermarkt an der Kasse steht: Ob die Bewertung des Wartens positiv oder negativ ausfällt, hängt nicht allein von der zeitlichen Dauer ab. Wie Untersuchungen ergaben, schätzen 36 Prozent der Leute, die in einer Schlange stehen, die Zeitspanne im Rückblick falsch ein.

So sind die an den Kassen angebotenen Süßigkeiten nicht ausschließlich für Kinder gedacht, sondern haben ebenfalls den Sinn, durch Ablenkung die Wartezeit der Kunden zu beeinflussen. Das Gleiche gilt auch für die Montur von Spiegeln vor Fahrstühlen. Wird den Menschen etwas gegeben, womit sie sich beschäftigen können, verkürzt sich die subjektive Zeitwahrnehmung, obwohl sich an ihrer Länge objektiv nichts geändert hat.

Ablenkung ist also ein probates Mittel, um den Anwendern das Warten erträglicher zu machen. Sollte man ihnen deshalb stets eine Fortschrittsanzeige präsentieren, wenn etwas geladen wird? Nicht immer ist das der sinnvollste Schritt. In der Regel ist es erfolgsversprechender, Feedback strategisch einzusetzen.

Bei Wartezeiten von 0.1 Sekunden ist keine gesonderte Resonanz erforderlich, da die Nutzer solche Verzögerungen gar nicht wahrnehmen. Sollte das Laden bis zu einer Sekunde in Anspruch nehmen, ist das auch nicht weiter schlimm. Der Verzug wird zwar wahrgenommen, schränkt den User Flow aber nicht sonderlich ein. Die Aufmerksamkeit der Anwender reißt hingegen bei Verläufen ab, die einen Wert von zehn Sekunden überschreiten.

Allerdings ist die Spanne zwischen einer und zehn Sekunden ziemlich groß. Wie weitere Studien zeigen, besitzen Fortschrittsanzeigen nicht ausschließlich einen positiven Effekt. Bei Ladevorgängen unter fünf Sekunden können sie die Aufmerksamkeit der Nutzer sogar negativ auf die noch zu verbleibende Wartezeit richten. Als Faustregel gilt: Ein Balken macht dann Sinn, wenn die Ladezeit mehr als fünf Sekunden beträgt.

2. Fließende Übergänge

An welche Warteschlange wir uns anstellen, hängt vorwiegend von ihrer Länge und weniger von ihrer Geschwindigkeit ab. Haben wir die Wahl zwischen einer kurzen Schlange, die sich langsam bewegt, oder einer langen Schlange, die sich schnell bewegt, optieren wir meistens zur ersten Variante – auch wenn die Wartezeiten identisch sind.

Das ist mitunter der Grund, warum viele Vergnügungsparks die wirkliche Länge ihrer Reihen durch Kurven oder Gebäude verstecken. In Bezug auf die Länge von Ladebalken kehrt sich dieser Effekt allerdings um. Kurze Fortschrittsanzeigen, die sich nur langsam bewegen, sind in der Regel längeren Anzeigen, die kontinuierlich voranschreiten, unterlegen.

Im Gegensatz zu Ladeanimationen, die den Vorgang in kurzen rapiden Sprüngen kommunizieren, vermitteln lange durchlaufende Balken den Usern das Gefühl, beständig Fortschritte zu machen. Sie sorgen so für eine positive Erfahrung, die durch den Einsatz optischer Mittel noch gesteigert werden kann. Anzeigen, die auf verschiedene Farben und Effekte setzen, suggerieren bei den Nutzern den Eindruck, elf Prozent schneller als einfarbige Leisten zu laden.

3. Elemente nacheinander laden

Ein Problem, das es in jeder Hinsicht zu umschiffen gilt, sind passive Wartezeiten. In der Regel sitzen die Nutzer hierbei vor dem Bildschirmen und haben nichts zu tun haben. Wie strategische Feedbacks und fließende Übergänge demonstrieren, führen Ladezeiten immer dann zu Frustmomenten, wenn die User nicht wissen, wie lange sie noch warten müssen.

Dieser Effekt kann durch die Kennzeichnung und Kommunikation der restlichen Dauer abgefedert werden. Wiederum sind Vergnügungsparks auf diesem Gebiet federführend. Denn im Gegensatz zur allgemeinen Meinung werden die in den Schlangen platzierten Zeittafeln nicht zu Informationszwecken aufgestellt.

Die Angaben werden bewusst zu hoch angesetzt, damit die Besucher annehmen, dass sie ihr Ziel früher als erwartet erreichen. Auf diese Weise kann auch ein zweitstündiges Warten mit einem erfreulichen Erlebnis beendet werden. Das ist insofern wichtig, da der finale Moment meistens ausschlaggebend dafür ist, ob der gesamte Warteprozess positiv oder negativ bewertet wird.

In leicht abgewandelter Form ist diese Methode ebenfalls in der Webentwicklung anzutreffen. Anstatt das sich alle Elemente gleichzeitig aufbauen, werden die unterschiedlichen Bausteine nacheinander geladen. Durch den sukzessiven Ladevorgang wird die passive Wartezeit der Nutzer deutlich reduziert, da die Aufmerksamkeit der Anwender nicht auf die noch fehlenden, sondern auf die bereits vorhandenen Teile gelenkt wird.

Auf diese Weise kann die Wartezeit nahezu halbiert werden, da nur der Zeitraum bis zur Darstellung bestimmter Features überbrückt werden muss. Dass diese Technik durchaus erfolgt hat, beweist ihr Einsatz bei Produkten großer Unternehmen. Google setzt die Methode bei seiner E-Mail-App Inbox ein und auch Facebook greift auf sie im Zuge des Hochladens von Dateien zurück.

4. Visuelle Anreize schaffen

Die Platzierung von visuellen Süßigkeiten oder Eye Candy ist ebenfalls bei digitalen Produkten in abgewandelter Form möglich. Durch die Schaffung visueller Anreize kann die Aufmerksamkeit der User erfolgreich auf andere Dinge gelenkt und ihr subjektives Zeitempfinden beeinflusst werden. Je anziehender eine Loading-Page gestaltet ist, desto mehr können sich die Besucher in ihr verlieren.

Deshalb spielen originelle Gestaltungen eine entscheidende Rolle bei Ladeseiten. Es ist zwar wichtig, die wesentlichen Best Practices zu kennen, man sollte sich allerdings nicht allein auf sie verlassen. Das bloße Regelbefolgen kann nämlich schnell dazu führen, dass die eigene Ladesequenz sich nicht mehr wesentlich von anderen Auftritten unterscheidet und dadurch ihren positiven Effekt wieder einbüßt.

tiger-wwf

Aussagekräftige Ladesequenzen, Quelle: run4tiger.com

Dieses Problem kann umgangen werden, indem die Ladeanimation stark mit der eigenen Marke oder mit dem eigenen Produkt verbunden wird. Ein gutes Beispiel hierfür ist der Internetauftritt der Tiger Challenge des WWF. Die Loading-Page ziert ein Tigerkopf, der je weiter der Ladevorgang voranschreitet, mehr und mehr sichtbar wird.

Eine weitere Möglichkeit, um sich von anderen Auftritten abzusetzen, besteht darin, die Elemente der Ladesequenz zum integralen Bestandteil des restlichen Produkts zu machen. Durch die Kombination der ansonsten voneinander getrennten Bausteine wird das Interesse der User so auf die nachfolgenden Inhalte gelenkt.

hexagon-menu

Hexagon-Menü, Quelle: natgeoeat.com

Besonders schön umgesetzt wird diese Technik auf der Themenwebseite „Eat: The Story of Food“ des National Geographic Channels. Das eher unscheinbare Hexagon entpuppt sich am Ende des Ladevorgangs als innovatives Menü.

Fazit

Ladezeiten sind also nicht per se schlecht für eine gute User Experience. Richtig umgesetzt können sie sogar dazu beitragen, die Aufmerksamkeit und das Interesse der User auf sich zu ziehen, während weitere Elemente, die gleichsam die UX unterstützen können, geladen werden. Aus Furcht vor höheren Bounce-Raten sollte also nicht auf Loading-Pages verzichtet werden.

HTML5 Days

CSS Grid – das neue Layoutmodul im Einsatz

mit Dr. Florence Maurice (maurice-web.de)

 

Aufmacherbild: Project production time line concept via Shutterstock / Urheberrecht: maxicam

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -