niceUX

Pop-Ups unterbrechen den Userflow

Florian Lackner

Florian Lackner

02.05.2022 3 Minuten Lesezeit

Zusammenfassung

Die meisten Pop-Ups erscheinen zur falschen Zeit, unterbrechen die User bei wichtigen Tasks, legen sich über kritische Elemente, enthalten zu viel Text in komplizierter Sprache und tragen allgemein zur Desorientierung bei – schreibt die Nielsen Norman Group. Auch bei uns sorgen Pop-Ups für große Probleme.

Warum auf Pop-Ups in den meisten Fällen verzichtet werden sollte und welche Alternativen es gibt, kann im Artikel der Nielsen Norman Group von Anna Kaley nachgelesen werden. In solchen Artikeln könnten die beschriebenen Probleme abstrakt und wenig greifbar scheinen.

Das Tool Hotjar bietet uns allerdings die Möglichkeit, die Interaktionen unserer User mit unseren Shops anonymisiert zu beobachten. Speziell im 9Weine-Shop wird stark auf Pop-Ups und Überlagerungen aller Art gesetzt. Warum diese problematisch sind, kann anhand der folgendes Videos beobachtet und beschrieben werden.

Pop, pop, it never stops. Not an acceptable user experience, so do stop the pops.

Pop-Ups blockieren und unterbrechen Eingaben

Beginnen wir auf der Startseite. Die erste Aktion vieler wiederkehrender User ist, direkt mit einer Suche zu starten. Schlecht ist, wenn gerade diese dann von einem plötzlich erscheinend Overlay blockiert wird.

Doch selbst wenn die Suche durch die abgedunkelte Überlagerung sichtbar bleibt – die Interaktion damit ist blockiert und die Verwirrung des Users offensichtlich sehr groß. Die Suchanfrage wurde dadurch zu früh abgeschickt was zu keinen Suchergebnissen geführt hat.

Noch fataler wird es, wenn kritische Tasks wie das Einloggen unterbrochen werden. Dass der User im nächsten Video eine so geringe Bildschirm- bzw. Fensterhöhe hat, tut sein Übriges und sorgt dafür, dass der Schließen-Button des Pop-Ups nicht mehr sichtbar ist. Er schafft es, das Pop-Up zu schließen, indem er erneut ins Eingabefeld klickt.

Zu viel Text und keine Anpassung für kleine Bildschirme

Auch im nächsten Video wird eine Eingabe blockiert und unterbrochen, den Fokus möchte ich dabei aber eher auf die Menge an Text im Pop-Up legen. Erschwerend kommt hinzu, dass es komplett falsch platziert wird. Die Überschrift scheint zuerst »Euro« zu sein, obwohl es sich dabei um das Ende eines Satzes handelt. Nachdem der User das Pop-Up schließt, kann er seinen Task fortsetzen.

Im eben gezeigten Video war immerhin der »Nein Danke!«-Button zu sehen. In diesem Video sind bei der initialen Platzierung weder dieser Button noch das × am rechten oberen Eck zu sehen. Deutlich erkennbar am Scrollverhalten ist, dass der User Probleme dabei hat, das Pop-Up zu schließen.

Ganz schlimm hat es den nächsten User erwischt, der innerhalb von wenigen Sekunden mit zwei Pop-Ups zu kämpfen hat, die beide falsch platziert wurden. Vermutlich auch hier wieder deshalb, weil viel zu viel Text enthalten ist.

Pop-Ups überlagern kritische Interaktionselemente

Während der nächste User das Scrollen stoppt, um die Rabatt-Kategorien zu betrachten, werden genau diese im nächsten Moment überlagert.

Auch am Desktop kommt es mit dem pinken Overlay zu Problemen. So liegt es – ganz nach oben gescrollt – über dem halben Header. Unerfahrenen Usern könnte dadurch beispielsweise der Zugang zum Warenkorb blockiert werden. Der Zugang zur Hilfe rechts oben wird sogar komplett blockiert.

Das letzte Beispiel ist möglicherweise das fatalste: Die am Smartphone im Warenkorb am oberen Bildschirmrand fixierten Buttons werden durch das ebenfalls fixierte Overlay verdeckt. Ohne dieses zu schließen hat man keine Möglichkeit, zur Kasse zu gelangen.

Resist the urge to follow the crowd and don’t inundate your users with interruptions to bolster short-term metrics.

Abschließend sei noch gesagt, dass wir es hier mit sehenden Usern zu tun haben, die massive Probleme mit den Pop-Ups haben. Kommen sehbehinderte Menschen ins Spiel, werden die Herausforderungen für diese nochmals deutlich verstärkt. Möglicherweise sogar gar nicht überwindbar. So do stop the pops.

Weiterführende Informationen

Florian Lackner

Florian ist User-Experience-Designer mit Fokus auf Research und beschäftigt sich am liebsten mit Benchmarks, Usability-Tests und spannenden Studien aller Art – vor allem, wenn es um Psychologie geht. Außerhalb der Arbeit findet man ihn häufig in der Küche beim Erkunden neuer Rezepte.