Startseite BlogOptimierung10 Tipps zur Usability-Optimierung von Online-Shops

10 Tipps zur Usability-Optimierung von Online-Shops

14. Januar 2015 — Optimierung
Emotionen im Online-Shop

Für Online-Shops ist das Thema Usability im Sinne von Benutzerfreundlichkeit essentiell. Ist anderswo die Motivation für benutzerfreundliche Webseiten von diversen Motiven oft nur spärlich gefördert, geht es bei Shops ums Geld. Und damit wird zumindest schlechte Usability im E-Commerce zu einem enormen Hebel: 10 Tipps zur Usability-Optimierung von Online-Shops für mehr Umsatz.

Usability bei Online-Shops

Usability-Optimierung von Online-Shops

Usability-Optimierung von Online-Shops

Bei Online-Shops ist Usability immer ein Thema. Oft läuft dies auch unter Landingpage-Optimierung oder Conversion-Optimierung. Das Ziel ist trotz inhaltlich unterschiedlicher Schnittmengen doch fast immer das gleiche. 100% aller Besucher sollen kaufen. Natürlich gibt es auch Abstufungen und Ausnahmen, die uns aber hier nicht weiter beschäftigen sollen.

Tipp: Besuchertypen des Shops

Usability-Optimierung bei Online-Shops beginnt bereits bei der Zielgruppe. Neben deren Auswahl, Bedarf, Ansprache usw. geht es für die Usability vor allem um die Besuchertypen. Diese sollte man für folgende Aspekte gruppieren:

  • Produktwissen
  • Online-Shop-Erfahrungen
  • Position im Kaufprozess

Daraus lassen sich folgende Grundregeln ableiten:

Je weniger Produktwissen, desto mehr Informationen, Vergleiche, Auswahlhilfen.
Je weniger Online-Shop-Erfahrungen, desto mehr sind klassische, gelernte Layouts und Funktionen einzuhalten.
Je früher der Shop im Kaufprozess besucht wird, desto emotionaler und vertrauenswürdiger muss die Besucheransprache ausfallen.

In der Praxis hilft es häufig, diese Überlegungen für jede Seitenart getrennt zu diskutieren. Beispielsweise für:

  • Erster Eindruck: Ansprache, Vertrauen, Fokus
  • Suchen und Finden: Navigation, Kategorieseiten, Suchfunktion
  • Vergleich: Filter, Produktdetailseiten
  • Kaufabschluss: Call-to-Action, Einwände
  • Checkout: Warenkorb, Bestellschritte
  • Wiederkauf: nach Bestellung

10 Tipps zur Usability-Optimierung von Online-Shops

Generell kann man folgende 10 Tipps herauskristallisieren, die beinahe jeden Online-Shop besser machen was die Usability betrifft.

1. Tolle Produktfotos

Produktfotos bei Apple

Sehr hochwertige Produktfotos bei Apple

Bilder wirken. Sehr gute Produktfotos sind daher extrem wirksam. Es kann folglich Sinn machen, die Produkte nochmals selbst zu fotografieren, wenn die Herstellerfotos nicht einheitlich in bester Qualität und Art sind. Qualität suggerieren beispielsweise sehr gute Detailaufnahmen. Das macht etwa Apple sehr gut. Dort ist der eigentliche Shop auch dezent ausgelagert aber vielfach clever an die primär unkommerziellen Produktseiten angebunden.

2. Einfache Navigation(en)

Urban Originals - Shopnavigation

Urban Originals – übersichtliche, klassische Shopnavigation

Klassische Shops überfordern den Besucher bei der Navigation. Es gibt auch viele wichtige Links, allein im Kopfbereich die Produktnavigation, Suche, Warenkorb, Anmelden, Registrieren usw. Aber nicht jeder Link muss überall platziert werden. Man sollte sich auf den Schwerpunkt (je Benutzertyp und konkreter Funktion) konzentrieren. Im Warenkorb sind andere Links wichtig wie auf der Startseite oder Kategorieseiten. Weniger ist mehr.

Negativ-Beispiel: Porsche Design Shop

Je nach Auflösung fällt bei Porsche das Corporate Design im Online-Shop in sich zusammen.

3. Klare Benutzerführung

Benutzerführung bei Shops, Beispiel ETQ

Einfache Benutzerführung bei Shops, Beispiel ETQ

Mache es dem Käufer einfach. Alles was weg kann, kann weg.
Wichtig sind klare Handlungsaufforderungen mit klaren Buttons, die nicht um Aufmerksamkeit mit anderen umgebenden Elementen konkurrieren müssen.
Diese Call-to-Action-Buttons, auch BOB (für big orange button) genannt, sind eine wichtige Brücke auf dem Weg vom Besucher zum Käufer.
Bewährte Tipps:

  • Nutzen nennen
  • aktive, eindeutige Verben
  • gut sichtbare Platzierung
  • Aufmerksamkeit durch Kontrast und Abstand
  • eindeutig als Button erkennbar

Extremes Beispiel: Dropbox

Dropbox Benutzerführung

Dropbox Benutzerführung auf der Startseite!

4. Emotionen wecken

Emotionen im Online-Shop

Subtile Emotionen im Online-Shop Chic at Home

Auch wenn obiger Shop manche Dinge nicht gut löst, durch Fotos, Farben und Gestaltung vermittelt der Shop sehr gut die gewünschte Stimmung und schafft damit die passende Atmosphäre für die Produkte. Leider nutzen selbst Outdoor-Shops dies nicht oder nur unzureichend.

5. Gelerntes Shop-Layout einsetzen

Klassisches Shoplayout am Beispiel Edward Copper

Klassisches Shoplayout am Beispiel Edward Copper

Je nach Benutzertyp sollte man sich mehr oder noch mehr an das gelernte, typische Shop-Layout anlehnen. Denn der Käufer sollte nicht suchen müssen, sondern alle Funktionen dort finden, wo er sie erwartet.
Diese Erwartungshaltung verändert sich auch im Laufe der Zeit und ist auch je nach Endgerät leicht unterschiedlich.
Derzeit kann man generell für Desktop-Geräte folgendes festhalten:

  • Warenkorb ist rechts oben
  • Suche ist oben mittig oder rechts
  • Registrieren, Login ist oben rechts
  • Sprachwahl ist oben rechts oder mittig

Orientieren kann man sich an prägenden bekannten Shops wie Zalando und Co.

6. Produktdetails

Produktdetails - Darstellung auf McVac

Produktdetails – Darstellung auf McVac

Die Produktdetailseite ist sehr wichtig. Das ist den meisten Shopbetreibern klar. Hier gilt es neben der Benutzerführung (vgl. oben) den Platz optimal zu nutzen, zumal häufig viele Informationen vorhanden sind. Obiges Beispiel zeigt ein klassisches Layout, das derzeit als bewährt gelten kann.
Je nach Produkt und Benutzertyp kann es aber wichtig sein, weitere Details und Vorzüge hevorzuheben. Dazu zwei sehr gute Beispiele:

Produktseite des Shops Anyi Lu

Produktseite des Shops Anyi Lu

Produktseite des Shops MH40

Produktseite des Shops MH40



7. Intelligente Produktfilter und Produktsuche

Produktfilter bei Online-Shops am Beispiel Zalando

Produktfilter bei Online-Shops am Beispiel Zalando

Wer im Shop suchen muss, hat ein Problem. Je nach Passion und Alternativen minimiert sich die Geduld der Suchenden. Aus Shop-Sicht ist der Besucher praktisch gleich weg. Daher sind die Suche generell sowie Produktfilter bei mehreren Produkten sehr wichtig. Denn wenn diese nicht intuitiv, korrekt und wie erwartet funktionieren, gibt es keine zweite Chance. Der Frust ist zudem beim Besucher groß. Daher plädiere ich lieber dazu Filter sparsam einzusetzen, dafür lieber mit Kategorien, Bestsellern etc. arbeiten, um die Produktanzahl soweit zu reduzieren, dass eine Filterung einfach bleiben kann.
In obigem Beispiel macht Zalando das trotz enorm vieler Filter recht gut:

  • Wegweiser-Pfad-Navigation (Breadcrumb)
  • Klare Kategorieüberschrift mit Gesamtzahl der Produkte
  • Eindeutige Filter (insgesamt acht (!) Stück, von denen aber nur die vier wichtigsten eingblendet sind)
  • intuitive Sortierung
  • Klare Kategoriebox links

8. Vertrauen durch Siegel, Bewertungen, Social Media

Vertrauen durch Siegel, Bewertungen, Social Media

Vertrauen durch Siegel, Bewertungen, Social Media

Besonders deutsche Käufer achten sehr auf die Vertrauenswürdigkeit von Shops. Neben SSL für persönliche Dateneingaben geht es dabei um Markenbekanntheit, Trustsiegel (Trustes Shops, TÜV, …), Kundenbewertungen aber auch Social Media spielt hier eine wichtige, wenngleich meist subtile Rolle.
Kundenbewertungen sind immer wie ein offenes Visier, aber mit enormer Wirkung, wenn man sie wie Amazon aber auch Zalando geschickt einsetzt.

9. Schnelle Ladezeiten steigern die Conversion-Rate

Ladezeit-Probleme im Shop von More and More

Ladezeit-Probleme im Shop von More and More

Shop-Software erfordert meist viele Server-Ressourcen. Beliebte Shop-Systeme wie Magento benötigen speziell potente Server, um akzeptable Ladezeiten zu erreichen. Es gibt genügend Studien, die klar belegen, wie die Kaufrate (Conversion-Rate) mit jeder Zehntelsekunde Ladezeit sinkt.
Dynamisches Nachladen weiterer Produkte beim Scrollen mag die initiale Ladezeit verkürzen, muss dann aber auch flott funktionieren. Der größte Hebel wäre hier sicherlich die Wahl einer effizienten Shop-Software mit einem leicht überdimensionierten Webhosting. Aber selbst ohne diesen Wechselaufwand kann man mit klassischer Ladezeitoptimierung einiges erreichen.

10. Shop-Usability testen (lassen)

Shop Usability testen und verbessern

Shop Usability testen und verbessern

Ein Usability-Test lohnt sich schon in kleinem Maßstab. Frage einen Bekannten, der den Shop nicht kennt, ob er wenige Minuten für einen Test Zeit hat. Stelle dieser Person eine konkrete Aufgabe vorab, etwa „finde ein Geschenk für … bis 100 Euro und lege es in den Warenkorb!“.
Dabei schaut man dem Probanden über die Schulter und bittet ihn laut die Gedanken zu äußern. Ansonsten ist keinerlei Hilfestellung erlaubt.
Ansonsten gibt es auch recht günstige externe Tester, etwa bei rapidusertests oder inspectlet.

NETPROFIT Blog

Im Blog schreibt         über CMS, SEO & Webdesign. Kontakt →

Kategorien

Kommentar schreiben zu 10 Tipps zur Usability-Optimierung von Online-Shops

Kommentare werden erst nach manueller Freischaltung sichtbar. Die übermittelten Daten werden entsprechend der Datenschutzerklärung zur Verarbeitung des Kommentars gespeichert.

Kommentar

KommentatorIn

(erforderlich)

(erforderlich, wird nicht angezeigt)

(optional)

Nibelungenplatz 2
D-94032 Passau

Tel.: +49 (0)851/ 966 31-31
Fax: +49 (0)851/ 966 31-41
E-Mail:

©  2001 − 2018  NETPROFIT  | Kontakt | AGB | Datenschutz, Impressum