INTERNET WORLD Logo Abo
Sonstiges 24.05.2013
Sonstiges 24.05.2013

Tipps zur Steigerung der Conversion Mehr verkaufen mit Responsive Design

Wie können E-Commerce-Verantwortliche die Conversion ihres Onlineshops mittels Responsive Webdesign steigern? Sebastian Wernhöfer, CEO der in München und Stuttgart ansässigen E-Commerce Agentur mzentrale, erklärt 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 zum Beispiel 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.

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, zum Beispiel 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.

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.

Das könnte Sie auch interessieren