Quelle.de – was kann man von der neuen Shop-Navigation lernen? (Teil 2)

Nachdem ich mich in meinem ersten Beitrag zum Re-Design von Quelle.de vor allem mit der Gestaltung des Kopfbereichs (Header) und der Benennung der Hauptrubriken beschäftigt hab, steht nun die Shop-Navigation im engeren Sinne auf der Agenda.

Einleitend dazu gleich mal eine Abbildung um das Konzept zu verdeutlichen:

Layer-Navigation auf www.quelle.de am Beispiel des Sortiments Produkte > Damenmode & Schuhe (Stand Juli 2009)
Layer-Navigation auf www.quelle.de am Beispiel des Sortiments Produkte > Damenmode & Schuhe (Stand Juli 2009)

Wie funktioniert das?

Wenn der Maus-Cursor über die Bezeichnung „Produkte“ fährt, dann erscheinen die Sortimente bzw. Warengruppen (Damenmode & Schuhe, Herrenmode & Schuhe usw.).
Über rechtseitig positionierte Pfeile wird angezeigt, dass je Warengruppe noch Unterwarengruppen bzw. Produktkategorien angeboten werden. Z. B. im Bereich Damenmode & Schuhe so was wie Wäsche & Strümpfe, Sport & Badebekleidung etc..
Diese Produktkategorien erscheinen wenn der Mauszeiger über die Sortimentsbezeichnungen fährt.

Interessant und in dieser Form noch nicht oft gesehen: Wenn der Layer mit den Sortimenten bzw. Warengruppen ausklappt, dann wird die Startseite im Hintergrund mit einem Schleier überzogen (siehe Abbildung).
Der Nutzer sieht die Inhalte der Startseite weniger deutlich, dafür sticht die Navigation regelrecht hervor. Ganz nette Idee finde ich. Der Nutzer will sich ja nun auf die Navigation und die dort angezeigten Rubriken fokussieren; das wird auf dieser Weise erleichtert.

Schade nur, dass die Warengruppen und Produktkategorien zum Teil alles andere als „nutzergerecht“ bezeichnet sind und die Navigation zudem in der Entscheidungsfindung kaum unterstützt.

Wie ist das gemeint und was kann man besser machen?

Versuche das man am Beispiel des Sortiments Damenmode & Schuhe zu verdeutlichen.

Sortiment Damenmode & Schuhe mit den zugeordneten Warengruppen, Produktkategorien und mehr... www.quelle.de (Stand Juli 2009)
Sortiment Damenmode & Schuhe mit den zugeordneten Warengruppen, Produktkategorien und mehr… www.quelle.de (Stand Juli 2009)

Bekleidung wäre doch grundsätzlich eigentlich eine dem Sortiment „Damenmode & Schuhe“ übergeordnete Bezeichnung, unter der dann eben auch Herrenmode fällt, oder?. Aus dem Kontext sollte sich für die meisten Nutzer erschließen, dass sie hier nur Damenbekleidung finden. Kleines Problemchen also, aber irgendwie verwirrend. Wohl als Abgrenzung und Ergänzung zur Kategorie Schuhe gedacht.

Aber wie ist das nun mit Wäsche & Strümpfe und Sport & Badebekleidung. Finde ich die nicht auch, wenn ich auf (Damenmode & Schuhe >) Bekleidung klicke? Offene Frage, wieder eine kleine Verwirrung beim Nutzer…

Große Größen – ganz nett eigentlich, da eine Art Filter. Aber auch hier die Frage: „Okay, wenn ich eine große Größe habe (weis eigentlich jeder ab wann eine Kleidergröße „groß“ ist?), dann brauch ich gar nicht in Bekleidung oder Wäsche & Strümpfe reingehen, denn das gibt’s dann ja nur kleine und Normalgrößen…, oder?“ Gute Frage, dritte kleine Unklarheit…

Und so häufen sich die wenn auch kleinen Unklarheiten und es wird schnell deutlich, dass hier durchaus Optimierungspotenzial besteht, man Nutzer mit der Navigation nicht voll und ganz zufrieden stellen kann.

Eindeutig ist die Kategorie Schuhe – keine Abgrenzungsschwierigkeiten. Gleiches gilt meines Erachtens auf für Arbeits- und Berufsbekleidung und Umstandsmode auch.

Wie kann man es nun aber besser machen?

So wie Otto.de zum Beispiel…

Sortiment Damen und die im Layer angezeigten Unterkategorien www.otto.de (Stand Juli 2009)
Sortiment Damen und die im Layer angezeigten Unterkategorien www.otto.de (Stand Juli 2009)

Was macht Otto.de gut?

Nicht alles, keine Frage… Aber dieser Layer verdeutlicht recht schnell, dass es auf Otto.de unterschiedliche Zugänge zum Sortiment Damenmode gibt, z. B. klassisch nach Produktkategorien von A-Z oder nach Themen. Zudem kommuniziert der Layer allen Besuchern welch breites Sortiment Otto.de im Bereich Damenmode aufzuweisen hat: Alle relevanten Kategorien werden sofort aufgeführt und sind größtenteils auch verständlich bezeichnet. Diese Layer-Navigation unterstützt den Nutzer in seiner Entscheidungsfindung deutlich besser als die von Quelle.de.

Man kann das natürlich noch besser machen, wie z. B. …
… habt ihr Tipps für „gute“ Layer-Navigationen auf Online-Shops, die verschiedene Einstiege ins Sortiment bieten und auf diese Weise den Nutzer in seiner Entscheidungsfindung unterstützen? Freue mich auf euere Linktipps.

6 Gedanken zu „Quelle.de – was kann man von der neuen Shop-Navigation lernen? (Teil 2)

  1. Pingback: Quelle.de – und was man aus dem Re-Launch lernen kann… (Teil 1) | usabilityblog.de

  2. Florian S.

    Vorneweg, die neue Navigation bei Quelle finde ich fast schon grauenhaft!

    1. Ein „mutiger Schritt“ den gesamten Content auszublenden, aber ganz ehrlich, wozu? Um zu zeigen, dass man ein DIV auf 100% legen kann? Hat für mich keinen Mehrwert. Die User stören sich m.E. daran

    2. Der Ansatz, in einem Vertikalen Foldout-Menu, nochmals eine horizontale Ebene ausklappen zu lassen ist doch wirklich lange vom Tisch. Noch dazu wenn, die technische Umsetzung nicht gut gemacht ist, tut sich der User sehr schwer, seine Maus in der gleichen zeile zu halten, um dann nach rechts ein hektisches Menü aus zu klappen. Bewegt man die Maus schräg, klappt ein anderes Menü ungewollt aus…
    Auch dass beim kurzen Verlassen des Menu-DIVs das ganze Menü sofort verschwindet ist unglücklich…

    3. Das das Ganze technisch unschön umgesetzt ist, sieht man auch daran, dass das sich das Sub-Menü beim „“ in der Höhe den Inhalten anpasst, das Sub-Menü bei „schnäppchen“ jedoch viel Weißfläche unterhalb der letzten Links hat …

    Nunja, aufgrund der Insolvenz können wir glaueb cih davin ausgehen, dass hier auch nicht großartig nachgefixed wird, aber wir werden sehen.

    >> Do’s & Dont’s von Nielsen anschaun!
    http://www.useit.com/alertbox/mega-dropdown-menus.html

    >> Designing Drop-Down Menus: Examples and Best Practices
    http://www.smashingmagazine.com/2009/03/24/designing-drop-down-menus-examples-and-best-practices/

    Das war’s auch schon,
    Flo

    Antworten
  3. Tobias

    Ich teile die Meinung der Vorredner nicht. Ich finde die Bedienbarkeit der Quelle-Navigation durchaus gut. Der Vorteil der Quelle-Navigation liegt aus meiner Sicht darin, dass sie eben nicht überladen ist und den Benutzer schnell auf die emotional gestalteten Kategorieseiten führt.

    In der Otto-Navigation finde ich zwar alle möglichen Kategorien direkt auf einen Blick, aber dadurch wird das ganze auch leicht unübersichtlich. Der Benutzer muss hier im Navigationsmenü nach dem Punkt erst suchen, den er ansteuern möchte.

    Einen deutlichen Nachteil in der Otto-Navigation sehe ich in den zwei Reihen der Hauptkategorien. Öffnet man das Menü für eine Kategorie aus der oberen Reihe, ist die untere Reihe komplett verdeckt. Ich muss erst das Menü verlassen, so dass es sich schließt, um die untere Kategoriereihe zu sehen. Bei der Quelle-Navigation gibt es dieses Problem nicht.

    Es sind halt zwei unterschiedliche Ansätze, die wohl beide ihre Vor- und Nachteile haben. Letztendlich müsste man mal einen A/B-Test machen, welcher besser funktioniert.

    Antworten
  4. Thorsten Wilhelm

    Hallo Manuela,
    vielen Dank für die positive Rückmeldung.
    Was würdest Du an dem von mir genannten Positiv-Beispiel von Otto.de verändern, anders machen? Deine Meinung dazu interessiert mich sehr. Nimmt doch das Thema Shop-Navigation aktuell wieder „an Fahrt auf“, kommt auf die Agenda beim Optimieren von Shops.
    Was ist da Deine Meinung, wie solltet man das besser machen?
    Freue mich auf Deine Rückmeldung.

    Antworten

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *