In diesem Beitrag zeigen wir dir, was du bei der Entwicklung deines Webangebotes, bezüglich der Struktur und den Navigationselementen beachten solltest.
Grundsätzliches zur Informationsarchitektur
Grundlage für die Konzeption eines User-zentrierten Webauftritts ist die Erstellung einer geeigneten Informationsarchitektur. Eine Informationsarchitektur beschreibt, wie Content auf einer Website sortiert ist und wie der User darauf zugreifen kann. Dabei ist es sehr wichtig, die Bedürfnisse der User mit einzubeziehen und zu verstehen, welche Information Priorität geniesst.
Die ideale Informationsarchitektur kann durchaus von der, für die Institution logisch erscheinenden, Ordnung abweichen. Bei grösseren Websites sollte darauf geachtet werden, dass eine Information nicht nur über einen vorgegebenen Weg erreicht werden kann, sondern dass auch innerhalb des Contents Verknüpfungen angeboten werden. Besonders beliebt ist der Einsatz von Footern, am unteren Rand der Website, welche nochmals die wichtigsten Links der Website darstellen.
Eine bewährte Methode zur Erstellung einer Informationsarchitektur ist das Card-Sorting. Bei diesem Verfahren werden User gebeten, Karten, die mit den vorgesehen Menüpunkten beschriftet sind, in eine für sie sinnvolle logische Struktur zu bringen. Card-Sorting ist auch innerhalb des Entwicklungsteams eine geeignete Methode.
Bei der Konzeption und Entwicklung von Online-Angeboten sollte immer beachtet werden, dass User die gewünschte Information, mit möglichst wenig Aufwand finden wollen. Deshalb ist es wichtig, nicht zu viel zu wollen und sich auf die Kernbereiche und die wesentlichen Funktionalitäten zu konzentrieren, um die Website nicht zu überladen.
- Achte bei der Gestaltung von Menüs darauf, dass die einzelnen Menüpunkte entweder keine oder mehrere Untergliederungspunkten aufweisen. Menüs mit nur einem Untergliederungspunkt sollten möglichst vermieden werden.
- Überforderung oder langes Suchen führt bei den Usern zu Frustration. Dies kann dazu führen, dass sie die Website in Zukunft vermeiden werden.
Verständlichkeit und Konsistenz
Die Struktur einer Website sollte möglichst einfach gehalten sein und den Bedürfnissen und Erwartungen der User entsprechen. Aus Sicht der User sind in der Regel flache Hierarchien mit mehr Elementen auf einer Ebene einer tiefen Hierarchie vorzuziehen. Allerdings sollte auf jeder Ebene die Anzahl Elemente überschaubar sein.
Wichtig ist, dass die Nutzenden schnell eine Vorstellung über den Aufbau der Website gewinnen können. In diesem Kontext ist vor allem die Einordnung der einzelnen Seiten bzw. Bereichen in die Navigationsstruktur von Bedeutung. Kann von Usern ein Unterpunkt nicht vernünftig eingeordnet werden, sollte man sich einerseits überlegen, wie wichtig der Unterpunkt ist und ob er ggf. auf einer höheren Navigationsebene platziert werden sollte. Bei einem sehr wichtigen Punkt bietet es sich ggf. auch an, ihn auf der Startseite unabhängig der Hauptnavigation aufzuführen. Andererseits sollte geprüft werden, ob die gewählte Bezeichnung aus Anwendersicht verständlich ist.
Ein weiter wichtiger Faktor für das Zurechtfinden auf einer Website ist deren Konsistenz. Es muss darauf geachtet werden, dass alle Seiten und Unterseiten in der gleichen Art und Weise bedient werden können und dieselben Elemente/Funktionalitäten stets in der gleichen Form dargestellt werden.
Positionierung von Menüs
Es empfiehlt sich, das Hauptmenü bzw. die Hauptnavigation deiner Website entweder links oder oben zu positionieren. Da dies bei den meisten Websites der Fall ist, ist diese Positionierung für die User eine Gewohnheit und sie kommen dementsprechend damit am besten zurecht.
Menüstrukturen
Eine Navigation sollte möglichst intuitiv, aussagekräftig und eindeutig sein. In der Regel ist dabei eine flache Hierarchie einer tiefen vorzuziehen. Als Faustregel kann man sagen, dass nicht mehr als 3 bis max. 4 Ebenen verwendet werden sollten. Pro Hierarchieebene bzw. für jeden Menüpunkt sollten nicht mehr als sieben Auswahlmöglichkeiten verwendet werden. Die Navigation sollte durchgängig konsistent gehalten sein. Bezeichnungen und die Reihenfolge der Menüpunkte sollten daher immer gleich belassen werden.
Von jeder Unterseite aus sollte zudem eine Rückkehr zur Startseite möglich sein. Eine beliebte Möglichkeit ist die Hinterlegung des Logos mit einem entsprechenden Link.
Die User sollten jederzeit wissen, wo innerhalb eines Webauftritts sie sich gerade befinden. Dies kann z.B. mit Hilfe einer Breadcrumb-Navigation erreicht werden. Mit Hilfe einer Breadcrumb-Navigation können User zudem auch wieder schnell zu vorgängig besuchten bzw. in der Hierarchie höher stehenden Seiten zurückkehren.
Orientierung durch Pfadangaben
Zudem empfiehlt es sich, den Menüpunkt, in welchem man sich gerade befindet, hervorzuheben, um den Usern eine Orientierungshilfe zu geben.
Verknüpfungen/Hyperlinks
Alle auf der Website vorhandenen Hyperlinks müssen unmittelbar als solche erkennbar sein. Hierfür eignen sich klassischerweise Unterstreichungen und die Gestaltung in Form von Buttons. Grafiken werden hingegen in der Regel nicht als Links erkannt, weshalb in diesem Fall ggf. über Beschriftungen auf die Verfügbarkeit eines Links hingewiesen werden muss. Allenfalls können als Hinweis auf Links zusätzlich auch ALT-Tags bzw. Tooltips hilfreich sein.
Bei sämtlichen Verknüpfungen sollte zudem das Ziel bzw. die Funktion (z.B. Download, Mailkontakt) möglichst eindeutig angegeben sein. Hierfür bietet es sich an die unterschiedlichen Arten von Links mit entsprechenden Icons zu kennzeichnen. Diese Vorgehensweise bietet sich auch für die Kennzeichnung von Verweisen auf externe Angebote an.
Bereits besuchte Links sollten in einer anderen Farbe dargestellt werden, so dass für User direkt ersichtlich ist, welche Seiten sie bereits besucht haben und wohin sie noch navigieren könnten.
Seiteninterne Links sollten stets im aktuellen Browserfenster geöffnet werden. Das Öffnen in einem neuen Fenster ist aus Usability-Gesichtspunkten generell nicht unbedingt zu empfehlen. Diese Vorgehensweise eignet sich lediglich für Verweise auf anderen Dateiformate (z.B. PDF) sowie für Links auf externe Angebote.
Beschriftungen von Links und Buttons
Buttons, Links und Symbole müssen eine eindeutige Beschriftung erhalten. Nur dadurch ist die Navigation einer Website auch gut bedienbar. Andernfalls kann die Website zwar logisch aufgebaut sein, aber die Nutzenden klicken aufgrund der missverständlichen oder unverständlichen Beschriftung nie auf einen Button, der sie zur gewünschten Information führen würde.
Solche Terminologie-Probleme können am besten durch Usability-Tests mit den Usern bzw. Befragungen von Aussenstehenden identifiziert werden.
Sitesearch, Index und Glossar
Abgesehen von sehr kleinen Websites sollte Usern stets eine seiteninterne Suche zur Verfügung gestellt werden. Die Funktionsweise der Sitesearch sollte sich an der primären Zielgruppe und deren typischen Informationsbedürfnisse orientieren. Wichtig ist, dass die Suchresultate angemessen sortiert werden und ausreichend Information beinhalten, um Usern eine zielgerichtete Auswahl zu ermöglichen. Weitere Hinweise zu Suchfunktionen sind unter Funktionalitäten zu finden.
Sitemap
Um Usern aufzuzeigen, wie eine Website organisiert ist, empfiehlt es sich eine Sitemap anzubieten. Auf diese Weise wird Nutzenden ebenfalls ein schneller und direkter Zugang zu einzelnen Bereichen bzw. Unterseiten ermöglicht. Die Sitemap sollte möglichst auch die aktuelle Position der User wiedergeben (z.B. Sie sind hier).
Sitemaps sollten alle Verzweigungen der Hierarchie anzeigen. Allerdings kann es bei umfangreichen Webauftritten erforderlich sein, aus Platzgründen nur eine bestimmte Anzahl von Hierarchieebenen anzuzeigen.