„Mobile-First“ in der Praxisumsetzung - Clevere Strategien für das Shop-Design

Ein Gastbeitrag von Johannes W. Klinger

Mit der stetigen Zunahme der Nutzung mobiler Endgeräte im eCommerce stellt die Umsetzung des „Mobile-First“-Gedanken eine wichtige Anforderung dar. Dabei bleibt auch Responsive Design ein Trendthema. Es verspricht die beste Lösung, um Inhalte von Online-Shops, sowohl auf stationären PCs wie auch Handys und Tablets darzustellen. Meist wird hier aber daran gearbeitet die klassische Desktop-Darstellung auf mobile Endgeräte zu projizieren. Im Sinne von „Mobile-First“ geht es aber vielmehr darum, die mobile Usability in den Vordergrund zu stellen. Daher kann es ratsam sein, statt einem Responsive Design für alle Endgeräte eigenständig designte mobile Subshops für den mobilen Einkauf einzusetzen. 

Der Sammelbegriff „mobiles Endgerät“ selbst täuscht darüber hinweg, dass die User Experience auf dem Tablet durchaus anders ausfällt als auf dem Smartphone. Grob gilt, je größer das Display, desto mehr Zeit nehmen sich Nutzer für Recherche oder Surfen. Das wiederum hat Folgen auf die Inhalte, die bereitgestellt werden sollten. Da noch immer nicht überall LTE- oder W-LAN-Verbindungen zugänglichen sind, müssen in einem Responsive Design zahlreiche Inhalte zusätzlich angepasst bereitgestellt werden. Hinzu kommt der hohe Arbeitsaufwand beim Design durch eine gestiegene Vielfalt an mobilen Endgeräten, inklusive deren Bildschirmauflösungen und Browserversionen. 

Der Gesamtaufwand für Responsive-Shops liegt daher wesentlich höher als bei klassischen Webshops: Aufwendig zu erstellende und zu testende Steuerungen des Ladeverhaltens sind dann für einen guten Shop leider zwingende Voraussetzung für ein positives Suchmaschinen-Ranking oder ein hohes Einkaufserlebnis durch kurze Wartezeiten. Dadurch können in Responsive-Design-Projekten die Zeiten für die Erstellung eines guten Shops oftmals unerwartet hoch ausfallen. Auch die spätere Update- und Pflegearbeit an Design und Inhalten wird aufwendiger. Die Erfahrung zeigt, dass die investierte Arbeitszeit insgesamt um das Zwei- bis Dreifache gestiegen ist. Das wiederum macht komplexe Shops für mittelständische Händler schnell unwirtschaftlich. 

 

Doppelt gemoppelt hält auch im eCommerce besser 

Um eine effizientere Lösung zu gewährleisten, gibt es eine clevere Alternative. Sie ist ähnlich zu der Strategie die Google für statische Inhalte wie News oder Blogs favorisiert. Dort sollen nämlich parallel zu den Desktop-Seiten sogenannte AMP-Seiten für mobile Geräte erstellt werden. Auf Shops übertragen bedeutet dies, es werden zwei unabhängige, getrennte Basislayouts erstellt: Zum einen für die Endgeräte mit größeren Bildschirmauflösungen und stationärer Internetanbindung. Hier bedient ein großformatiges Layout die heutigen Anforderungen an Großansichten und Informationen. Zum anderen ein vereinfachtes responsives Layout nur für kleinere, mobile Geräte mit datensparsamen, angepassten Bildern und Inhalten. So wird eine erste Aufwandsersparnis allein durch das intelligente Konzept geschaffen: Bei keinem der beiden Layouts muss ein Kompromiss eingegangen werden. Zudem entfällt der Aufwand, einen fließenden responsiven Übergang zwischen den beiden Designvarianten praktisch umzusetzen und zu gewährleisten. 

Im mobilen Layout wird sinnvollerweise ein Responsive Design erstellt, um den verschiedenen Displaygrößen der Mobilgeräte Rechnung zu tragen. Dabei entsteht eine zweite Aufwandsersparnis: Dieses Responsive Design kann deutlich einfacher umgesetzt werden. Denn: Im Wesentlichen müssen Inhalte nur noch verkleinert oder vergrößert dargestellt werden. Größere Layout-Anpassungen beziehungsweise komplexe Ladesteuerungen für unterschiedlich große Grafiken je nach Zielsystem sind kaum noch notwendig. Dadurch kann das Responsive Design die Fülle unterschiedlich großer mobiler Endgeräte effektiver unterstützen. Das Layout für Kunden, die von einem Desktop, Laptop oder größerem Tablet mit W-LAN-Verbindung auf den Shop zugreifen, muss dagegen aufgrund der größeren Darstellungsfläche, wenn überhaupt, nur in sehr geringem Umfang responsive programmiert werden. Das wiederum reduziert die Arbeitszeit für die Erstellung deutlich. Für Händler, die bereits einen Onlineshop betreiben, heißt das, eine zusätzliche Mobile-Shop-Variante zu erstellen, die gezielt für die mobile Anwenderfreundlichkeit konzipiert ist, anstatt den gesamten Shop in eines der häufig zu sehenden Kompromiss-Designs zu zwingen. 

Subshops: benutzer- und SEO-freundlich 

Damit ein solches Konzept funktioniert, muss der Shop-Server lediglich erkennen, ob der Besucher von einem stationären oder mobilen Gerät aus zugreift und welche Anzeigegröße benötigt wird. Nutzt der Händler eine SaaS (Software-as-a-Service) Shop-Plattform, ist diese Erkennung bei guten Anbietern als Option verfügbar. Ein weiterer Vorteil von SaaS-Anbietern ist die Erfahrung aus Entwicklung und Betrieb von Shopsystemen, die in diesem Fall für den erfolgreichen Einsatz einer Subshop-Technologie für mobile Shops genutzt werden kann. Solche cleveren Konzepte von zwei parallelen Shop-Layouts erlauben es zudem, beliebige textliche und sonstige Inhalte, auch SEO-Inhalte, in den einzelnen Subshops bedarfsgerecht anzupassen und exklusiv für den jeweiligen Subshop bereitzustellen. 

So entfällt die für Suchmaschinen unvorteilhafte Bereitstellung teils gleicher Inhalte in mehreren Varianten im HTML-Code auf einer einzigen Seite – zum Beispiel eines langen Textes für Desktop und eines kurzen Textes für Mobile oder eines Bildes sowohl in Groß- als auch Kleinformat. Wenn übliche Kennzeichnungen stationärer und mobiler Inhalte für die beiden alternativ erstellten, unterschiedlichen Seiten verwendet werden, unterscheiden Suchmaschinen ganz explizit zwischen den Inhalten für die zwei verschiedenen Zielgruppen. Das Ranking bleibt für beide Subshops erhalten, da die Inhalte suchmaschinenkonform gekennzeichnet sind und so nicht als konkurrierender Duplicate Content abgewertet werden. Durch Subshops kann die SEO-Optimierung bei Bedarf sogar noch feiner gesteuert werden als über einen einzigen (Responsive-) Shop, in dem alle Inhalte für alle Zielgruppen zusammengefasst werden. 


Fazit 

Die mobile Nutzung wird im Onlinehandel auch zukünftig weiter steigen. Die Anpassung mobiler Shops an die Anforderungen des mobilen Shoppings ist unausweichlich und sollte bei Onlinehändlern fest in ihrer Strategie verankert sein. Die Einführung mobiler Subshops, die den „Mobile First“-Gedanken von Grund auf berücksichtigen, stellt dabei für Onlinehändler einen wichtigen Baustein für den erfolgreichen Handel der Zukunft dar. 


Über den Autor:
Johannes W. Klinger ist Vorstandsvorsitzender der Websale AG. Das Unternehmen entwickelt und betreibt seit 1996 die gleichnamige Shop-Plattform „Websale“ für Online-Händler und gilt als First-Mover für SaaS-Shopsysteme in Deutschland. Es hat jede Station in der Entwicklung des eCommerce gestaltet und passte die Shopsoftware immer wieder den neuen Anforderungen an. Aktuell wird es unter dem Namen „V8s“ in der achten Version betrieben.

Christian MilsterPermalinkTrackback-Link
Views: 2389
  •  
  • 2 Kommentar(e)
  •  
E-Commerce Agentur Browserwerk | Gerrit
22.05.2017
12:58
 Uhr
Herr

An welcher Stelle wird die Indizierung von Duplicate Content bei Adaptive Webseiten verhindert? Wird dies über Canonicals gelöst oder werden die Inhalte dann grundsätzlich immer zweifach erstellt - einmal für Mobile und einmal für Desktop? In der Praxis ist es wohl meist eher so, dass Inhalte aus bestehenden ERP-Systemen generiert werden, welche oftmals keine Möglichkeit der inhaltlichen Separation anbieten. Ansonsten ist für den Nutzer natürlich ein Subshop immer die besten Variante, da genau die Inhalte ausgeliefert werden können, die benötigt werden. In der Praxis allerdings bei den meisten Projekten aufgrund des hohen Verwaltungsaufwandes eher schwierig abzubilden...

Torsten_G
19.06.2017
11:12
 Uhr
Ein interessanter Ansatz

Den Ansatz von Google's AMP auch auf Online Shops zu porträtieren finde ich sehr spannend. Dennoch muss ich mich meinem Vorredner anschließen. Ich denke dass der Verwaltungsaufwand sehr hoch ist. Es gilt, nach meinem Verständnis, dann 2 Shops parallel zu pflegen und dabei dann beispielsweise auch Feeds zu pflegen, da auf mobilen Geräten gekürzte Texte zum Einsatz kommen. Ein Problem kann auch die Conversions auf mobilen Geräten betreffen bzw. der Erfassung dieser. Es wird u.U. auf mobilen Geräten gesucht und dann auf dem Desktop gekauft. Ein gutes Trackingkonzept wie hier (https://www.onlinesolutionsgroup.de/usability-conversionoptimierung.html) beschrieben, ist dabei ein absolutes Muss. Ansonsten kann auch der Desktop Shop von der mobilen Version profitieren, wenn der Mobile First Index umgesetzt wird.

Mein Kommentar

Zurück

Anmelden

Passwort vergessen.

registrieren

Letzte Kommentare

Frank Edelmetalle Feak!!
18.07.2017 12:29
Antwort
12.07.2017 07:29
Edelmetall Frank Betrug
11.07.2017 16:55
Dipl. Bw.
11.07.2017 13:39

Kopieren Sie diesen Link in Ihren RSS-Reader

RSS 0.91Nachrichten
RSS 2.0Nachrichten

Meist gelesene Posts

The A-Z of e-Commerce Death Stars
101704 Mal angesehen
03.01.2013 13:47
Gibt es ein Leben nach Amazon?
68969 Mal angesehen
28.06.2013 07:21
Touché, Microsoft!
59792 Mal angesehen
09.03.2012 08:00
Institut des Interaktiven Handels GmbH
59106 Mal angesehen
12.03.2012 14:20