von
Der Trend ist eindeutig: Zwei Drittel aller Online-Käufe werden inzwischen mobil getätigt. Wenn du als Händler zufriedene Kunden willst, ist responsives Design für alle mobilen Endgeräte ein absolutes Muss! Mit den folgenden Tipps verbesserst du die Usability deines Online-Shops – und steigerst deinen Geschäftserfolg nachhaltig.
Tipp 1: Keep it simple
Die Internetverbindung ist beim Smartphone meist langsamer als beim Desktop-PC – nicht die Maus, sondern der Touchscreen dient beim Mobilgerät zur Navigation. Dein Ziel für eine optimale Usability muss es daher sein, deinen Online-Shop so einfach wie möglich, aber trotzdem ansprechend und informativ zu gestalten. Einfachheit ist das oberste Gebot und beginnt bei der Navigation: Sie braucht eine klare Struktur mit eindeutigen Oberbegriffen, die die Nutzer intuitiv verstehen. Links sind ein schlechtes Gestaltungselement für mobile Endgeräte, bei denen oft nur ein Daumen zum Berühren und Wischen verwendet wird. Denn Links sind mit dem Daumen schlechter zu drücken als z. B. größere Buttons.
Einfachheit gilt auch für Texte: Deine Kunden lesen nicht, sie scannen die Wörter nach für sie relevanten Inhalten. Kurze, knackige Überschriften und klare Handlungsaufforderungen erleichtern das Verständnis erheblich. Bei der Formatierung solltest du vor allem kurze Absätze, Fettungen sowie Aufzählungen verwenden.
Tipp 2: Karussells kenntlich machen
Karussells, also wischbare Bildergalerien, sind für mobile Online-Shops gut geeignet. Denn heutige Smartphone-Nutzer verstehen intuitiv, dass sie per horizontalem „Swipe“ mit ihnen interagieren können. Das funktioniert allerdings nur, wenn Karussells eindeutig als solche erkennbar sind. Apple zum Beispiel empfiehlt für eine optimale Usability in diesem Punkt einen so genannten „Page Indicator“, eine Anzeige unterhalb des Karussells. Mit Hilfe von nebeneinander angeordneten Punkten sieht der Nutzer, wie viele Elemente das Karussell enthält und an welcher Stelle er sich gerade befindet.
Tipp 3: Bilder richtig in Szene setzen
Der Platz auf dem Screen des Mobilgeräts ist deutlich knapper bemessen als beim Desktop-PC – vor allem beim Smartphone. Umso wichtiger ist es daher, den vorhandenen Spielraum optimal auszunutzen. Sehr ungeschickt sind zu große weiße Flächen um Bilder herum. So wirken diese auf dem ohnehin schon kleineren Bildschirm noch kleiner, weniger ansprechend und vermitteln insgesamt ein eher unruhiges Gefühl. Deine Kunden müssen unnötig viel herein- und herauszoomen, um ihr gewünschtes Produkt richtig zu erkennen.
Für das Zoomen selbst sollte das Vorschaubild eine niedrigere Auflösung haben, um schnelle Ladezeiten zu ermöglichen. Mittels Gestensteuerung interagieren deine Kunden möglichst intuitiv mit den Bildern. Dies gilt auch für die Zoom-Ansicht. Dort sollten sie sich durch Berühren, Antippen und Ziehen Details des jeweiligen Produkts genau anschauen können.
Wenn es mehrere Bilder gibt, sollte innerhalb der Zoom-Ansicht das jeweils nächste Bild durch horizontales Wischen erreichbar sein, ohne vorherige Bilder schließen zu müssen. Außerdem muss deinen Kunden jederzeit klar sein, wie sie den Zoom-Modus wieder verlassen können. Sonst kommt es möglicherweise zu Abbrüchen, die für den Besucher deines Online-Shops ebenso ärgerlich sind wie für dich.
Für die mobile Nutzung optimierte Online-Shops sind schnell, einfach und intuitiv benutzbar. Nutze den begrenzten Platz insbesondere bei Bildern optimal aus. Achte auch bei den Details auf Einfachheit und Eindeutigkeit und ermögliche deinen Kunden so ein tolles mobiles Einkaufserlebnis!