7 Tipps für eine bessere Mobile Experience

Der Trend fing schon vor vielen Jahren an, heute ist es relativ normal, dass Services im Internet mobile first designt werden. Statt also wie früher eine Website für den Desktop zu optimieren, spielt diese nur noch die zweite Geige. Je nach Zielgruppe ist der Desktop als Plattform sogar nahezu gleichgültig geworden, weil die eigenen Besucher*innen nur noch via Smartphone auf die Website zugreifen.

Das hat zur Folge, dass sich die Ansichten und Herangehensweisen ebenso verändert haben. Alles muss nun auch auf dem kleinen Smartphone Display funktionieren. Ob Android oder iOS darf keine Rolle spielen, ob Chrome oder Safari ebenso wenig und sämtliche Mechanismen sind auf Touch hin optimiert, sodass selbst Hover-Effekte kaum noch einen Mehrwert mit sich bringen.

Wir haben sieben glorreiche Tipps und Tricks für euch zusammengetragen, die dabei helfen können, die Mobile Experience entscheidend zu verbessern.

Wenn es um Websites auf dem Smartphone geht, dreht sich alles um eine möglichst gute Performance. Mobile first legt daher auch viel Wert auf eine geringe Datenübertragung. Denn gerade in Deutschland ist das mobile Internet teuer und wird noch dazu viel zu schnell gedrosselt. Außerdem müssen Ladezeiten optimiert werden, um Nutzer am Smartphone zufriedenzustellen. Die greifen oft von unterwegs auf eure Website zu, haben also weder viel Zeit, noch die Nerven, lange auf die Darstellung zu warten. Nutzererfahrung am Smartphone geht daher immer mit einer perfekten Performance einher. Wer da nicht mithalten kann, wird schnell ignoriert.

Das andere Thema ist die Sache mit dem holistischen Content. Der ist nach wie vor beliebt und wichtig, um bei Google gut zu ranken, verprellt in der echten Welt aber die eigentlichen Nutzer*innen eurer Website. Warum? Weil er unübersichtlich ist und an einem eher kleinen Smartphone nicht einfach wie ein Buch gelesen werden kann. Daher haben sich Inhaltsverzeichnisse etabliert, die dieses Problem lösen. Direkt über dem eigentlichen Inhalt finden die Nutzer*innen dann Sprungmarken und können direkt zu dem Absatz springen, der sie besonders interessiert. Das wiederum sorgt für eine positive Nutzererfahrung und erfüllt noch dazu die Suchintention auf bestmögliche Art und Weise.

Menüs sind am Smartphone ebenfalls ein großes Thema. Egal wie ihr selbige umsetzt, achtet darauf, klare Strukturen zu schaffen. Menüs, die am Desktop wunderbar erscheinen, funktionieren auf mobilen Plattformen in der Regel nicht sonderlich gut. Also heißt es umdenken, um etwas zu entwickeln, was zu euch und eurer Website passt und keine Allgemeinlösung ist. Nutzererfahrung ist immer eine Reise, die vom Menü aus bestmöglich gesteuert werden kann. Vergesst diesen Aspekt daher nicht.

Am Smartphone wird nicht geklickt, da wird gedrückt. Das ist ein Problem, wenn ihr auf eurer Website kleine Links und Schaltflächen verwendet. Achtet unbedingt darauf, entweder alles für mobile Plattformen zu optimieren oder Buttons etc. auf dem Smartphone entsprechend zu vergrößern. Nichts ist nerviger als winzige Links und Buttons, die am Handy fünfmal gedrückt werden müssen, bevor die korrekte Stelle getroffen wird. Das ist einfach nicht mehr zeitgemäß.

Haltet euch kurz, wenn es um Formulare, Menüs, Links oder auch Texte geht. Bei umfangreichem Content hilft das erwähnte Inhaltsverzeichnis. Lange Anmelde-Dialoge oder Formulare möchte am Smartphone eigentlich niemand bewältigen. Fragt solche Daten später ab und erlaubt es euren Nutzer*innen, sich direkt mit möglichst wenigen Feldern anzumelden oder zu registrieren. Kurz und knackig muss es am Smartphone sein, um zu funktionieren, sonst sind die meisten Nutzer*innen schon wieder abgesprungen.

Eine Sache, die häufig unterschätzt wird, ist, dass Farben auf dem Smartphone Display oft vollkommen anders wahrgenommen werden. Das liegt zum einen daran, dass in Notebooks in der Regel noch keine hochwertigen OLEDs verbaut sind, zum anderen an den jeweiligen Displays und der Kalibrierung. Testet eure Farbwahl also immer gesondert am Smartphone und denkt daran, dass selbst unter Sonneneinstrahlung gute Kontraste sichtbar sein sollten. Sind die nämlich nicht gegeben, verschwinden bestimmte Elemente einfach. Die Farben sehen auf dem Smartphone, in der Sonne oder bei Nacht, oft anders aus als am Desktop oder Notebook. Berücksichtigt auch das Thema Farbblindheit und die damit verbundene Barrierefreiheit.

Für eine gelungene Mobile Experience ist es zudem wichtig, die Schriftart mit all ihren Eigenheiten zu perfektionieren. Egal ob es um Abstände oder Größen geht, probiert alles durch und versucht etwas zu finden, was auf vielen Smartphones gut lesbar ist. Wird der Text auf mobilen Plattformen zu dicht dargestellt, gibt es einen sogenannten Wall-of-Text Effekt, der blockierend wirkt. Ist er zu weit auseinander, verrutschen viele Nutzer*innen beim Lesen oder verlieren den Fokus. Vergesst nicht, wie wichtig die richtige Schriftart dabei ist und nehmt euch entsprechend viel Zeit, wenn es um die Auswahl geht.

Als der Trend in Richtung mobile first ging, waren viele geschockt. Heute nutzen wir alle viel öfter unser Smartphone als das Notebook. Wir surfen abends auf der Couch damit, wenn wir nach etwas suchen oder wir uns über etwas informieren möchten. Ebenso gewöhnlich ist es, dass Websites mobile first sind, also in erster Linie am Smartphone funktionieren sollen. Weil dort heutzutage eben deutlich mehr Nutzer*innen zu finden sind als an den klassischen Geräten.

Mobile Experience ist ein großes Thema, was aber immer noch viel zu sehr vernachlässigt wird. Dabei hat sie uns auf die wichtigen Dinge im Web aufmerksam gemacht. Was zählt wirklich? Schnelle Ladezeiten, klare Strukturen und gute Navigation. Genau die Dinge, die immer vernachlässigt wurden, weil sie am Desktop oft nicht so wichtig erschienen. Jetzt, wo die meisten Nutzer*innen ihr Smartphone verwenden, bekommen diese Bereiche wieder eine erhöhte Aufmerksamkeit. Zum Glück!

Wir finden den Trend super, denn dank des Fokus auf die Mobile Experience, sind Website schneller und übersichtlicher als jemals zuvor. Viel Erfolg also beim Optimieren und bis zum nächsten Artikel.