Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland

Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland

Wir haben mobile Versionen der TOP-20-Online-Shops in Russland auf 44 Faktoren analysiert. Wir haben eine höllische Tabelle mit Einsen und Nullen, die fast verschwunden ist, aber sie haben unsere Kräfte gesammelt und beschrieben, wie und was sie den Käufer im Top-Segment des mobilen E-Commerce „bekommen“.



Um die mobile Anpassung zu analysieren, haben wir die TOP-20-Online-Shops aus der DataInsight- Bewertung entnommen . Dies sind die Trendsetter, auf die andere Spieler abzielen.


Die Parameter für die Bewertung stammen aus einer großen ähnlichen Studie des westlichen Einzelhandels .


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland

Wir haben nicht alle Parameter herangezogen, sondern 44 signifikante Faktoren identifiziert. Sie sind in neun Gruppen eingeteilt:




Eine Tabelle mit den Analyseergebnissen für jeden Online-Shop finden Sie hier . In diesem Artikel werden wir jedes der 44 Elemente der mobilen Benutzerfreundlichkeit durchgehen und nach wichtigen Trends suchen. In jedem Absatz geben wir allgemeine Statistiken an: Wie viele Geschäfte verwenden / verwenden diese Technik nicht.


Technologie


Spoiler Online-Shops geben mobile Versionen zugunsten von "Gummi" -Seiten auf, aber die Download-Geschwindigkeit ist immer noch gering.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Anpassungsfähigkeit gegen mobile Version


14/6


Eine adaptive Site gewinnt vor der mobilen Version (auf einer separaten Subdomain des Formulars m.site.ru). Es muss nicht zusätzlich verwaltet werden, es gibt kein Problem der Vervielfältigung von Inhalten, es wird derselbe Quellcode verwendet, was die Kosten senkt.


Nicht umsonst arbeiten 70% der Top-Online-Shops in Russland genau auf der Basis adaptiver Websites. Die mobile Version gehört der Vergangenheit an.


PageSpeed ​​Insights Orange Zone: Alles ist traurig


2/20


Online-Shops haben keine hohe Ladegeschwindigkeit fĂĽr Seiten. Hochwertige Skripte und Bilder hinterlassen Spuren. Dies spiegelt sich insbesondere in der Download-Geschwindigkeit des Mobiltelefons wider.


Nur 1 von 20 Websites wechselt in die grüne Zone, wenn sie im Google PageSpeed ​​Insights-Dienst aktiviert sind . Aber selbst das Erreichen der „orangefarbenen“ Zone ist immer noch schwierig - es gibt hier auch nur einen Standort. Die verbleibenden 18 Standorte erzielen weniger als 50 Punkte und fallen in die rote Zone.


Wenn Sie also daran arbeiten, die Website zu beschleunigen, hat mindestens ein Faktor einen Vorteil gegenĂĽber den Top-Wettbewerbern in Ihrer Nische. Dies gilt insbesondere fĂĽr den Ăśbergang von Google zur Mobile-First-Indizierung .


SchlĂĽsselelemente der Vorlage


Spoiler Es gibt offensichtliche Trends: ein Hamburger-Menü, eine anklickbare Telefonnummer, ein Suchfeld auf der Website in der Kopfzeile und ein auffälliges Warenkorbsymbol. Es ist besser, hier nicht kreativ zu sein, sondern mit den Marktführern Schritt zu halten.


Zum Korrigieren des MenĂĽs, der Promo am unteren Bildschirmrand oder zum HinzufĂĽgen des Widgets eines Online-Beraters mĂĽssen Sie jeweils Tests durchfĂĽhren.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


MenĂĽ behoben


11/9


Die Tendenz, beim Scrollen einer Seite wichtige MenĂĽelemente am oberen Bildschirmrand zu korrigieren, ist implizit, bietet jedoch einen Vorteil. Dies ist logisch - die wichtigsten Navigationselemente befinden sich im MenĂĽ. Und es ist gut, wenn sie beim Scrollen zur Hand sind.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Stellen Sie sicher, dass das MenĂĽ nicht zu viel Platz auf dem Bildschirm beansprucht, was sich nachteilig auf andere Elemente auswirkt.


Klickbare Telefonnummer


15/5


Alle Telefonnummern auf der Website mĂĽssen fĂĽr einen sofortigen Anruf anklickbar sein. Es gibt keine Optionen. Das Kopieren einer Nummer durch Umschalten zwischen Telefonanwendungen ist immer noch ein Problem.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Wie Sie sehen, halten sich jedoch nicht alle Geschäfte an dieses offensichtliche Prinzip.


Hamburger MenĂĽ


19/1


Der Trend geht immer noch zugunsten der Hamburger, aber hier lohnt es sich, vom Zielort aus zu starten. Verwenden Sie fĂĽr ein konservativeres Publikum das vertraute TextmenĂĽ - ein Hamburger kann unbeaufsichtigt bleiben.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Shop-Suche


16/4


Wenn Sie mehrere Markengeschäfte haben, fügen Sie eine Suche nach dem nächstgelegenen Geschäft nach Besucherstandort hinzu. Wenn Ihre Produkte von anderen Wiederverkäufern verkauft werden, hat diese Option weniger Priorität.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Wenn Sie keine Verkaufsstellen haben, können Sie den nächstgelegenen Lieferpunkt finden.


Sehen Sie, wie beliebt die Store-Suchseite in Ihrem Webanalysesystem ist. Wenn sie viel Verkehr hat, platzieren Sie einen Link zu ihr im MenĂĽ in der Kopfzeile.


Der Kontext für Online-Shops auf professioneller Ebene und ohne Agentur befindet sich im PromoPult-System . Automatische Wortauswahl, automatische Anzeigengenerierung, „intelligente“ Gebotsverwaltung. Fertige Branchenlösungen. Echtzeitstatistik.


Auffälliger Korb


17/3


Es ist wichtig, hier nicht kreativ zu sein. Jeder weiß, dass der Korb wie ein „Korb“ oder „Wagen“ aussehen sollte. Versuche, Copyright-Symbole zu erfinden oder einen Korb irgendwo am unteren Bildschirmrand zu platzieren, führen dazu, dass Benutzer Rätsel lösen müssen, anstatt Waren zu kaufen.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Promo am unteren Bildschirmrand behoben


4/16


FĂĽgen Sie am unteren Bildschirmrand Informationen zu Sonderangeboten oder einem speziellen CTA hinzu, ebenso wie das Platypus.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Automatische Dia-Drehung im Hauptbanner


7/13


Immer mehr Geschäfte lehnen es ab, Bilder im oberen Banner automatisch zu drehen. Von 20 Standorten haben 7 immer noch ein solches Banner. 13 verwenden diese Lösung jedoch nicht. Im Allgemeinen scheint es an der Zeit zu sein, sich von Bannern in der mobilen Version zu verabschieden.


Header-Suchfeld: muss haben


20/0


Verstecken Sie die Suche nicht im Menü, sondern setzen Sie sie in die Kopfzeile. Die beste Option ist das Lupensymbol, durch Tippen auf das das Suchfeld geöffnet wird. So sparen Sie Platz.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Die linke Suche dauerte eine ganze Zeile auf einem kleinen Bildschirm. Rechts ist eine dynamische Lösung.


Online-Berater-Widget


3/17


Ein Online-Berater ist eine nützliche Option für E-Commerce-Websites. Bei Mobilgeräten ist diese Entscheidung jedoch umstritten: Schließlich überlappt das Widget einen Teil des Inhalts, und es ist nicht einfach, ihn auszublenden.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Testen Sie das Widget in Ihrer Zielgruppe. Installieren Sie einen Online-Berater (wenn Sie nicht bezahlen möchten, gibt es einen kostenlosen GetSale-Berater im PromoPult- Konvertierungsverbesserungsmodul ), passen Sie ihn an Ihren Unternehmensstil an und sehen Sie, wie viele Anrufe / Verkäufe in einem Monat getätigt werden. Und dort treffen Sie bereits eine Entscheidung - lassen Sie sie oder entfernen Sie sie.


Filter im Katalog


Spoiler Filter im Katalog sind ein Muss. WĂĽnschenswert - bei gleichzeitiger Auswahl mehrerer Parameter. Vergessen Sie nicht den Filter fĂĽr den Preis.


Praktische Optionen sind das Fixieren des Filters beim Scrollen (Hauptsache, dass er nicht viel Platz beansprucht) und das Anzeigen der Farbe des Produkts im Filter nicht mit Text, sondern mit einem Farbbild.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Filter


19/1


Filter vereinfachen die Navigation. Der aktive Einsatz von Filtern bleibt ein klarer Trend.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Gesperrter Filter scrollen


3/17


Dies ist eine neue Lösung für mobile Schnittstellen, mit der Benutzer Suchergebnisse filtern können. Es scheint erfolgreich zu sein - als ob es sein sollte. Beim Scrollen durch einen Katalog sind Filter immer zur Hand.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Online-Shops haben es jedoch nicht eilig, Filterkorrekturen zu implementieren - möglicherweise möchten sie keinen zusätzlichen Bereich des Bildschirms blockieren (oder die Implementierung in der adaptiven Version ist schwierig).


Gleichzeitige Auswahl mehrerer Parameter


19/1


Der Benutzer sollte in der Lage sein, Produkte gleichzeitig in verschiedenen Kategorien zu filtern. Alle analysierten Sites verwenden genau diese Filter (auf einer Site gibt es ĂĽberhaupt keine Filter, daher gibt es keine solche Option).


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Farbwähler


4/16


FĂĽr die beste UX im Farbfilter wird empfohlen, farbige Quadrate / Kreise (oder eine Kombination aus Text- und Farbmarkierungen) anstelle einer Textbeschreibung der Farbe zu verwenden.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Inländische Geschäfte verwenden jedoch hauptsächlich Text.


Nach Preis filtern


17/3


Einige Websites lehnen den Filter für den Preis ab. Sie erklären dies, indem sie sich eher auf das Produkt als auf dessen Wert konzentrieren. Aber in den meisten Geschäften gibt es einen solchen Filter. Und es ist wirklich nützlich.


Elemente der Katalogseite


Spoiler Zu den offensichtlichen Trends gehört die Möglichkeit, Waren aus dem Katalog in den Warenkorb zu legen und Produktbewertungen und Rabatte anzuzeigen. Das Scrollen durch die Bilder der Waren im Katalog, das Anzeigen ihrer Optionen und das automatische Laden von Waren anstelle der Paginierung ist jedoch noch neu.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Automatisches Laden von Waren statt Paginierung


3/17


Das Tippen auf den Pfeil „Nächste Seite“ ist nicht so bequem wie das einfache Umblättern. Die Ausgabe von Waren nicht um 10-20-50 pro Seite, sondern um ein „endloses“ Band, das beim Scrollen geladen wird, ist immer noch exotisch.


Unter dem Gesichtspunkt der Benutzerfreundlichkeit ist auch eine Zwischenlösung praktisch: Wenn die Paginierung gespeichert ist, aber die Schaltfläche "Anzeigen" hinzugefügt wird. Für einen mobilen Benutzer ist es einfacher, auf eine große Schaltfläche zu klicken und die Produktliste zu erweitern, als auf Zahlen / Pfeile zu klicken.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Zeigen Sie mehrere Produktbilder in einem Katalog an


1/19


In der Regel wird im Katalog ein Bild der Ware dargestellt. Es gibt jedoch eine Lösung, mit der Sie direkt im Katalog durch Bilder scrollen können, ohne zur Produktkarte zu wechseln. Dies ist praktisch für mobile Benutzer, da Sie nicht erneut auf eine neue Seite wechseln müssen. In der häuslichen Praxis ist dies immer noch eine Neuheit.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Markieren Sie "Neu"


10/10


Für Geschäfte mit einer hohen Rücklaufquote ist die Marke „Neu“ eine Möglichkeit, Besucher für Produkte zu gewinnen, die sie noch nicht gesehen haben.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Wenn die Aktualisierung des Sortiments für eine permanente Zielgruppe nicht Ihre Hauptaufgabe ist, achten Sie auf andere Eigenschaften des Produkts und verschwenden Sie keinen Platz auf dem Symbol „Neu!“.


Zeigen Sie die Produktoptionen auf der Kategorieseite an


2/18


In Desktop-Versionen von Geschäften besteht die Möglichkeit, Farboptionen für ein Produkt auf der Kategorieseite anzuzeigen. Auf Mobilgeräten ist es besser, diese Option abzulehnen, da es schwierig ist, den Finger in die winzigen Symbole für Anzeigeoptionen zu bekommen. Es ist besser, sich auf die Aufschrift "Es gibt verschiedene Farben" zu beschränken und diese bereits auf der Produktseite anzuzeigen, wo die Bilder mehr Platz beanspruchen und es bequemer ist, durch sie zu scrollen.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Produktbewertungen auf der Kategorieseite


15/5


Sie können nicht sicher sagen, wie sich das Hinzufügen von Sternen und das Angeben der Anzahl der Bewertungen unter dem Produktbild auf den Umsatz auswirkt. Gemessen an der Tatsache, dass sie von einer großen Anzahl untersuchter Geschäfte genutzt werden, funktioniert es. Trotzdem ist es sinnvoll, diesen Parameter in jedem Einzelfall zu testen - nicht alle Geschäfte erhalten viele Bewertungen für eine große Warenmasse.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Anzeige von Rabatten - in Kategorien und auf der Karte


18/2


Auf der Kategorieseite sollten Rabattpreise in größerem Druck und möglicherweise in Farbe neben dem durchgestrichenen Preis ohne Rabatt angezeigt werden. Der Wortlaut „Sie sparen so viel“ bleibt jedoch besser auf der Produktseite - um Platz zu sparen.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Kachel gegen Liste


9/11


Für Geschäfte mit einem großen Sortiment, für die ein schnelles und bequemes Durchsuchen wichtig ist, ist die Warenausgabe den Kacheln vorzuziehen. Im Premium-Segment oder in anderen Kategorien, in denen Sie weitere Informationen zum Produkt benötigen, lohnt es sich jedoch, Produkte aufzulisten.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Option "In den Warenkorb"


16/4


Die Möglichkeit, Waren in den Warenkorb zu legen, ohne die Beschreibungsseite aufzurufen, ist für einfache Produkte sinnvoll, die dem Käufer bekannt sind (z. B. die Bestellung von Lebensmitteln). In anderen Fällen ist es besser zu testen - wenn Benutzer auf diese Schaltfläche klicken, lassen Sie sie. Verschwenden Sie andernfalls nicht Ihren Bildschirmplatz.


Produktvergleich


8/12


Oft ist diese Option auf Mobilgeräten unpraktisch. Daher muss es in mobilen Versionen entweder gut durchdacht oder vollständig aufgegeben werden.


Produktseite Elemente


Spoiler Vergrößerte Produktbilder verbessern die Benutzererfahrung. Mit nützlichen und Videoprodukten können Sie das Produkt als "live" betrachten. Es ist nicht überflüssig, das Teilen von Warenkarten in sozialen Netzwerken und Instant Messenger zu blockieren.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Die Fähigkeit, das Bild zu vergrößern


16/4


Es gibt zwei Möglichkeiten: Vergrößern des Bildes beim Klicken oder die Möglichkeit, es mit den Fingern zu „dehnen“. Dies ist eine Option, die von Benutzern erwartet wird, daher verwenden die meisten Websites diese Vorgehensweise.


Video auf der Produktseite


9/11


9 von 20 Websites in der Studie veröffentlichen Videos auf Produktseiten. Natürlich ist das Entfernen des Videos für jedes Produkt teuer. Für die beliebtesten Produkte lohnt es sich jedoch, dies zu tun.


Social-Sharing-Schaltflächen


8/12


Diese Option wird von Online-Shops nicht so häufig verwendet. Möglicherweise liegt der Grund in der geringen Beliebtheit: Wenn Benutzer den Link freigeben müssen, kopieren sie ihn einfach aus der Browserzeile (und auf einem Smartphone ist es einfacher, einen Screenshot zu erstellen und ihn sofort zu senden). Die Schaltfläche zum Freigeben der Seite nimmt jedoch nicht viel Platz ein und ist daher nicht überflüssig.


Personalisierungselemente


Spoiler Cross-Selling- und Up-Selling-Elemente, die Benutzern Produkte anbieten, die auf ihren Vorlieben basieren, steigern den Umsatz. Sie nicht zu benutzen bedeutet, Einkommen zu verlieren.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


"Sie kaufen / stöbern normalerweise mit diesem Produkt ..."


13/7


Wenn für das ausgewählte Produkt obligatorische Ergänzungen erforderlich sind, wird dieser Block definitiv benötigt. Zeigen Sie es auf der Produktseite und nach dem Hinzufügen des Produkts zum Warenkorb an. So erhöhen Sie das Cross-Selling.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


KĂĽrzlich angesehen


9/11


Dies ist eine bequeme Gelegenheit, schnell zu einer zuvor interessierten Seite zurückzukehren. Aber nur 45% der analysierten Geschäfte haben diese Option.


Andere Angebote


13/7


Nachrichten wie "Sie werden es auch mögen ...", "Mehr von dieser Marke ..." usw. werden zu vertrauten Elementen von Produktseiten nicht nur von Desktop-, sondern auch von mobilen Geschäften.


Artikel in den Warenkorb legen


Spoiler Leiten Sie den Benutzer nach dem HinzufĂĽgen des Produkts nicht in den Warenkorb. Eine Vorschau des Warenkorbs im Popup-Fenster ist hilfreich.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Bleiben Sie auf der Website, nachdem Sie das Produkt in den Warenkorb gelegt haben


20/0


Nach dem HinzufĂĽgen des Produkts zum Warenkorb wird empfohlen, den Benutzer auf der Produktseite zu belassen und nicht zum Kassenbereich weiterzuleiten. Die FĂĽhrer auch - das heiĂźt, es ist gerechtfertigt.


Vorschau des Warenkorbs beim HinzufĂĽgen von Waren


6/14


Dies ist eine gute Möglichkeit, um zu zeigen, was sich im Korb befindet, ohne darauf zuzugreifen. Aber nur 30% der Geschäfte haben es implementiert - jetzt wissen Sie, wie Sie es um mindestens einen Faktor umgehen können.


Papierkorb Popup


5/15


Ein Popup-Fenster ist praktisch, um das Hinzufügen von Waren zum Warenkorb zu bestätigen. In diesem Fenster wird möglicherweise der gesamte Inhalt des Warenkorbs angezeigt. Beim Schließen bleibt der Benutzer auf der Produktseite.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Warenkorb Artikel


Spoiler Der Warenkorb ist eine wichtige Conversion-Seite. Hier können keine Fehler gemacht werden. Stellen Sie sicher, dass ein Produktbild mit einer kurzen Beschreibung angezeigt wird. Zu den nützlichen Optionen gehören eine Angabe der Lieferzeit, eine Erinnerung an die Vorteile und die Möglichkeit, den Warenkorb zu speichern. Das Duplizieren der Zahlungs- / Bestellschaltfläche kann jedoch abgebrochen werden.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Produktbild und Beschreibung


20/0


Der Warenkorb sollte ein Foto von jedem Produkt anzeigen. Eine kurze Beschreibung der Hauptmerkmale (Name, Größe, Farbe usw.) ist ebenfalls obligatorisch. Eingeschränkter Bildschirmplatz bedeutet nicht, dass es den Benutzern egal ist, was sich in ihrem Warenkorb befindet.


Versand- und Liefertermine


5/15


Wenn Sie zu diesem Zeitpunkt keine bestimmten Lieferzeiten garantieren können, geben Sie mindestens an, wann Sie die Waren versenden möchten.


Nutzenerinnerung


2/18


Der Warenkorb wird nicht verkehrt sein, um die Boni, die der Käufer erhält, zurückzurufen. Zum Beispiel kostenlose Lieferung, Lieferung am nächsten Tag, kostenlose Rückgabe, Bonus, Garantiezeit usw.


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Warenkorb speichern


3/17


85% der Websites aus der Stichprobe verweigerten die Möglichkeit, den Warenkorb zu speichern und in Zukunft dorthin zurückzukehren. Beeilen Sie sich jedoch nicht zu Schlussfolgerungen und entfernen Sie eine solche Option. Dies ist eine praktische Option für Benutzer, die regelmäßig ähnliche Produkte kaufen (z. B. Lebensmittel). In anderen Fällen können Sie mit dieser Option eine Person behalten, die nicht vorhat, jetzt zu kaufen. (Die Frage bleibt, wie man den Käufer ohne Registrierung und nach dem Ausbrennen der Cookies identifiziert).


Mobile Usability im E-Commerce: Analyse der TOP-20-Online-Shops in Russland


Schaltfläche "Zahlung / Weiter"


2/18


Für eine Weile gab es einen Trend, eine Schaltfläche zum Wechseln zur Zahlungsseite oben und unten im Warenkorb zu platzieren. Aber fast jeder weigerte sich, Knöpfe zu duplizieren.


Checkout-Seitenelemente


Spoiler Machen Sie die Bestellung einfach und unkompliziert. Zwingen Sie keine Person zur Registrierung - sehen Sie einen Kauf mit einem Klick vor. Implementieren Sie dynamische Validierungs- und automatische Vervollständigungsfelder. . , .


e-Commerce:  -20 -



14/6


. .


, , ( , , . .).


( )


5/15


— . . .


e-Commerce:  -20 -



12/8


( «») — , . — .



12/8


(, , email . .) .



13/7


, , ( - , ).


—


Genau so. - , — - , - . Und das ist gut. . .


— , . , , , .


— . , , , , — - . — . .


.

Source: https://habr.com/ru/post/de461913/


All Articles