Alle Web­­site-Navi­­ga­­tio­­nen auf einen Blick

Eine über­sicht­li­che und leicht ver­ständ­li­che Web­site-Navi­ga­tion ist ent­schei­dend für eine posi­tive User-Expe­ri­ence. Navi­ga­tio­nen sind das funk­tio­nale Leit­sys­tem einer Web­site. Sie schaf­fen Ori­en­tie­rung und sind für den Nut­zer das zen­trale Steue­rungs­werk­zeug. Da sie aber auch das Bran­ding des Online­auf­trit­tes ent­hal­ten, sind sie somit auch wich­ti­ges Gestal­tungs­ele­ment.
 

„Die rich­tige Wahl des Navi­ga­ti­ons­typs ist zuerst eine tech­ni­sche Ent­schei­dung.“

 
Bei der Wahl der pas­sen­den Navi­ga­tion sollte der Webdesigner oder Ent­wick­ler ganz klar nach dem Prin­zip „Form fol­lows Func­tion“ ent­schei­den und die aktu­elle bzw. zukünf­tige Sei­ten­struk­tur als Maß­gabe für das pas­sende Web­site-Menüs neh­men. Man unter­schei­det zwei Grund­ty­pen von Navi­ga­tio­nen:

Mobile Hea­der

Auf­grund der tech­ni­schen Ein­schrän­kung durch Größe und Touch-Mecha­nik gibt es für mobile Navi­ga­tio­nen nicht viele Alter­na­ti­ven. In der Regel sind sie auf das Bran­ding (Logo) inklu­sive Bur­ger-Menü redu­ziert. Sie unter­schei­den sich in der Nut­zung darin, ob sie sti­cky, fest am obe­ren Rand ver­an­kert, oder non-sti­cky sind und nach oben mit dem Con­tent weg­scrol­len. Der Klick auf den Bur­ger öff­net ent­we­der ein Off-Can­vas-Menü von der Seite oder ein bild­schirm­fül­len­des Can­vas-Menü über der Seite.
Palliative Care Netz Harburg
Klas­si­scher “sti­cky” Mobile-Hea­der mit Bur­ger-Menü

DESK­TOP-TOP-HEA­DER HORI­ZON­TAL

Lippold Sealing Technologies
Desk­top-Hea­der mit Bran­ding und klas­si­schen, hori­zon­ta­len Menü­punk­ten
Aus Sicht der Nut­zer­er­fah­rung die bekann­tere Vari­ante, die sich platz­spa­rend quer am obe­ren Brow­ser­fens­ter­rand befin­det. Den Top-Hea­der gibt es 2 unter­schied­li­chen Haupt-Aus­füh­run­gen. Ein­mal mit klas­sisch, hori­zon­tal ver­teil­ten Navi­ga­ti­ons­punk­ten und ein­mal mit Bür­ger­menü, wie man es auch von mobi­len Inter­faces kennt. Bei den neben­ein­an­der ange­ord­ne­ten Navi­ga­ti­ons­punk­ten kön­nen Unter­sei­ten per Maus­klick über Aus­klapp- oder per Mou­seo­ver als Flowout-Unter­me­nüs ange­zeigt wer­den. Die Luxus­aus­füh­rung von Flowout-Menüs sind die soge­nann­ten Megamenüs, die nebst Unter­sei­ten als Text­link auch Module wie Gale­rien oder Ban­ner ent­hal­ten kön­nen.

 

  • Aus Nut­zer­sicht die „gelernte“ Vari­ante
  • Schont platz­spa­rend das Web­de­sign
  • Kann als sti­cky hea­der fixiert wer­den
  • Anzahl der Menü­punkte in der breite begrenzt

DESK­TOP-SIDE­BAR VER­TI­KAL

Die ver­ti­kale Side­bar ist weni­ger ver­brei­tet und eher auf Blog­ar­chi­ven im Ein­satz. Eine, meist auf der lin­ken Seite des Brow­sers, fixierte und farb­lich-abge­setzte Sei­ten­leiste, in der die Menü-Punkte unter­ein­an­der ange­ord­net sind. Auch hier gibt es zwei Vari­an­ten: Ein­mal mit offe­nen, unter­ein­an­der ange­ord­ne­ten Menü­punk­ten und ein­mal mit Bur­ger-Navi­ga­ti­on­s­pa­nel, das ein Off-Can­vas oder bild­schirm­fül­len­des Can­vas-Menü öff­net.
Die Wikingerschänke
Ver­ti­kale Side­bar mit Brand, Auf­klapp-Menü und zahl­rei­chen Wid­gets im Säu­len­fuß
  • per­ma­nent sicht­bar
  • Viele Navi­ga­ti­ons­punkte mög­lich
  • Platz für viele Wid­gets
  • Unter­menü nur als Auf­klapp-ver­sion mög­lich
  • Nimmt optisch viel Platz ein
  • Kommt als Navi­ga­tion eher sel­ten zum Ein­satz
War die­ser Bei­trag hilf­reich?
Wir unter­stüt­zen Sie gerne bei Ihrem nächs­ten Pro­jekt. Sen­den Sie uns ein­fach Ihren Kon­takt mit einer kur­zen Beschrei­bung.
SAG’
HALLO!
PROJEKTANFRAGE
Super, Sie haben bei Ihrem Projekt an uns gedacht. Vielen Dank! Beschreiben Sie kurz, worum es geht, damit wir ein gutes Feedback geben können. Wir melden uns in Kürze zurück. Bis bald!
Von Ihnen im Formular eingegebene Daten speichern und verwenden wir ausschließlich zur Bearbeitung Ihrer Anfrage. Ihre Daten werden verschlüsselt übermittelt. Wir verarbeiten Ihre personenbezogenen Daten im Einklang mit unserer Datenschutzerklärung.
Impressum

//

Datenschutz

DANKE.

Wir haben ihre Anfrage erhalten und melden uns umgehend.