Webwissen: Navigation

Navigation, in a broader sense, can refer to any skill or study that involves the determination of position and direction. It can be called the “art of orientation”.* (Wikipedia, erweitert)

Was ist Navigation?

Mit Navigation – im weitesten Sinne – sollen zwei Ziele erreicht werden: Einen Überblick über den angebotenen Inhalt geben und gewährleisten, dass Nutzer, die für sie relevanten Inhalte, finden.
Doch wie sieht die perfekte Navigation aus? Wie schafft man es, beide Ziele zu erreichen? Ein Problem dabei ist, dass Navigation subjektiv wahrgenommen wird: Jeder Mensch hat andere Präferenzen und bevorzugte Strukturen für bestimmte Themen. Eine perfekte Lösung für alle ist unmöglich zu erreichen. Trotzdem gibt es einiges Wissenswertes und Dinge, die ihr anwenden könnt, um die Navigation zu und auf einer Seite zu optimieren. Die Navigationsleiste im Header, die oft mit dem Begriff „Navigation“ gemeint ist, wird dabei zunehmend unwichtiger.


Navigation beginnt „off-site“

Bevor ihr ein komplexes Navigationsmodell für eine Website entwickelt, sollte ihr euch fragen von wo die Nutzer dorthin kommen.
Navigation beginnt zumeist “off-site”, z.B. über Beiträge in sozialen Netzwerken oder in der Suchergebnisliste einer Suchmaschine. Dadurch landen Nutzer direkt auf den Inhalten, zum Beispiel auf einer Artikelseite in einem Shop oder auf einem Beitrag in einem Nachrichtenportal.
Es ist wichtig den Einstieg – z.B. den Social Post oder den Inhalt der Suchergebnisseite (oder SERP: Search Engine Result Pages) – so gut wie möglich zu gestalten, so dass der Nutzer auch dort landet, wo er es erwartet. Denn nur die Wenigsten kommen auf eine Seite, in dem sie die URL in das Browserfenster eintippen, oft beginnt die Nutzerreise woanders.



Was ist ein Social Post?
Ein Social Post ist ein im Social Web (z.B. Facebook oder Twitter) geteilter Inhalt, der häufig auf den Blogbeitrag einer Website verlinkt. Auch dort gibt es bereits die Möglichkeit den Nutzern eine gute Navigation zu bieten: Hier kommt es darauf an, dass der verlinkte Inhalt durch die richtigen Headlines und Texte möglichst anregend anmoderiert wird so dass der Nutzer ein klares Bild hat wo die Reise hingeht und eine informierte Entscheidung treffen kann.

Bildschirmfoto 2016-12-19 um 12.21.17
Ein Facebook-Post der netzstrategen, der auf ein Webwissen auf unserem Blog führt



Was ist ein SERP-Snippet?
SERP steht für Search Engine Result Page, also die Suchergebnisseite, die Google nach einer Suche anzeigt. Je nach Suchphrase kann sie ganz unterschiedlich aussehen. Das bekannteste ist das klassische SERP-Snippet nach organischer Suche:

Google Suchergebnis netzstrategen Facebook
Klassisches Suchergebnis: Titel, URL zur Seite und Beschreibung

Neben klassischen Suchtreffern kann das SERP-Snippet auch andere Infos anzeigen, wie zum Beispiel mit Rich-Snippets, Autorenbildern, Breadcrumb-Navigation und mehr (Gebt einfach „Wann ist Ostern 2017“ in die Suche ein). Mehr zum Thema SERPs und welche Möglichkeiten es noch gibt sie zu optimieren, erfahrt ihr in diesem Beitrag von Dominik Horn.


Navigation ist nicht nur am Anfang der Seite

Der Nutzeranteil, der tiefer in die Hauptnavigation einsteigt, ist sehr klein. Der Großteil kommt über die Google-Suche und Social-Posts, landet auf Inhalten und bewegt sich sofort durch den Beitrag oder das Angebot – ohne die Navigation im Header überhaupt zu nutzen.
Es ist also wichtig, dass die Inhalte darauf optimiert sind den Besucher weiter navigieren zu lassen, zum Beispiel durch Inline-Links, Schlagworte zu Rubriken oder Themen oder Artikel-Teaser aus verwandten Inhalten.



Bildschirmfoto 2016-12-13 um 11.41.37
Beispiel von www.theguardian.com: Artikelübersichtsseite mit Schlagworten zu Rubriken und Themen



Bildschirmfoto 2016-12-13 um 11.51.48
Beispiel von www.theguardian.com: Artikelseite mit inline Links zu verwandten Inhalten und meistgelesenen Artikeln


Analyse, Prototype, Test

Bei der Konzeption einer Menustruktur solltet ihr folgende Punkte berücksichtigen, da sie bei der Entscheidungsfindung enorm helfen: Eine Zielgruppenanalyse (Wer sind die Nutzer?), die Definition der Nutzerreisen (über welche Kanäle kommen die Nutzer?), die Webanalyse (zum besseren Verständnis der „Klickpfade“), die Definition der häufigsten Usecases (was wollen Nutzer auf der Seite (tun)?), eine Nutzungsanalyse und die Priorisierung der Navigationspunkte (Welche Punkte der Navigation werden am häufigsten genutzt und welche Begriffe funktionieren gut?) …
Auf Basis dieser Analysedaten könnt ihr dann einen Navigationsprototypen mit einer passenden Hierarchie und priorisierten Elementen aufbauen und so im Anschluss durch User-Testing feststellen ob und an welchen Stellen noch Optimierungsbedarf besteht.



Bildschirmfoto 2016-12-13 um 16.58.20
Beispiel von www.spiegel.de: Menustruktur mit fünf priorisierten Navigationspunkten, alle anderen befinden sich unter „Rubriken“



Bildschirmfoto-2016-11-30-um-13.58.16
Beispiel von www.bbc.de: „Progressively collapsing menu“: die meist genutzten Menupunkte stehen links. Je schmaler der Bildschirm wird, desto mehr Punkte wandern in das „Burger-Menü“



Fazit

Navigation im klassischen Sinne, also die Ansammlung von Elementen im Header, verliert an Bedeutung und verlagert sich immer mehr in den eigentlichen Content. Beim Aufbau der Navigation und der Aufbereitung der Inhalte ist es daher unbedingt notwendig, herauszufinden, was die Nutzer auf der Seite (am häufigsten) tun wollen und sich darauf zu fokussieren, diese use cases zu optimieren.


Quelle Titelbild: https://www.fastcompany.com/

Alle Beiträge von Doro

Unsere meistgelesenen Beiträge

Zwei Jahre Chromebook: Ein Erfahrungsbericht

Google Chromebook
|
Gute 25 Jahre PC-Nutzung - von Anfang an mit Windows. Dann raucht im wahrsten Sinne des Wortes mein teures und gar nicht so altes Lenovo-Notebook ab. Und ich bestelle mir einfach ein Chromebook und bin schneller weg aus der Windows-Welt, als ich es für möglich gehalten hätte. Zwei Jahre ist das nun her - und ich habe zwischendurch immer wieder über meine Erfahrungen mit dem Chromebook berichtet.