Web-Design-Trends: Mit intuitiver Navigation und informativen Mouseover-Effekten schnell ans Ziel

17. März 2010 von Katja Weingärtner

Zentraler Faktor für den Erfolg einer Website ist eine gute Usability – und damit auch eine intuitive Navigation. Findet ein Website-Besucher das, was er sucht? Wie schnell gelangt er ans Ziel? Welche Trends im Bereich Navigation haben sich in den letzten Monaten gezeigt? Wir zeigen einige Beispiele für Navigationsmöglichkeiten, Mouseover-Effekte, Teaser & Co.

Innovative Navigation

Erfahrungsgemäß sind es oft Verbesserungen im Detail, die zur besseren Nutzererlebnissen und zufriedeneren Usern führen. Es gibt mehrere interessante Ansätze, um falsche Klicks zu vermeiden und dem Nutzer zu helfen, sein Ziel möglichst schnell und intuitiv zu erreichen. Wir haben einige exemplarische Beispiele gesammelt.

Entega.de verwendet beispielsweise drei Hauptnavigationspunkte, die zugleich die drei inhaltlichen Bereiche der Website abbilden. Klickt man einen Bereich an, klappt dieser auf, wobei die anderen weiterhin sichtbar bleiben. Die Unterpunkte sind dann im jeweiligen Bereich platziert.

Dieses Beispiel ist durchaus interessant, aber es belegt ebenso, dass gutes Web-Design insbesondere im Zusammenhang mit Usability ein schmaler Grat ist: Wird durch die innovative Navigation auch die Nutzerfreundlichkeit verbessert? Verstehen vor allem wenig Internet-affine User diese Navigation intuitiv? Hier sind – auch ohne die Website einer Usability-Analyse unterzogen zu haben – Zweifel sicherlich zulässig, und solche Fragen muss sich jede gelaunchte Website natürlich gefallen lassen.

entega.de

Informative Mouseover-Effekte, Dropdown-Menüs und Teaser

Andere Websites nutzen die Navigation für die Darstellung weiterführender Inhalte bzw. von Detailinformationen: Durch den innovativen Einsatz von Mouseover-Effekten mit inhaltlichem Mehrwert soll der Nutzer schon vor dem Klick wissen, ob er sich auf dem richtigen Weg befindet.

Darüber hinaus haben vor allem Aufklappmenüs zuletzt eine spannende Entwicklung genommen: Immer häufiger werden sie genutzt, um einzelne Punkte gezielt besonders hervorzuheben. Auch Teaser-Boxen füllen heute Funktionen aus, die weit über die Darstellung von Links hinausgehen. Auf der Audi-Website öffnen sich beispielsweise in der Teaserbox „Konfigurator“ direkt Eingabefelder beim Mouseover, sodass der Nutzer einen Klick spart. Auffällig ist hier zudem die Schiebenavigation von der linken Seite.

Weitere gelungene Beispiele

Es ist erfreulich, dass immer mehr Unternehmen grundsätzlich nicht nur gesteigerten Wert auf intuitive, nutzerfreundliche Navigationskonzepte legen, sondern diese auch in Form von hochwertigen, originellen Design-Lösungen abbilden. Natürlich eignet sich nicht jeder Ansatz für jede Website, denn grundsätzlich muss beim Einsatz von innovativen Konzepten immer die Zielgruppe im Auge behalten werden: So kann beispielsweise eine dreidimensionale und animierte Navigation zwar sehr ästhetisch sein, stellt aber nicht in jedem Fall die geeignete Lösung dar und dürfte Nutzergruppen mit eher geringer Internet-Affinität überfordern.

Einige weitere innovative Beispiele für moderne Navigationslösungen, die für sich selbst sprechen:

mercedes-benz.de

whitevoid.com

Haben Sie Fragen zum Thema Web-Design? Benötigen Sie Unterstützung bei Web-Projekten oder bei der Modifikation Ihres Erscheinungsbilds im Internet? Bitte sprechen Sie uns an.

Weiterführende Informationen

Die Website von //SEIBERT/MEDIA/DESIGN
Navigationsmenüs: Trends und Beispiele
Experten-Interview: Was machen Web-Designer eigentlich genau?
Design-Auszeichnung: //SEIBERT/MEDIA/DESIGN erhält den iF-Award

Weitere Informationen zu Corporate Design

5 Reaktionen zu diesem Beitrag

  1. Web-Design-Trends: Was ist typisch für aktuelle Websites? | //SEIBERT/MEDIA Weblog

    [...] uns in den folgenden Artikeln ausführlicher und gehen z.B. auf die Zielgruppenorientierung, auf Navigation und Effekte, auf die Art und den Einsatz von Grafiken und auf besondere Features und Funktionen [...]


  2. Wann sind Akkordeon-Effekte auf Websites sinnvoll? | //SEIBERT/MEDIA Weblog

    [...] Web-Design-Trends: Mit intuitiver Navigation und informativen Mouseover-Effekten schnell ans Ziel [...]


  3. Test Verbindungssuche: Mit der Bahn von Frankfurt nach London | //SEIBERT/MEDIA Weblog

    [...] Website von //SEIBERT/MEDIA/DESIGN Web-Design-Trends: Mit intuitiver Navigation und informativen Mouseover-Effekten schnell ans Ziel Das Wo und Wann der User-Erwartungen Der Bestellvorgang: Was häufig schiefgeht und was User [...]


  4. Test Verbindungssuche: Mit dem Mietwagen von Wiesbaden nach Amsterdam (Sixt) | //SEIBERT/MEDIA Weblog

    [...] Website von //SEIBERT/MEDIA-Design <Weitere Artikel der Serie> Web-Design-Trends: Mit intuitiver Navigation und informativen Mouseover-Effekten schnell ans Ziel Das Wo und Wann der User-Erwartungen Der Bestellvorgang: Was häufig schiefgeht und was User [...]


  5. //SEIBERT/MEDIA Weblog » Blog Archiv » Design- und Usability-Trends im Suchprozess: Unser Fazit der Case Studies (Teil 1)

    [...] nach Amsterdam (Sixt) Verbindungssuche: Mit dem Flugzeug von Frankfurt nach Barcelona (Tui) Web-Design-Trends: Mit intuitiver Navigation und informativen Mouseover-Effekten schnell ans Ziel Das Wo und Wann der User-Erwartungen Der Bestellvorgang: Was häufig schiefgeht und was User [...]


Eine Antwort hinterlassen





//SEIBERT/MEDIA besteht aus den vier Kompetenzfeldern Consulting, Design, Technologies und Systems und gehört zu den erfahrenen und professionellen Multimedia-Agenturen in Deutschland. Wir entwickeln seit 1996 mit heute über 65 Mitarbeitern Intranets, Extranet-Systeme, Web-Portale aber auch klassische Internet-Seiten. Seit 2005 konzipiert unsere Designabteilung hochwertige Unternehmensauftritte und kommunikative Konzepte. Beratungen im Bereich Online-Marketing und Usability runden das Leistungsportfolio ab.

Zu unseren teils weltweit agierenden Kunden gehören u.a. Accor, Allianz, Atlas MTT, BAD, Deutsche Klinik für Diagnostik, Deutsche Post, Hitachi, Honda Motor, Hotel InterContinental, Institut Fresenius, Kabel Deutschland, Lufthansa, SAP, SGS AG, STA Travel, StepStone sowie viele andere große und kleine interessante Unternehmen.