Horizontales (Haupt-) Menü unter Usability Gesichtspunkten

[Gunther]

Hallo Forumsgemeinde,

ich hätte gerne Mal eure Meinungen zum Thema gewusst:

Ich überlege wie ich die Navigation auf einer Website gestalten soll.
Kürzlich bin ich über den folgenden Beitrag gestolpert.

Dort werden ja zumindest viele der möglichen Alternativen vorgestellt. Unter den übrigen layouttechnischen Gesichtspunkten hätte eine horizontale Navigation durchaus ihre Vorteile. Bisher hat mich immer nur das begrenzte Platzangebot und die fehlende Möglichkeit alle Menüpunkte (auch die Sublevel) anzeigen zu können, davon abgehalten.

Was meint ihr dazu? Reicht bspw. ein 2-zeiliges horizontales Menü (ohne Drop-Down) bei dem sich die tiefergehenden Links erst jeweils auf der entsprechenden Seite befinden aus?

Welche Menüform (generell) bevorzugt ihr und warum, oder wovon ist sie für euch abhängig?

Für eure fundierten Antworten meinen besten Dank!

Gruß Gunther

[Ingo Turski]

Hi,

Ich überlege wie ich die Navigation auf einer Website gestalten soll.
Kürzlich bin ich über den folgenden Beitrag gestolpert.

Zwar durchaus interessant, aber leider werden hier wirklich sinnvolle Alternativen gar nicht berücksichtigt und untersucht, weil Voraussetzung für deren Menü ist, daß alle Menüpunkte auf einer einzigen Seite verfügbar sein sollen. Dies ist naturgemäß unübersichtlicher, als wenn man Submenüs nur in ihren Bereichen verfügbar macht.

Interessant finde ich, daß die "Yahoo"-Methode genauso gut abschneidet wie DropDowns. Dies könnte daran liegen, daß die erste Methode einfacher zu bedienen ist und die andere dennoch intuitiv zu bedienen ist, da dieses Prinzip von vielen Programmoberflächen gewohnt ist. Probleme machen Menüs, wo ein Klick keine neue Seite öffnet, sondern lediglich die zuvor noch vorhandene Übersichtlichkeit stört.

Unter den übrigen layouttechnischen Gesichtspunkten hätte eine horizontale Navigation durchaus ihre Vorteile.

Das trifft aber nur dann zu, wenn mehrere Inhalts"spalten" vorhanden sind, weil dann eine seitliche Navigation den Anzeigebereich zu sehr einschränken kann.

Bisher hat mich immer nur das begrenzte Platzangebot und die fehlende Möglichkeit alle Menüpunkte (auch die Sublevel) anzeigen zu können, davon abgehalten.

Du bist auch der Meinung, daß immer die komplette Navigation verfügbar sein soll? Dies ist aber  meist kontroproduktiv. Ein Besucher kann sich bei bis zu etwa 7 Links auf den ersten Blick orienieren. Mehr erschwert bereits das Zurechtfinden. Wenn er hierunter nun die passende Rubrik gefunden hat, dann erwartet er, diese Anklicken zu können und weitere Informationen zu erhalten. Übel, wenn diese nur aus weiteren ausklappenden Links bestehen - dann muß er sich völlig neu orientieren. Erleichert wird diese Neuorientierung, wenn bereits das Überfahren mit der Maus die Submenüs öffnet. Aber dennoch kann es sein, daß der Besucher von seinem ursprünglichen Klickvorhaben abgebracht wird und das Interesse verliert.

Was meint ihr dazu? Reicht bspw. ein 2-zeiliges horizontales Menü (ohne Drop-Down) bei dem sich die tiefergehenden Links erst jeweils auf der entsprechenden Seite befinden aus?

Ja, auf jeden Fall.

Welche Menüform (generell) bevorzugt ihr und warum, oder wovon ist sie für euch abhängig?

Aus praktischen Gründen würde ich dies wie gesagt davon abhängig machen, ob der Anzeigebereich des Inhalts bereits durch Seitenelemente eingeschränkt ist bzw. wenn dies nicht der Fall ist, dann kann eine seitliche Navigation genau hierzu eingesetzt werden und

• zu breite Zeilen vermeiden
• das vertikale Scrolling etwas reduzieren

freundliche Grüße
Ingo

[Gunther]

Hi Ingo,

Ich überlege wie ich die Navigation auf einer Website gestalten soll.
Kürzlich bin ich über den folgenden Beitrag gestolpert.
Zwar durchaus interessant, aber leider werden hier wirklich sinnvolle Alternativen gar nicht berücksichtigt und untersucht, weil Voraussetzung für deren Menü ist, daß alle Menüpunkte auf einer einzigen Seite verfügbar sein sollen. Dies ist naturgemäß unübersichtlicher, als wenn man Submenüs nur in ihren Bereichen verfügbar macht.

Das stimmt wohl. Allerdings finde ich, dass das auch von der Tiefe der Website und der Gesamtanzahl an "Ästen" abhängt. Wenn es bspw. 4 Toplevel Menüpunkte mit je einem Sublevel gibt, fände ich eine Verfügbarmachung aller Links durchaus noch vertretbar. Wenn's mehr wird, sieht die Sache natürlich anders aus.

Interessant finde ich, daß die "Yahoo"-Methode genauso gut abschneidet wie DropDowns. Dies könnte daran liegen, daß die erste Methode einfacher zu bedienen ist und die andere dennoch intuitiv zu bedienen ist, da dieses Prinzip von vielen Programmoberflächen gewohnt ist.

Auf jeden Fall sind (horizontale) Drop-Down Menüs nicht so problematisch wie (vertikale) Fly-Out Menüs, bei denen häufig ein ungewolltes Verlassen der Hoverfläche vorkommt.

Probleme machen Menüs, wo ein Klick keine neue Seite öffnet, sondern lediglich die zuvor noch vorhandene Übersichtlichkeit stört.

Das stimmt wohl.

Unter den übrigen layouttechnischen Gesichtspunkten hätte eine horizontale Navigation durchaus ihre Vorteile.
Das trifft aber nur dann zu, wenn mehrere Inhalts"spalten" vorhanden sind, weil dann eine seitliche Navigation den Anzeigebereich zu sehr einschränken kann.

Bisher hat mich immer nur das begrenzte Platzangebot und die fehlende Möglichkeit alle Menüpunkte (auch die Sublevel) anzeigen zu können, davon abgehalten.
Du bist auch der Meinung, daß immer die komplette Navigation verfügbar sein soll?

Nein, nicht generell. Wie oben schon gesagt, ist das für mich von mehreren Faktoren abhängig. Ein häufiges Problem bei einzeiligen horizontalen Menüs ist aber meiner Erfahrung nach, dass der Besucher unter einem Menüpunkt etwas ganz anderes erwartet, als der Seitenersteller dort platziert hat, oder etwas, von dem er erwartet es tiefer auf der Seite zu finden, nicht finden kann, weil er nicht weiß, unter welchem Oberbegriff es sich versteckt.

Dies ist aber  meist kontroproduktiv. Ein Besucher kann sich bei bis zu etwa 7 Links auf den ersten Blick orienieren. Mehr erschwert bereits das Zurechtfinden.

Soweit so gut - das wäre also die max. Anzahl an Top-Level Links in einem Menü (egal in welcher Form).

Wenn er hierunter nun die passende Rubrik gefunden hat, dann erwartet er, diese Anklicken zu können und weitere Informationen zu erhalten. Übel, wenn diese nur aus weiteren ausklappenden Links bestehen - dann muß er sich völlig neu orientieren. Erleichert wird diese Neuorientierung, wenn bereits das Überfahren mit der Maus die Submenüs öffnet.

Das ist genau der Punkt, den ich weiter oben schon angesprochen habe, was imho ein Gegenargument dazu ist. Denn ich meine mich erinnern zu können, dass es ja nicht zuletzt auch hier im Forum immer wieder heißt:"Der Surfer ist auf der Suche nach Informationen, und je schneller er die finden kann, ...". Da ist es doch schlecht, wenn ich als Besucher erst eine neue Seite laden muss, um dann festzustellen, dass ich falsch bin. Also nächste Seite laden, und so weiter (jetzt extra etwas überspitzt dargestellt).

Aber dennoch kann es sein, daß der Besucher von seinem ursprünglichen Klickvorhaben abgebracht wird und das Interesse verliert.

Ja, ja... der Besucher das geheimnisvolle Wesen ;-)

Was meint ihr dazu? Reicht bspw. ein 2-zeiliges horizontales Menü (ohne Drop-Down) bei dem sich die tiefergehenden Links erst jeweils auf der entsprechenden Seite befinden aus?
Ja, auf jeden Fall.

Danke für diese klare Aussage!

Welche Menüform (generell) bevorzugt ihr und warum, oder wovon ist sie für euch abhängig?
Aus praktischen Gründen würde ich dies wie gesagt davon abhängig machen, ob der Anzeigebereich des Inhalts bereits durch Seitenelemente eingeschränkt ist bzw. wenn dies nicht der Fall ist, dann kann eine seitliche Navigation genau hierzu eingesetzt werden und

• zu breite Zeilen vermeiden
• das vertikale Scrolling etwas reduzieren

(Nachfrage: Wie soll eine seitliche Navigation das vertikale Scrollen reduzieren?)

Also ich habe mich für ein 2-Spalten Layout entschieden (bei 3 Spalten überwiegen imho die Nachteile evt. Vorteile). Zu breite Zeilen vermeide ich durch die Verwendung von max-width.

Da jetzt je nach Seite die Seitenspalte aber auch "Randbemerkungen" (marginal notes) oder Ähnliches enthalten soll, und es eine Todsünde wäre, eine von Seite zu Seite unterschiedliche Navigation zu wählen, bleibt mir in dem Fall halt nur eine horizontale Navigation (Alternative wäre das 3-Spalten Layout mit einer Navi-Spalte - möchte ich aber nicht).

Auf jeden Fall danke ich dir für deine Antwort und verbleibe mit freundlichem Gruß & besten Wünschen für einen angenehmen Abend!

Gunther

[Ingo Turski]

Hi,

Auf jeden Fall sind (horizontale) Drop-Down Menüs nicht so problematisch wie (vertikale) Fly-Out Menüs, bei denen häufig ein ungewolltes Verlassen der Hoverfläche vorkommt.

Das dürfte übrigens zwei Gründe haben:
1. ist es ungewohnter als Pulldown-Menüs und
2. ist es nicht so einfach ersichtlich, daß man nicht auf kürzestem Wege diagonal einen Menüpunkt anwählen kann. Habe ich selbst schon bei Computerlaien beobachten können, daß einfach das Verständnis für den eingeschränkten Linkbereich fehlt und nicht realisiert wird, daß dieser diagonal verlassen wird. Hier habe ich versucht, zumindest mit einem Pfeil etwas zu helfen.

Ein häufiges Problem bei einzeiligen horizontalen Menüs ist aber meiner Erfahrung nach, dass der Besucher unter einem Menüpunkt etwas ganz anderes erwartet, als der Seitenersteller dort platziert hat, oder etwas, von dem er erwartet es tiefer auf der Seite zu finden, nicht finden kann, weil er nicht weiß, unter welchem Oberbegriff es sich versteckt.

Das ist dann aber meist ein inhaltliches Problem, daß die Rubriken nicht verständlch genug bezeichnet sind.

"Der Surfer ist auf der Suche nach Informationen, und je schneller er die finden kann, ...". Da ist es doch schlecht, wenn ich als Besucher erst eine neue Seite laden muss, um dann festzustellen, dass ich falsch bin. Also nächste Seite laden, und so weiter (jetzt extra etwas überspitzt dargestellt).

Abhilfe kann aber auch eine Sitemap schaffen. Diese kann sogar noch übersichtlicher die Seitenstruktur abbilden und auch kurze Erklärungen statt nur Linktexe enthalten.

(Nachfrage: Wie soll eine seitliche Navigation das vertikale Scrollen reduzieren?)

Nur ein klein wenig, nämlich um die Höhe der Navigation. ;-)
Zu tragen kommt das aber erst dann richtig, wenn sie noch fixiert ist.

freundliche Grüße
Ingo

[Gunther]

Hi,

Auf jeden Fall sind (horizontale) Drop-Down Menüs nicht so problematisch wie (vertikale) Fly-Out Menüs, bei denen häufig ein ungewolltes Verlassen der Hoverfläche vorkommt.

Das dürfte übrigens zwei Gründe haben:

1. ist es ungewohnter als Pulldown-Menüs und
2. ist es nicht so einfach ersichtlich, daß man nicht auf kürzestem Wege diagonal einen Menüpunkt anwählen kann. Habe ich selbst schon bei Computerlaien beobachten können, daß einfach das Verständnis für den eingeschränkten Linkbereich fehlt und nicht realisiert wird, daß dieser diagonal verlassen wird. Hier habe ich versucht, zumindest mit einem Pfeil etwas zu helfen.

Sehr gut gemachte Seite. Eine Sache empfinde ich jedoch als störend. Bei meiner Fensterbreite von 1024px wird die Startseite ohne vertikale Scrollbar dargestellt. Hover ich jetzt aber über den vorletzten Link ("Qualifizierung & Arbeit"), verursacht das aufgehende Fly-Out Menü eine eben solche, was den Inhalt nach links "hüpfen" lässt.
Ein weiterer Nachteil dieser Methode liegt imho darin, dass ich gerade bei kleineren Fenstern erst nach unten scrollen muss, um einen Menüpunkt zu erreichen, und wenn ich das nicht vor dem Hovern getan habe, verliere ich ihn dabei. Mir ist schon klar, dass es keine "perfekte" Navigation gibt - hat halt alles Vor- & Nachteile.

Ein häufiges Problem bei einzeiligen horizontalen Menüs ist aber meiner Erfahrung nach, dass der Besucher unter einem Menüpunkt etwas ganz anderes erwartet, als der Seitenersteller dort platziert hat, oder etwas, von dem er erwartet es tiefer auf der Seite zu finden, nicht finden kann, weil er nicht weiß, unter welchem Oberbegriff es sich versteckt.

Das ist dann aber meist ein inhaltliches Problem, daß die Rubriken nicht verständlch genug bezeichnet sind.

Stimmt, aber gerade bei horiz. Anordnung ist der Platz ja doch recht begrenzt und viele Worte in der deutschen Sprache doch recht lang ;-)

"Der Surfer ist auf der Suche nach Informationen, und je schneller er die finden kann, ...". Da ist es doch schlecht, wenn ich als Besucher erst eine neue Seite laden muss, um dann festzustellen, dass ich falsch bin. Also nächste Seite laden, und so weiter (jetzt extra etwas überspitzt dargestellt).

Abhilfe kann aber auch eine Sitemap schaffen. Diese kann sogar noch übersichtlicher die Seitenstruktur abbilden und auch kurze Erklärungen statt nur Linktexe enthalten.

Auch hier kann ich dir voll zustimmen. Ich persönlich bin ein Freund der Sitemap als Startseite einer Präsenz.

(Nachfrage: Wie soll eine seitliche Navigation das vertikale Scrollen reduzieren?)

Nur ein klein wenig, nämlich um die Höhe der Navigation. ;-)
Zu tragen kommt das aber erst dann richtig, wenn sie noch fixiert ist.

ahh ..., achso! ;-)

Gruß Gunther

[Ingo Turski]

Hi,

Hier habe ich versucht, zumindest mit einem Pfeil etwas zu helfen.

Sehr gut gemachte Seite. Eine Sache empfinde ich jedoch als störend. Bei meiner Fensterbreite von 1024px wird die Startseite ohne vertikale Scrollbar dargestellt. Hover ich jetzt aber über den vorletzten Link ("Qualifizierung & Arbeit"), verursacht das aufgehende Fly-Out Menü eine eben solche, was den Inhalt nach links "hüpfen" lässt.

Danke für den Hinweis. Da mußt Du wohl ziemlich viele Browserleisten nutzen, denn mir war das bisher bei keiner Fenster- oder Schriftgröße aufgefallen. Habe ich gefixed.

Ein weiterer Nachteil dieser Methode liegt imho darin, dass ich gerade bei kleineren Fenstern erst nach unten scrollen muss, um einen Menüpunkt zu erreichen, und wenn ich das nicht vor dem Hovern getan habe, verliere ich ihn dabei.

Stimmt zwar, aber auch das tritt hier ab "normalen" 1024er-Fenstern noch nicht ein. Und zur Not kann man ja auch den Punkt der Hauptnavigation klicken (oder den IE ohne JS nutzen;-)
Ich habe auch schonmal drüber nachgeadacht, die Dynamik deaktivierbar zu machen.

freundliche Grüße
Ingo