Mobile First - Was Sie beachten sollten!

Die Mehrheit der Schweizer Internet-User nutzt heute mehrere Endgeräte während ihrer Customer Journey. Eine responsive Website, die sich an diverse Endgeräte anpasst, ist heutzutage somit ein Muss! Die bekannten Zahlen zeigen, dass Online-Einkäufe mit mobilen Endgeräten in den letzten Jahren stetig steigen. Das macht den Mobile-First-Ansatz unabdingbar. Dieser Ansatz sieht vor, dass die mobile Ansicht zuerst entsteht. Denn ist die mobile Version nicht optimal, ist der Nutzer mit einem Touch weg vom Fenster. Wir zeigen auf, was bei der Konzeption beachtet werden muss.

Wie funktionieren mobile Nutzer?

Ist die Website nicht an die mobile Version angepasst, sind Texte und Bilder nicht optimal sichtbar, wodurch zusätzliches Scrollen und Zoomen erforderlich wird. Somit ist der Erfolg der Mobilen Ansicht nicht garantiert. Wenn die mobile Ansicht nicht optimiert ist, bleibt es bei einem kurzen Scrollen, gefolgt vom Absprung des Nutzers. Das heisst: Texte und Bilder müssen ganzheitlich ersichtlich (seitliches Scrollen vermeiden) und entsprechend gross (Zoomen vermeiden) sein. Vor allem bei Illustrationen empfehlen wir, ein Bild mehr einzusetzen z. B. eine Nahaufnahme, statt sich auf das Zoomen des mobilen Nutzers zu verlassen.

No klicky, only touchy

Der mobile Nutzer bedient sein Gerät mehrheitlich nur mit einer Hand. Beim Smartphone ersetzt der Daumen die Maus. Die Bildschirme der Smartphones werden zwar immer grösser, doch der Daumen bleibt gleich. Daher ist es auch relevant, wichtige Elemente wie den Kaufbutton optimal zu positionieren.

Eine einfache, nicht optimierte Kopie der Desktop-Ansicht würde zu einem unendlichen Scrollen führen. Daher ist es bei mobilen Ansichten essentiell, Elemente ein- und ausblenden zu können. Vor allem auf Elemente wie, Navigationsleiste, Warenkorb und Wunschliste ist besonders zu achten. Denn diese beinhalten die wichtigsten Elemente. Sie führen zum gewünschten Produkt sowie hoffentlich zum gewünschten Kaufabschluss. Hier empfehlen wir Flyout der Navigationsleiste sowie Ein- und Ausblendefunktionen für gewisse Inhalte.

Kaufprozesse optimieren

Auch Pop-ups sind bei Mobile-Ansichten besonders zu beachten. Nimmt ein Pop-up einen kleinen Teil der Desktop-Version ein, so versperrt es bei der Mobile-Version im schlechtesten Falle die komplette Ansicht. Dies kann sich negativ auf das Nutzerverhalten auswirken. Wir empfehlen, Pop-ups wegzulassen oder so zu implementieren, dass sie den Kaufprozess nicht beeinträchtigen.

Modulare Gestaltung

Beim Mobile-First-Ansatz empfehlen wir, mit kleinen Inhaltsblöcken zu arbeiten. So kann die Website modular gestaltet werden und die einzelnen Inhaltsblöcke können bei der entsprechenden Ansicht nach Belieben positioniert werden. Diese Inhaltsblöcke sind nicht nur für das Design von Vorteil, denn sie lassen sich auch eigenständig aktualisieren. So können Sie jegliche Anpassungen einzelner Informationspakete leichter und schneller vornehmen.

Ein Mobile-First Praxisbeispiel finden Sie hier: Mobile First mit Voegele Shoes