Wie können E-Commerce-Verantwortliche die Conversion ihres Onlineshops mittels Responsive Webdesign steigern? Händlern, die über einen Relaunch ihres mobilen Shops nachdenken, geht es nicht nur um Schönheit. Schließlich soll sich auch der mobile Warenkorb schneller füllen. Als Lösung der Wahl gilt dafür zunehmend Responsive Design. Das ist ein bisschen aufwändig. Ein Selbstläufer ist es obendrein nicht. Sebastian Wernhöfer, CEO der in München und Stuttgart ansässigen E-Commerce Agentur mzentrale, erklärt deshalb, wie man durch den Einsatz von Responsive Webdesign einen Shop für mobile Endgeräte optimieren kann.
1. Nur relevante Inhalte zeigen!
Gerade auf kleinen Screens lässt sich nicht immer alles übersichtlich darstellen. Darum sollte man dem Grundsatz “Mobile First” zwingend folgen. Darunter versteht man, dass man beim kleinsten Screen beginnt und dort alle wirklich notwendigen Elemente platziert, die für den Kauf erforderlich sind. Denn unterwegs gilt: Weniger ist mehr! So sind großflächige Aktionsbanner auf dem kleinen Screen eher störend, fordern lange Ladezeiten und können meist sowieso nicht richtig gelesen werden. Stichwort: User Experience!
2. Gewohnte Pfade nicht verlassen!
In allen Screen-Größen sollten wichtige Elemente trotzdem an ihrem gewohnten Platz zu finden sein. So sollte zum Beispiel der Warenkorb immer “rechts oben” platziert sein und die Suche “oben mittig/rechts”. Somit ist gewährleistet, dass Plattformwechsler immer ihr gewohntes Shopping-Erlebnis bekommen und keinerlei Umstellung den Einkauf behindert. Stichwort: Usability.
3. Symbole und Bildsprache nicht ändern!
Auch wenn es manchmal schwer fällt, sich von verspieltem Design zu trennen, sollte in der Konzeption von Anfang an darauf geachtet werden, dass alle wichtigen Elemente auch auf kleinen Screens funktionieren. Vor allem Buttons und Links sollten sich in allen Plattformen gleich darstellen. Hier gilt der gleiche Effekt wie bei der Platzierung – Homogenität schafft Vertrauen und vereinfacht den Plattformwechsel. Trotzdem macht es natürlich Sinn, kleinere Anpassungen in Betracht zu ziehen. So kann es sich z.B. lohnen, kontrastarme Elemente für Mobile leicht anzupassen, damit diese auch bei Nutzung im Tageslicht gut lesbar sind. Hier gilt es, die richtige Balance zu finden.
Auch mobil passgenau: Ludwig Beck
4. Bedienungselemente anpassen!
Was bei den Elementen und dem Design gilt, kann leider nicht auf die Bedienung übertragen werden. Hier muss sich zwangsweise etwas ändern, denn so gibt es bei Touch-Devices zum Beispiel keinen echten Mouse-Over-Zustand. Dieser wird durch einen Tab simuliert, was eher störend ist. Ein Klassiker im Online-Shop ist beispielsweise die Alternativ-Produktansicht in der Kategorie bei Mouse-Over. Damit müsste man auf einem Touch-Device zweimal tappen, um in die Produktdetails zu gelangen, da beim ersten Tap nur das Bild wechselt. Hier gilt es, sich innovative Lösungen zu überlegen, oder lieber auf die Funktion zu verzichten! Auch sollten die gewohnten Gesten genutzt werden, zum Beispiel Pinch für den Bilder-Zoom in der Artikeldetail-Ansicht.
5. Alle Informationen nutzen!
Als Beispiel stelle man sich ein Geschäft für Bekleidung vor. Am Standort “Innenstadt” wird sich das Sortiment möglichst breit halten und an die jeweilige Jahreszeit anpassen. Am Standort “Flughafen” hingegen finden sich eher klassische Business-Outfits, möglichst für jedes Wetter. Solche Vorteile können mit Location Based Services und mobilen Geräten ebenfalls Online genutzt werden – allerdings nur mit vorheriger Einverständniserklärung des Users! Hierbei ist auch eine sehr gute Caching-Strategie wichtig, da viele individuelle Inhalte ausgespielt werden müssen. Natürlich lassen sich auch andere wertvolle Informationen auswerten, z.B. welches Gerät der Kunde gerade nutzt, um auf den Shop zuzugreifen. Somit lassen sich einem Apple-User gezielt Zubehörempfehlungen für sein Gerät präsentieren, oder speziell darauf angepasste Angebote.
mzentrale
Sebastian Wernhöfer ist CEO der in München und Stuttgart ansässigen E-Commerce Agentur mzentrale, Zu den Kunden zählen u.a. mytheresa.com, Bogner, Ludwig Beck, Mirabeau Versand, Schmidt Spiele und das Versandhaus Walz. Die vor 13 Jahren gegründete E-Commerce Agentur mzentrale hat sich auf die Entwicklung digitaler Kanäle und Onlineshop-Lösungen für Fashion, Lifestyle und Beauty spezialisiert.
