Forum: NOF - Tutorials (185 anschauliche Tutorials zum Lesen und Nacharbeiten) > NOF-Navigation und CSS-Navigation
NOF-Navigation & ihre Einstellungen - Teil 3 - (Site-Navigation: Ebenenanzeige)
nettesekel:
Als nächstes möchte ich mich der Einstellung der Ebenen-Anzeige zuwenden. Über dieses Pulldownmenü gibt es verschiedene Einstellmöglichkeiten die ich euch einzeln vorstellen möchte.
Um dies möglichst anschaulich machen zu können, habe ich ein Beispielprojekt mit folgender Sitestruktur angelegt. In diesem Projekt habe ich nacheinander alle Einstellungen vorgenommen und jeweis für euch publiziert. So könnt ihr euch durch die Navigationsleisten klicken und genau sehen, wie sich die Navigationsleisten bei den jeweiligen Einstellungen verhalten.
Zu jeder Einstellung habe ich jeweils eine horizontale und eine vertikale Navigationsleiste eingefügt.
Zum besseren Verständnis befindet sich in den Beispielprojekten neben jeder Navigationsleiste ein Screenshot, der die vorgenommenen Einstellungen anzeigt.
Hier nochmal der Direktlink zu Siteansicht, so könnt ihr sie in einem Browsertab aufrufen und ggf. mit der Anzeige der Navigationsleiste vergleichen.
https://www.nof-community.de/Screenshots/Navi/Siteansicht.png
nettesekel:
Bei dieser Einstellung werden "zunächst" nur die Startseite und die Seiten der ersten Ebene angezeigt. Ob und wo eventuell eine zweite oder dritte Ebene aufrufbar ist, kann der Seitenbesucher auf Anhieb nicht erkennen.
Klickt man jedoch die Schaltfläche einer Seite an, welcher Unterseiten zugeordnet sind, so werden diese Seiten der zweiten Ebene mit in die Anzeige aufgenommen. (im Beispiel z.B. "Seite B" anklicken) Eine horizontale Navigation verbreitert sich hierbei um die zusätzlich eingeblendeten Schaltflächen der zweiten Ebene.
Für eine vertikale Navigation durchaus brauchbar, für eine horizontale Navi ist diese Einstellung so eher ungeeignet.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_ersteEbene/index.html
Ein wenig übersichtlicher wird es für den Seitenbesucher bezüglich der Unterebenen, wenn man zusätzlich die Klappleisten aktiviert.
Diese Einstellung ist mit zwei Häkchen auf dem zweiten Reiter der Navigationsleisteneigenschaften vorzunehmen. Ein entsprechender Screenshot befindet sich in der Beispielseite.
Hier klappt nun bei Mausberührung jeder Seite die über Unterseiten verfügt ein Klappmenü mit den jeweiligen Seiten auf.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_ersteEbene_klapp/index.html
nettesekel:
Etwas anders sieht es aus, wenn man bei Anzeige wieder die "Erste Ebene" auswählt und zusätzlich das Häkchen bei "Untergeordnete Seiten" entfernt.
Nun werden dauerhaft nur die Startseite und die Seiten der ersten Ebene angezeigt. Egal welche der Seiten man anglickt, die Navigationsleiste bleibt unverändert. Das Layout zerstören wir uns mit dieser Einstellung ganz bestimmt nicht, aber wie kommen unsere Seitenbesucher in die zweite und dritte Ebene?
Ohne eine zusätzliche Navigation würden unsere Seitenbesucher bei dieser Einstellung wohl nie zu den anderen Seiten finden.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_ersteEbene_ohneUnterseiten/index.html
Aktivieren wir zu dieser Einstellung zusätzlich noch die Klappleisten, dann haben wir dieses Problem gelöst.
Die Grundnavigation bleibt konstant stehen und verändert sich beim Seitenwechsel in keiner Weise und Unterseiten können über das Klappleistenmenü gfunden und aufgerufen werden.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_ersteEbene_ohneUnterseiten_klapp/index.html
nettesekel:
Wenn wir das Pulldownmenü der Anzeigeoptionen öffnen, ist die nächste Einstellmöglichkeit die Auswahl "Übergeordnete Ebene".
Bei dieser Einstellung werden die Startseite und alle Seiten der ersten Ebene in der Navigationsleiste angezeigt.
Es werden immer die aktuell aufgerufene Seite und deren übergeordnete Seite hervorgehoben dargestellt.
Klicke ich also die Seite B an, so wird die Schaltfläche der Seite B hervorgehoben, aber auch die Schaltfläche der Seite A, weil Seite A die Startseite ist und ihr alle Seiten der ersten Ebene untergeordnet sind.
Die Seiten der dritten und vierten Ebene sind bei dieser Einstellung nicht aufrufbar.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_uebergeordneteEbene/index.html
Um bei dieser Einstellung auch die anderen Ebenen für den Seitenbesucher zugänglich zu machen, müssen wir wieder den zweiten reiter der EP bemühen und die Klappleisten aktivieren.
Nun werden die anderen Ebenen bei mousover als Klappmenü dargestellt. Ruft man eine Seite aus Ebene 3 auf, so werden alle zugehörigen Seiten mit in der Hauptnavigation angezeigt. Auch hier würde ich wieder von der Verwendung als horizontale Navi abraten, da diese ständig in ihrer Breite variieren wird.
Gut nachvollziehen kann man diesen Effekt, wenn man im Beispielprojekt z.B. die Seite E1 aufruft.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_uebergeordneteEbene_klapp/index.html
nettesekel:
Die nächste mögliche Anzeige-Einstellung ist die "aktuelle Ebene".
Bei dieser Einstellung werden zunächst die Startseite und alle Seiten der ersten Ebene in der Navigationsleiste angezeigt. Klickt mal eine Seite an, welcher Unterseiten zugeordnet sind (z.B. Seite B), so werden die Unterseiten mit in die Anzeige der Navigationsleiste aufgenommen. Klickt man dann eine dieser Unterseiten an, also eine Seite der zweiten Ebene, dann werden nur noch die Startseite und die Seiten der zweiten Ebene in der Navigationsleiste angezeigt. Alle Seiten von Ebene 1 verschwinden dabei gänzlich aus der Navigation und man muss erst wieder die Startseite aufrufen um die Navigation für Ebene 1 zu sehen.
Ich persönlich finde das etwas verwirrend und würde mich nicht zwingend für diese Einstellung entscheiden.
Gut nachvollziehen kann man das Ganze wenn man auf der folgenden Beispielseite erst die "Seite B" anklickt und dann die "Seite B1". Nun versucht bitte mal Die "Seite D" aufzurufen. ;)
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_aktuelleEbene/index.html
Auch bei dieser Einstellung könnte man wieder die Klappleisten dazu nehmen.
An der grundsätzlichen Anzeige der Ebenen ändert sich dadurch zwar nichts, aber der User braucht aus der zweiten Ebene heraus nicht erst zur Startseite zu wechseln um dann zur Ebene 1 zu gelangen, weil er diesen Umweg durch Nutzung des Klappmenüs vermeiden kann.
Beispielprojekt:
http://demos.nof-community.de/Navigation/Site_aktuelleEbene_klapp/index.html
Navigation
[0] Themen-Index
[#] Nächste Seite
Zur normalen Ansicht wechseln