Mobile Online-Shops: 7 Quick Wins, um Ihre mobile Conversion zu steigern [Gastartikel]

Veröffentlicht: 26.07.2017 | Geschrieben von: Gastautor | Letzte Aktualisierung: 26.07.2017

War der Anteil an mobilen Nutzern vor einigen Jahren noch gering, nutzen heute immer mehr Kunden ihr Smartphone, um sich von unterwegs über Produkte zu informieren oder Preisvergleiche anzustellen. Von dort ist es dann nicht mehr weit, die Produkte auch direkt zu kaufen. Viele Online-Shops haben mittlerweile darauf reagiert und bieten zusätzlich eine mobile Seite an. Doch die Ernüchterung ist groß und die Conversion gering. Nur knapp ein Drittel der Verkäufe, die über den Desktop getätigt werden, werden auch im mobilen Bereich abgeschlossen und das obwohl mittlerweile fast die Hälfte der Besucher über mobile Geräte kommen. Warum ist das so? Und was macht einen guten mobilen Online-Shop aus?

Smartphone in den Händen einer Frau
© maoyunping – shutterstock.com

Hier stellen wir Ihnen 7 Quick Wins vor, die einfache Besucher zu tatsächlichen Käufern machen. 

  1.    Achten Sie auf geringe Ladezeiten

Das Thema Ladezeiten-Optimierung ist nicht neu und bereits ein wichtiges Kriterium bei der Optimierung Ihres Online-Shops? Super, denn im mobilen Bereich wird das nochmal unweit wichtiger. Häufig besuchen Nutzer Ihren Online-Shop von unterwegs, wenn sie auf den Bus warten oder im Wartezimmer beim Arzt sitzen. Solange 4G für das mobile Internet noch nicht flächendeckend verfügbar ist, entscheidet dann auch die Ladezeit zwischen Abbruch und Weiterstöbern in Ihrem Shop. Ladezeiten-Optimierung gilt daher nochmal ein besonderes Augenmerk. Hier gelten grundsätzlich die gleichen Empfehlungen wie für Desktop-Websites.

Dazu gehören:

  • Alle CSS- und JavaScript-Dateien gehören zusammengefasst und sollten minimiert werden.
  • Schattierungen und Farbverläufe sind mit CSS statt als Grafiken umzusetzen.
  • Lazy Load ist, wenn möglich, einzusetzen (d. h. Dateien erst laden, wenn sie sich im sichtbaren Bereich befinden).
  • Alle kleinen Grafiken sind in einer Datei gespeichert und über CSS-Angaben ausgesteuert. Dadurch muss lediglich einmal initial eine größere Datei geladen werden, die sich im Verlauf dann im Cache des Benutzers speichert, als jedes Mal erneute eine kleine Grafik laden zu müssen.

Sind die Basics erfüllt, dann bietet die Optimierung von Grafiken großes Potenzial für mobile Shops. Grundsätzlich sollten alle Bilder, Teaser, usw. mobile-optimiert sein. Einer der größten Hebel sind dabei Farbtiefe und Auflösung. Mit Bildbearbeitungsprogrammen lassen sich Grafiken als „für Web und mobile Geräte optimiert“ abspeichern. Zudem gibt es Online-Tools wie tinypng.com, die ohne Qualitätsverlust die Dateigröße nochmals reduzieren.

Damit Ihre Ausgangsdatei schon die kleinstmögliche Größe hat, sollten für die mobile Version immer eigene Bildformate angeboten werden, anstatt die Grafiken der Desktop-Version zu laden und diese dann runter zu skalieren.

Ganz besonders wichtig: Beschränken Sie sich zudem immer auf die wesentlichen Inhalte und überladen Sie Ihre Seite nicht mit unnötigen Informationen oder gar Werbung. Einfach die Inhalte der Desktopversion anders anzuordnen und runter zu skalieren, reicht hier nicht!

  1.    Sorgen Sie für ein übersichtliches Menü

Wer Ihren Shop über sein Smartphone betritt, will möglichst schnell und mit wenigen Klicks zu Ihren Produkten geführt werden. Wichtiger noch, als das Menü über ein Icon im Header deutlich kenntlich zu machen, ist, was nach dem Klick auf die drei Querstreifen im Header passiert. Denn hier wird es in den meisten Online-Shops richtig unübersichtlich. Erste, zweite und dritte Hierarchieebene werden in langen Linklisten untereinander angezeigt, sodass der Besucher ewig braucht, um diese zu verstehen und seine entsprechende Rubrik zu finden. Inspirieren lässt sich davon niemand.

Damit das nicht geschieht, sollten Aufwand und Zeit in die Darstellung und Umsetzung des Menüs gesteckt werden. Welche Menü-Punkte muss der Nutzer zwingend sehen, auf welche kann in der mobilen Version ggbfs. verzichtet werden? Mithilfe der Webanalytics lassen sich hier schnell Probleme und störende Elemente identifizieren. Werden Links im mobilen Bereich gar nicht geklickt? Dann weg damit und für eine bessere Übersicht sorgen.

Falls alle Elemente bleiben müssen, überlegen Sie, wie diese besser gegliedert werden können. Bietet sich eine Gruppierung der Elemente an? Kann mit Einrückungen und/oder Hervorhebungen gearbeitet werden? Helfen Trennlinien bspw. Sortiment und Service-Links zu trennen?

  1.    Stecken Sie Aufwand in die Optimierung Ihrer internen Suche

Auch wenn das Menü übersichtlich strukturiert ist, gibt es immer noch Besucher, die ganz genau wissen, was sie in Ihrem Shop wollen und nutzen die Suche, um ein bestimmtes Produkt aufzurufen. Hier ist es wichtig, dass die Auto-Suggest-Funktion bereits nach wenigen Buchstaben anspringt und auch Fehlschreibweisen berücksichtigt. Gerade die Eingabe des Suchbegriffs auf mobilen Endgeräten ist fehleranfällig. Wenn Sie hier kein professionelles Tool einkaufen wollen, dann schauen Sie regelmäßig in Ihrem No-Results-Report im Webanalytics und tragen Sie Fehlschreibweisen als Synonyme nach. Der Aufwand dafür ist gering, der Nutzen umso höher.

  1.    Arbeiten Sie mit sticky Headern

Eine einfache aber effiziente Möglichkeit für mehr Conversions? Arbeiten Sie mit sticky Headern, also Headern, die auch nach der ersten Scrollbewegung des Nutzers nicht aus dem sichtbaren Bereich verschwindet. Denn, wie sonst sollen Ihre Benutzer den Zugang zu Ihrem Sortiment wiederfinden oder sehen, dass sie bereits Artikel im Warenkorb haben? Wer da erst mehrere Scrollbewegungen nach oben braucht, um den Header wieder aufrufen zu können, verliert wichtige Zeit, für den eigentlichen Kaufabschluss.

Momentan nutzen lediglich etwa 50 % der mobilen Online-Shops diese Funktion. Ob es an den häufig überfüllten und viel zu viel Platz einnehmenden Headern liegt? Voraussetzung hierfür ist auf jeden Fall, dass der Header nicht zu hoch und mit überflüssigen Elementen überladen ist. Er sollte möglichst nur einzeilig sein. Aber auch für zweizeilige Header, die häufig bei Shops mit umfangreichem Sortiment und somit prominenterer Darstellung der Suche im Einsatz sind, gibt es eine Lösung: Blenden Sie den Header bei der Scrollbewegung des Users nach unten hin aus und sowie der Nutzer wieder nach oben scrollt, direkt wieder ein.

  1.    Individualisieren Sie den Einstieg für Besucher, die Sie bereits kennen

Wenn Sie den Nutzer bereits kennen, weil er ein wiederkehrender Besucher oder eingeloggt ist, individualisieren Sie seine Einstiegsseiten. Die Wahrscheinlichkeit, dass es sich bei dem wiederkehrenden Besucher tatsächlich um die gleiche Person handelt, ist im mobilen Bereich deutlich höher als im Desktop, wo es sich ggfs. um eine andere Person handelt, die nur den gleichen PC/Laptop nutzt. Aber wer gibt sein Smartphone schon gerne aus der Hand? Nutzen Sie das, um Ihren mobilen Online-Shop auf Ihre Besucher zu personalisieren. Zeigen Sie ihm zuletzt angesehene Produkte an oder spielen Sie ihm einen Hinweis aus, dass er beim letzten Besuch zwar Artikel in den Warenkorb gelegt, aber den Checkout-Prozess nicht abgeschlossen hat.

Ist Ihr Sortiment in sich klar abgrenzende Zielgruppen (Damen, Herren und/oder Kinder) zu unterscheiden und von der Startseite wählbar, dann merken Sie sich den vom Nutzer gewählten Einstieg und „überspringen“ Sie diese Hierarchieebene beim nächsten Besuch (Wichtig: Bieten Sie Ihren Besuchern aber dennoch die Möglichkeit, zu Punkt 0 zurückzukehren).

  1.    Loggen Sie Ihre Besucher nicht aus und merken Sie sich Warenkörbe

Ein weiterer Vorteil, der sich aus der Tatsache ergibt, dass kaum jemand sein Handy aus der Hand gibt: Sie brauchen Ihre Besucher aus Sicherheitsgründen nicht mehr ausloggen.

Internetsitzungen mit dem Smartphone sind oft nicht kontinuierlich. Der Internetnutzer fährt vielleicht zum Arzt, surft in der Bahn, unterbricht, surft wieder im Wartezimmer und nach dem Arztbesuch wiederum in der Bahn nach Hause. Eine einzelne Internet-Session ist unterwegs daher häufig kürzer als daheim am PC. Für potenzielle Kunden ärgerlich, wenn sie nach der Unterbrechung wieder von vorne anfangen, den Shop zu durchsuchen. Noch ärgerlicher, wenn die Unterbrechung den bereits mit Produkten gefüllten Warenkorb leert.

All das würde den potenziellen Käufer zu Aktionen zwingen, die er eigentlich bereits hinter sich gebracht hat. Viele haben darauf wenig Lust. Deshalb sollte man die Laufzeit einer Session so lange wie möglich einstellen, den Inhalt des Warenkorbs nicht bei einer Unterbrechung des Besuchs leeren und Besucher in solch einem Fall auch nicht aus dem Kundenkonto ausloggen. Der potenzielle Kunde soll nach der Unterbrechung möglichst genau da weitermachen können, wo er zuvor aufgehört hat.

  1.    Ermöglichen Sie den reibungslosen Wechsel zwischen Smartphone und PC

Und jetzt folgt die Ernüchterung: Auch wenn Sie all die oben genannten Punkte umsetzen, kann es immer noch sein, dass sich Ihre Besucher wohler fühlen, wenn sie den Kauf am heimischen Desktop abschließen können. Schließlich sieht man da einfach deutlich mehr und übersieht nicht das Kleingedruckte. 

Als Shopbetreiber sollten Sie diesen Kunden den geräteübergreifenden Kauf aber dennoch so einfach wie möglich machen. Letztlich spült es da dennoch Geld in Ihre Kasse und der Kunde hat Sie als Online-Shop mit einer besonders positiven Nutzererfahrung abgespeichert und kommt gerne zurück. Sorgen Sie daher im mobilen Shop dafür, dass sich Merklisten so speichern lassen, dass sie sowohl in der Mobile- wie in der Desktopversion des Online-Shops aufrufbar sind.

Und auch der gefüllte Warenkorb sollte in den verschiedenen Varianten des Online-Shops erreichbar sein. Wenn sich Ihre Besucher dann davon überzeugen konnten, dass Ihre mobile Version genauso gut funktioniert, wie Ihre Desktop-Version werden sie automatisch beim nächsten Mal direkt für eine höhere mobile Conversion sorgen und ihren Kauf direkt dort abschließen.

 


 

Conversion-Experte Jörg Dennis Krüger
Jörg Dennis Krüger

Jörg Dennis Krüger ist einer der Pioniere der Conversion-Optimierung in Deutschland und Autor des Bestseller-Buches „Conversion Boosting mit Website Testing“. Bevor er das Unternehmen ConversionBoosting gründete, war er u.a. Leiter der Abteilung "Conversion Optimierung" beim Performance-Marketing-Netzwerk QUISMA, Abteilungsleiter Websites beim Autovermieter Sixt und Abteilungsleiter Performance-Marketing beim Freizeitmarktplatz Regiondo.

Das Conversion-Tool "Analyze" von der Firma ConversionBoosting liefert konkrete Vorschläge für mehr Conversions auf Online-Shops und Landingpages. Über diesen Link können Sie eine kostenlose Test-Analyse anfordern. Bei der Test-Analyse zeigt Ihnen das Tool den Optimierungsansatz mit dem größten Potenzial für mehr Conversions.

Schreiben Sie einen Kommentar

Newsletter
Abonnieren
Bleibe stets informiert mit unserem Newsletter.