Start Relaunch

Neu eingekleidet – Relaunch bei Otto

22

Relaunch Otto

Seit gestern ist der neue Online-Shop der Marke Otto live. Hier die auffälligsten Änderungen. Statt Tastenoptik bilden nun freistehende Begriffe die weiterhin horizontal angelegte Hauptnavigation. Bei Rollover erscheinen jeweils großflächige Layer wie man sie bereits von Ebay oder Ikea kennt. Darin enthalten sind nicht nur die klassischen Begriffe der zweiten Navigationsebene, sondern es finden sich hier auch optionale Einstiegsmöglichkeiten wie z.B. über das Alter oder über Modestile. Bei mir (Mac/Firefox) dauert es jeweils eine Weile, bis die üppig befüllten Layer aufklappen, weshalb die Haptik im Vergleich zum Vorgänger nicht ganz so angenehm erscheint. Der Nutzen solch eines Direkteinstieges in tiefer gelegene Ebenen steht aber außer Frage. Optisch ist sie ebenfalls ansprechender. Einige Begriffe wie z.B. “Wohnen” haben eine eigene Farbwelt erhalten. Bei der Vielzahl der Hauptnavigationspunkte war es eine gute Entscheidung nicht zwanghaft jedem eine eigene Farbe zu spendieren. Im linken Bereich – etwas runtergerutscht – befindet sich weiterhin die Subnavigation.

Die Gesamtbreite ist um stattliche 190 Pixel auf 980 Pixel angewachsen. Dadurch wirkt der neue Auftritt sehr luftig und angenehm. Dominantes Stilelement sind flächige Rechtecke. Bei Rubriküberschriften, Produkt-Teasern und auch beim Aktivzustand der Hauptnavigation kommen Quadrate bzw. rechteckig hinterlegte Flächen zum Einsatz. Mitunter bewirkt der Kontrast zwischen “leichter” Hauptnavigation und “schwerem” Content eine gewisse Unausgewogenheit, was sich aber aufgrund der Vielzahl an Seiten kaum bei jeder Ansicht vermeiden lässt.

Als primäre Schrift kommt in Überschriften und in der Hauptnavigation die “Century Gothic” zum Einsatz. Das verleiht dem Gesamtaufbau durchaus Eleganz. Auch die Dropdowns der zahlreichen Filtermöglichkeiten bekommen per CSS einen eigenen Stil. Außerdem ist aufgefallen: Zoom-Ansichten der Bilder auf Detailseiten öffnen sich noch im alten Look. Hin und wieder werden Teaser-Bilder verzerrt dargestellt. Beim Durchgang der Seiten war die Performance noch eher mau. Vielleicht nur Anlaufschwierigkeiten. Ansonsten très chic.

Danke an Kim für den Hinweis in den Kommentaren

Ähnliche Beiträge

dummy

12

14

22 Kommentare

  1. Also ich persönlich finde Layer-Navigationen, bei denen die erste Ebene 2 Zeilen einnimmt ziemlich problematisch. Versuch doch mal, von dem Punkt Damen (Hover) zum Baumarkt zu kommen… Ziemlich wenig durchdacht, finde ich. Schick ja, Usability: Keine.

  2. Insgesamt ganz schick aber extrem viel Grafiktext – oft hätte man auch Systemtext verwenden können anstatt die Arial mit im JPG zu speichern.
    Die Typo in der Navi und im Content ist übrigens die Avantgarde. Die Century kommt nur im Shopping-Erlebnis-Teaser vor.

  3. Bei mir (Mac/Firefox) sind alle Layer der Hauptebene sofort da, auch die üppig befüllten.
    Was mich auch eher stört, wie .chris bereits anmerkte, ist die Tatsache, dass durch diese Layer teile der Navigation überdeckt werden. Das hätte man anders lösen können.
    Ansonsten erscheint mir der Auftritt auf den ersten Blick recht aufgeräumt.
    Nicht schlecht!

  4. Welche Layer? Ohne JavaScript sehe ich da keine Layer. Warum immer wieder davon ausgegangen wird, man habe JS aktiviert, ist mir ein Rätsel. Die Online-Welt besteht nicht nur aus DAUs.

    Am besten ist der Link zu Bücher/CD/DVD (haben die nur eine CD und eine DVD im Angebot? Warum kein Plural?), die Seite bleibt bei mir nämlich abgesehen von der oberen Navigation weiß.

    Als Zielgruppe peilt Otto wohl den eher kurzsichtigen Teil der Bevölkerung an…bei der Riesenschrift.

  5. Und noch was. Auf dieser Seite werden diverse Auszeichnungen aufgelistet u.a. auch “Otto.de ist TÜV-geprüfter Online-Händler für mehr Sicherheit im Internet!” Funktioniert ohne JavaScript leider auch nicht. Ziemlich peinlich, wenn man mit “mehr Sicherheit” wirbt, aber JS voraussetzt.

  6. @nojavascript: für leute wie dich, die ohne js, flash und co unterwegs sind, hat otto ja auch noch ne eigene seite aufgesetzt: http://www.einfach.otto.de/ finde ich vorbildlich.

    CD und DVD sind ja nunmal Abkürzungen. Da darf man sich das Plural s dann gerne denken auch wenns meistens so gesprochen wird.

  7. Die Zielgruppe der Seite dürfte tatsächlich jenseits der 40er Marke liegen.
    Dementsprechend ist große Schrift nicht nur sinnvoll, sondern nötig.
    Die Nutzer des Internets werden immer älter und die Denke dieser Tatsache gerecht zu werden hat scheinbar noch immer nicht alle Entwickler / Designer erreicht. Schade eigentlich.

    Der Kommentar mit mehr Sicherheit zu werben aber Javascript einzusetzen ist wie Äpfel mit Bananen zu vergleichen. Für vertrauenswürdige Seiten (zu denen ich Otto mal einfach zähle.. von denen gehen zumindest sicher keine Crossdomain Scripting attacken aus) aktiviere ich auch ohne Bedenken Javascript.
    Javascript kann durchaus zu einer guten und sinnvolle Erweiterung des Look & Feel einer Seite beitragen – ich gebe dir aber Recht, dass es wenn möglich nur unobstrusive eingesetzt werden sollte: Eine Navigation, die ohne Javascript nicht funktioniert ist konzeptionell und aus Usability-Gesichtspunkten ein katastrophaler Fehler.
    Dennoch geht es bei dem Prädikat des TÜVs augenscheinlich um die Sicherheit des Servers. Was der Kunde aus eigener Unwissenheit/Unachtsamkeit auf seinem Computer zulässt ist sein eigenes Problem und kann sicher nicht TÜV geprüft werden :)

  8. Ohweh, was für ein Schröffel. (Der Relaunch)

    Ich kann dem Beitrag und in Teilen den Kommentaren hier nicht folgen, aber schön der Reihe nach:
    Achim: Immer noch das Problem mit dem Lineal? Ich verwende schon ne Weile keinen Mac mehr, erinner mich aber blass, dass es da auch ein Bildschirmlineal gibt. Wo nimmst Du 980px her? Ich seh hier 1200 Pixel Breite, was mir schön dämlich einen Scrollbalken in den Browser zaubert.
    Oder versteh ich Dich flasch?
    Layer seh ich mit und ohne Javascript gar keine, wo sollen die konkret sein?
    Marcel: einfach.otto ist ja wohl ein “vorbildlicher” Scherz, siehe Kommentar von Felix dazu
    Felix: vertrauenswürdige Seiten? Mhh? So vertrauenswürdig, wie etwa ausgezeichnete Banking-webseiten. Dann is ja gut ;)

    Ich kann dem Otto-Dingens rein garnix abgewinnen, (visuell) unstrukturiert hingeklatschter Krempel, Markup, dass einem schlecht wird, egal was man tut, ständig steht man vor einer Barriere (Javascript/ Alt-attribute usw.), aus meiner Sicht ist das ein klarer Fall von: “hätte man sich sparen können”, möchte nicht wissen, was der Dreck gekostet hat.

  9. Ich finds alles zu groß mit zu viel weißer Fläche. Das alte Design war viel praktischer, man muss jetzt mehr scrollen und hat weniger infos auf derselben Fläche.

Kommentieren

Folgende HTML-Elemente können verwendet werden: <b> <i> <img src="meineurl"> <a> <blockquote>