Oktober 21, 2009

Eine Ampel in Seattle, Washington zeigt grünes Licht über einer schmutzigen Straße mit Fahrradwegsymbolen. Auf dem Asphalt haben sich Pfützen gebildet.

Effektive Navigation im Webdesign

Je nach inhaltlicher Ausrichtung und Publikum der Website gibt es verschiedene Möglichkeiten eine Navigation einzurichten.

Mögliche Navigationslinien

1.) Die Ein-Linien Navigation . Ein Beispiel für ein einfaches Thema oder eine Präsentation:
(Der User navigiert anhand von einem vorgegebenen Pfad. Diese Art der Benutzerführung hat sich in der Praxis bei logischen Abfolgen oder einfachen Themen bewährt.)

Die Navigation erfolgt nach einem vorgegebenen Pfad.

2.) Zentrale Navigation (Verschachtelte Navigation)
(Von einer Startseite ausgehend kann der User wählen, welche Seiten er weiter besuchen möchte. Er hat mehrere Möglichkeiten zur Auswahl.)

Von einer Startseite aus gibt es mehrere Auswahlmöglichkeiten

3.) Netz Navigation
Seiten sind komplett untereinander vernetzt. Jede Seite kann dabei eine mögliche Startseite sein. Diese Art der Navigation hat für versierte User viele Vorteile, da durch die weitreichende Vernetzung gezielt bestimmte Informationen angesprungen werden. Unbedarfte User sind aber schnell überfordert und empfinden aufgrund der Fülle an Informationen eine Art Streß. Wenn es sich nicht um überaus komplexe Website handelt (z.B. Wikipedia) wiederhole ich lieber an entsprechender Stelle nochmal kurz einen Satz von einer anderen Seite anstatt intern komplett alles zu verlinken.

In der Netznavigation gibt es keinen "Anfang" und kein "Ende".

4.) Such Navigation
Der Besucher ruft über eine Abfragemaske eine auf seiner Anfrage basierte generierte Seite ab) Die Informationen werden bedarfsgerecht geliefert. Eine solche Informationsgewinnung bietet natürlich ein Höchstmaß an Flexibilität. Ein großer Nachteil ist jedoch, daß der User sich selbst im klaren sein muß, was er sucht. Dies erfordert aktive Anstrengung.

suchbegriff

Bei den anderen Navigationsmöglichkeiten bekommt er jeweils mehrere Vorschläge zur Wahl. Hier muß er selbst aktiv werden. In der Praxis ist Ihr Besucher bereits aktiv geworden um den Weg zu Ihnen zu finden. (Über die URL, einen Suchbegriff oder einen Link) Es geht vor allem darum seine Erwartung zu kennen und bestmöglich zu erfüllen und ihn nicht mit Auswahlmöglichkeiten zu verwirren.

Orientierung anhand der Site-Navigation

Eine Navigationsstruktur ist grundlegend für jede Website, die aus mehreren Seiten besteht. Sie muß so einfach und intuitiv wie möglich zu bedienen sein, denn mit Ihrer Hilfe soll der User selbstständig über die Website navigieren. Im Idealfall behält der Besucher den Überblick und sieht gleichzeitig zu jedem Zeitpunkt, an welcher Stelle er sich gerade aufhält. Eine einfache und beliebte Möglichkeit über die Navigation zu zeigen, wo man sich gerade aufhält ist es beispielsweise, den Link zu Highlighten.

Die Position wird über das Menü angezeigt

Pfadanzeigen, die sogenannten „Breadcrumbs“ (Brotkrumpen) helfen bei verschachtelten Menüs und großen Websites den Überblick zu behalten. Der Name Brotkrumpen kommt vom Märchen „Häsel und Gretel“. Die beiden Kinder markieren Ihren Pfad um sich nicht zu verirren, indem Sie alle paar Schritte einen Brotkrumpen fallen lassen. Anders als im Märchen futtern im Netz keine Tiere Ihre Markierungen weg und die User können jederzeit erkennen, wo sie sich in der Site-Struktur befinden und gezielt einzelne Schritte zurückspringen oder weitergehen.

Breathcrumb Navigation

Intuitive Navigation im Webdesign

Grafik- und Webdesign muß klar, einfach und leicht zu verstehen sein. Das ist die Essenz von gutem Design. Jedes Haus würde einstürzen, wenn man es auf weiches Fundament baut. Gimmicks können also sinnvollerweise erst dazukommen, wenn die Basis solide steht. Das Navigationsmenü und damit die Auswahl der Möglichkeiten sollte allerdings auffallen und sich optisch soweit von der Seite absetzen, daß Sie gut wahrgenommen wird. Jedoch ohne abzulenken. Die Navigation ist lediglich Mittel zum Zweck. Kein Selbstzweck. Sie muß als dezentes Werkzeug zur Verfügung stehen und auf keinen Fall die eigenen Inhalte dominieren. Da gehört viel Fingerspitzengefühl dazu, denn gleichzeitig muß das Menü soweit auffallen, daß es intuitiv wahrgenommen wird oder idealerweise Spaß macht. Wichtig ist hier eine klare Abgrenzung zwischen den Bereichen. Das Festlegen von einzelnen Farbwiedergaben für unterschiedliche Bereiche kann hilfreich sein.

Website Bereiche können durch Farben symbolisiert werden.

Die Benennung der “Buttons”

Wichtig ist natürlich eine klare, sinnvolle und beschreibende Benennung der einzelnen Navigationselemente. Idealerweise sollte man einzelne Worte verwenden oder sogar Piktogramme. (Der User muß sofort erkennen was sich hinter dem Button verbirgt) Keiner hat Lust über einen Button nachzudenken, bevor er klickt. Wenn man einmal klickt und keine zufriedenstellende Antwort auf sein Interesse findet kann es bereits zu spät sein. Es geht darum die relevanten Informationen möglichst schnell zu finden. Konzentrieren Sie sich daher auf das wesentliche.

Über den Autoren

Stephan Bender

Meine Aufgabe besteht darin Qualität zu visualisieren und die Kommunikation von Menschen und Marken zu verbessern, damit die Botschaften so geschärft werden, dass sie bei der Zielgruppe einen optimalen Eindruck hinterlassen kann.

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}

Weitere Artikel:

Subscribe now to get the latest updates!