Sanftes Redesign mit neuer Push Navigation

von in Responsive Design

Wir haben letzte Woche ein sanftes Redesign dieser Website aufgeschaltet. Neben gestalterischen Korrekturen und Optimierungen im Code stand dabei vor allem die Umsetzung einer neuen Navigation im Vordergrund. Die Navigation ist ein zentrales Element im Responsive Webdesign, das einen enormen Einfluss auf die Benutzerfreundlichkeit einer Website hat.

Während der Neugestaltung unseres Corporate Designs und unserer Website  im Sommer 2014 hatten wir uns für eine „Overlay Navigation“ entschieden. Diese neue, simple Navigationsform passte aus ästhethischen Gründen gut in unser Konzept.

Alte Overlay NavigationAlte Overlay Navigation

Wir erhielten viel positives Feedback zur Neugestaltung. Doch einzelne ehrliche User beschwerten sich darüber, zu wenig den Überblick zu haben und sich in den Tiefen der Seitenstruktur zu verlieren. Die Overlay Navigation erlaubt es nicht, innerhalb des Overlays mehrere Stufen mit Unterseiten anzuzeigen. Dies funktioniert gut für einfache strukturierte Websites mit wenigen Seiten, zum Beispiel bei Agenturen die sehr lange Seiten mit Parallaxeffekten einsetzen. In unserem Fall war es keine optimale Lösung.

Wir haben im Herbst diverse Navigationsansätze recherchiert, geprüft und wieder verworfen, weil sie unseren Anforderungen nicht entsprachen. Wir wollten eine Naivgation, die

Uns schwebte eine „Off Canvas“ Navigation vor, die sich nicht in die Website einfügt, sondern diese quasi zur Seite schiebt. „Off Canvas“ Navigationen wurden schon vor einer Weile von Luke Wroblewski und von Jason Weaver angedacht. Sie wurden bisher vorwiegend in Mobile Apps eingesetzt. Wie so oft hat auch Mary Lou inspirierende CSS- und jQuery-Experimente für verschiedene „Slide and Push“ Off Canvas Navigationen publiziert.

Um genau das umzusetzen, was uns vorschwebte, gab es einige Herausforderungen zu lösen. Unser bisheriger Programmiercode war inkompatibel mit diesem Ansatz, der den ganzen Körper der Website (<body>…</body> Tags im HTML) verschiebt. Wir nahmen dies zum Anlass, den Code komplett zu überarbeiten und zu vereinfachen. Zudem haben wir auch diverse Details im Design angepasst und optimiert. Nach endlosen Tests auf diversen Endgeräten und Browsern waren wir endlich soweit, unsere neue Push Navigation in Betrieb zu nehmen.

Push Navigation von Hadorn AGNeue Push Navigation

Der Rahmen um die Website soll diese klar und eindeutig von der Navigation im geöffneten Zustand trennen. Er steht als Symbol für klare und transparente Abgrenzung. Auf uns wirkt er als erfrischende Abrundung unseres Full Screen Designs. Wir freuen uns, dass unser <body> nun eine neue Navigation und einen Rahmen hat.

Das Redesign unserer Navigation hat uns viel Spass gemacht. Es hat uns in diesem Fall ermöglicht, die gesamte Websitestruktur zu vereinfachen. Wir werden weiterhin verschiedene Formen von Navigationskonzepten mit Responsive Design in Kundenprojekten einsetzen, wahrscheinlich auch erweiterte Formen der Overlay Navigation.

„Nach dem Redesign ist vor dem Redesign“ – wir planen bereits wieder die nächsten Anpassungen. Wir freuen uns sehr über jedes ehrliche Feedback zu unserem Webdesign.

Kommentare öffnen -->

Schliessen

Kommentare

Loading Disqus Comments ...

Peter Hadorn (49) ist Inhaber und Managing Partner der Hadorn AG. Er ist seit 2005 im digitalen Marketing tätig und setzt sein Know-how in Online Marketing, E-Commerce, SEO und Webdesign für seine Kunden ein. Wenn er offline ist verbringt er seine Freizeit am liebsten mit seiner Familie, in der schönen Schweizer Natur, oder am Meer.

Telefon: 033 / 336 63 63 · · Skype · LinkedIn · Google+ ·

Unverbindliche Anfrage

Schliessen

Webagentur Schweiz

Hadorn AG

Wir sind eine Webagentur E-Commerce Agentur Kommunikationsagentur Webdesign Agentur Internetagentur SEO Agentur Marketingagentur WordPress Agentur digitale Agentur PrestaShop Agentur Werbeagentur WooCommerce Agentur interaktive Agentur Shopware Agentur Online Marketing Agentur OpenCart Agentur für Kunden in den Regionen Bern, Basel, Zürich, Luzern, Aarau, Olten, Solothurn, Thun, Interlaken und der ganzen Schweiz.

Wir kreieren individuelle Lösungen in den Bereichen Webdesign, E-Commerce, SEO, Online Marketing und mehr.

Wir ❤ was wir tun, die digitale Arbeit ist unsere grosse Passion.

Tel. +41 (0)33 / 336 63 63
E-Mail hallo@hadornag.ch

Schliessen

Schliessen