Konventionen der Webnavigation

Eine einheitliche Navigation erleichtert das Bewegen auf der Website. Navigationselemente sollten daher auf allen Webseiten in gleicher Weise verwendet werden. Dabei ist das Nutzen von verbreiteten und allgemein bekannten Navigationsmechanismen angebracht. Diese sollten am oberen oder linken Seitenrand angeordnet werden, um zu gewährleisten, dass bei allen Bildschirmgrößen und Browser-Einstellungen die Navigationselemente sichtbar und benutzbar sind.
Stand 30.05.2011

Inhaltsübersicht:

  1. Navigationsbereiche - Utilities und Sektionen
  2. Scannen der Website
  3. Interne und externe Verweise

Navigationsbereiche - Utilities und Sektionen

Nutzer erwarten die Hauptnavigation am linken Rand, die obere linke Ecke sollte für einen Verweis zur Startseite genutzt werden. Anders ist es mit einem Hinweis auf Umfragen. Dieser wird am rechten Rand und vertikal mittig erwartet.

Eine persistente Navigation (auch: globale Navigation) ist ein Satz von Navigationselementen, die mit einem einheitlichen Aussehen und mit einer gleichbleibenden Funktionsweise auf jeder Webseite am gleichen Platz wiederkehren. Ausnahme kann die Homepage sein und auf Formular-Seiten kann sie unnötig ablenken.

Steve Krug unterscheidet zwei Navigationsbereiche - Utilities und Sektionen. Utilities (dt. Dienstprogramme) sind Verweise zu den wichtigsten Elementen einer Website, die nicht Teil der inhaltlichen Hierarchie sind. Sie bestehen aus der Website-Kennung, einem Home-Button (dt. Schaltfläche) und einer Hilfsnavigation. Die Website-Kennung enthält das Logo und teilweise auch die Unternehmensbezeichnung. Das Logo wird in unseren Breitengraden oben links erwartet und häufig als Verweis auf die Homepage realisiert. Da diese Variante noch nicht bei allen Nutzern bekannt ist, sollte zusätzlich über einen Home-Button ein Verweis auf die Startseite angeboten werden. Ein barrierefreies bzw. barrierearmes Webdesign zeichnet sich dadurch aus, möglichst viele Eventualitäten zu berücksichtigen und alle Nutzer so gut wie möglich zu unterstützen. Die Hilfsnavigation enthält z.B. Verweise auf Kontakt, Suche, Hilfe, Sitemap und Impressum. Sektionen beinhalten die Hierarchie-bildenden Navigatoren: Die Hauptnavigatoren (auch: primäre Navigation) als oberste Ebene der Website-Hierarchie sowie die Unternavigation (auch: sekundäre Navigation) mit pro Hauptnavigator wechselnden Einträgen.

Navigationsbereiche

Bildbeschreibung "Navigationsbereiche": Die Navigation kann in zwei Bereiche unterteilt werden, Utilities und Sektionen. Utilities sind der Home-Button (Startseiten-Verweis), die Site-Kennung (Logo, Slogan) und die Hilfsnavigation (Kontakt, Suche, Hilfe, Sitemap, Impressum). Sektionen setzen sich aus der primären Navigation (Hauptnavigation) und der sekundären Navigation (Unternavigation) zusammen).

Meist ist die Abbildung der Sektionen als horizontale Navigation im oberen Bereich einer Webseite oder als vertikale Navigation im linken Seitenbereich realisiert. Die horizontale Navigation kann aber auch als Hauptnavigation und die vertikale ergänzend als Unternavigation eingesetzt werden.

Seitenanfang

Scannen der Website

Auswahlmöglichkeiten müssen klar und eindeutig formuliert sein, firmenspezifische Abkürzungen können z.B. schnell zu Verwirrung führen. Der Nutzer "scannt" eine Website - er überfliegt die Inhalte auf der Suche nach etwas, das für ihn interessant ist, in etwa dem Gesuchten entspricht oder als Verweis weiterführt. Mit Fokus auf diesem Ziel verschwimmen alle restlichen Inhalte vor seinem Auge - das Scannen der Website soll ausschließlich die gesuchte Information zum Vorschein bringen, das Gesehene hängt von dem momentanen Gedanken ab. Nutzer folgen i.d.R. dem erstbesten, passend erscheinenden Verweis. Führt das nicht zum gewünschten Erfolg, so wird per Scan die nächstbeste Möglichkeit gesucht.

Der Umfang, inwieweit Nutzer vor der Aktivierung eines Verweises die Wirkung und erwartete Reaktion abwägen, ist abhängig von Stimmung, Zeitdruck und Vertrauen des Nutzers in die Website. Vergleichbar ist dieses Vorgehen mit einem alltäglichen Beispiel: Die wenigsten Menschen nehmen sich die Zeit, Bedienungsanleitung zu lesen - sie versuchen ohne Anleitung das jeweilige Ziel zu erreichen. Genauso ist das Vorgehen auf der Website, was dazu führt, dass Nutzer oftmals auf eine Art und Weise durch die Website navigieren, die keineswegs dem beabsichtigten Weg des Designers entspricht. Wenn ein Weg gefunden wurde, wird meist kein besserer gesucht. Diese Strategie neigt zu Ineffizienz und Fehleranfälligkeit, kann jedoch durch eine sinnvoll gestaltete Struktur und Navigation kompensiert werden: der Nutzer findet die gesuchten Inhalte besser, versteht das Gesamtangebot eher, lässt sich auch gerne auf abweichende Themenseiten leiten und fühlt sich wohl auf der Website.

Seitenanfang

Interne und externe Verweise

Verweise (engl. Links) verknüpfen Webseiten sowie deren Inhalte und ermöglichen damit dem Nutzer eine schnelle Navigation. Generell sind drei Verweisarten zu unterscheiden: seiteninterne Links (Querverweis auf Inhalt innerhalb desselben Dokumentes), site-interne Links (Verweis auf eine andere Webseite innerhalb der Website) und externe Links (Verweis auf eine Webseite einer anderen Website). Durch ein entsprechendes Icon vor dem Verweis, z.B. einen Pfeil, erhält der Nutzer einen graphischen Hinweis auf das Ziel des Verweises. Diese Gestaltungsmöglichkeit sollte vor allem für externe Verweise genutzt werden, um den Nutzer auf das Verlassen der eigenen Website hinzuweisen.

Ein guter Linktext, die als Verweis gekennzeichneten Worte, hilft dem Nutzer bei der Auswahl seines nächsten Schritts und führt zu einer höheren Bewertung bei der Ranking-Vergabe von Suchmaschinen (siehe Link-Popularity). Bei Verweisen im Fließtext lässt sich ein etwas umfangreicherer, aus mehr als einem Wort bestehender Linktext leicht realisieren, in der eigentlichen Navigation stößt dieses Vorgehen jedoch schnell an seine Grenzen. Es stehen jedoch verschiedene Eigenschaften des Verweis-Elementes zur Verfügung, die eine alle Seiten zufriedenstellende Möglichkeit bieten, verschiedene Beschreibungsvarianten zu hinterlegen (siehe Verweise).

Weiterführende Literatur:

eResult GmbH:
Symbol für 'Artikel im Portable Document Format (PDF) verfügbar'
Nutzergerechte Gestaltung von Homepages,
http://www.eresult.de, Datei vom 13.12.2004
Krug, Steve:
Buchdeckel Don't make me think!
Don't make me think! Web Usability - Das intuitive Web, Seite 40 ff. sowie Seite 60 ff.,
mitp-Verlag, Bonn, 1. Auflage 2002 (Mediendesign),
ISBN 3826608909
Erlhofer, Sebastian:
Buchdeckel Suchmaschinen-Optimierung
Suchmaschinen-Optimierung, Seite 179 sowie Seite 182,
Galileo Computing, Bonn, 1. Auflage 2005 (Galileo Press),
ISBN 3898426203
Alkan, Saim Rolf:
Buchdeckel Texten für das Internet
Texten für das Internet. Ein Praxisbuch für Online-Redakteure und Webtexter, Seite 115 ff.,
Galileo Press, Bonn, 2. aktualisierte und erweiterte Auflage 2004 (edition PAGE),
ISBN 3898424936

Seitenanfang