Navigation auf den Webseiten

Navigieren oder besser leiten Sie den Leser mit Hilfe der Menüs, des Brotkrumenpfades und Teasern durch Ihren Webauftritt.

Das Corporate Design der TU Darmstadt verwendet zur Navigation verschiedene Bereiche:

  • Die Metanavigation
  • Das Hauptmenü
  • Das Untermenü (nur klassisch)
  • Die Subnavigation (nur Responsive)
  • Die Brotkrumennavigation bzw. Brotkrumenpfad

Alle Möglichkeiten der Navigation in einem Webauftritt werden in der Struktur von FirstSpirit festgelegt.

Weiterhin gibt es die Möglichkeit, den Nutzer über sogenannte Content-Navigation zu Seitenbereichen zu führen. Hierzu wurden mit dem Responsive Design vermehrt Elemente hinzugefügt (Teaser, Boxen etc.). Diese können direkt auf der Seite im Inhalt mittels Absatzvorlagen genutzt werden.

Responsive Beispiel

Klassisches Beispiel

Metanavigation

Im responsiven Design finden Sie ganz oben als erstes die Metanavigation mit dem Schnelleinstieg, dem Sprachwechsler, der Suche und der Anmelemöglichkeit.
Diese Metanavigation können Sie nicht verändern.

Schnelleinstieg
Wird zentral gepflegt und bietet dem Leser die Möglichkeit schnell zu einem Fachbereich, einer zentralen Einrichtung oder einer wichtigen Themenseite zu gelangen.

Sprachwechsler (Deutsch/Englisch)
Der Wechsel in eine andere Sprache ist nur möglich, sollte die jeweilige Seite übersetzt worden sein (siehe übersetzen des Webauftritts).
Dieser kann auch auf Anfrage hin vom Webteam für einen Auftritt komplett ausgeblendet werden.

Suche
Hiermit können Sie direkt auf den Seiten des Auftritts nach Inhalten suchen.

Anmelden
Manche Bereiche können zugriffsgeschützt sein. Um diese öffnen zu können, melden Sie sich über diesen Verweis an.
Falls Sie angemeldet sind, erscheint hier stattdessen Ihre TU-ID.

Das Hauptmenü

Das Hauptmenü ist die oberste inhaltliche Menüleiste in Ihrem Webauftritt. Sie befindet sich oberhalb des Bühnen- bzw. Headerbildes und enthält alle Hauptmenüpunkte.
In der Struktur von FirstSpirit sind dies die Menüebenen, welche direkt unterhalb des Hauptordners „www.xyz.tu-darmstadt.de“ (dies entspricht der URL des Webauftrittes) des Auftrittes angesiedelt sind.

Klassisches Design
Hier befindet sich im Flyout-Menü nur eine weitere Ebene, welche dann im Untermenü unten links auf den Seiten fortgeführt wird.

Responsive Design
Hier befinden sich im Flyout-Menü alle weiteren Ebenen. In der Desktop-Variante bis zur 4. Ebene, anschließende Ebenen werden in der Subnavigation fortgeführt und in der mobilen Ansicht alle weiteren Ebenen.

Die verschiedenen Menüebenen in FirstSpirit und auf der Webseite

Hinweis

Im Responsive Design werden nur die ersten vier Menüebenen auf der obersten Ebene im Hauptmenü dargestellt. Achten Sie daher möglichst darauf nie mehr als vier Ebenen direkt unter der www-Ebene anzulegen.

Das Untermenü (nur klassisch)

Das Untermenü wird im klassischen Design in der linken Spalte der Webseiten dargestellt.
Je nachdem, welcher Hauptmenüpunkt angeklickt wurde, werden im Untermenü die Menüpunkte angezeigt, die unterhalb dieses Hauptmenüpunktes liegen. Die Bezeichnung des Hauptmenüpunktes bildet dabei die Überschrift des Untermenüs.

In der Struktur entsprechen die Untermenüpunkte den Menüebenen, die in der Baumstruktur unterhalb der Menüebene des angeklickten Hauptmenüpunktes liegen. Die Untermenüebenen können in bis zu 6 Ebenen verschachtelt werden.

Die Subnavigation (nur Responsive)

Die Subnavigation wird nur in der Desktop-Variante der responsiven Webseite angezeigt. Diese startet automatisch mit der 5. Menüebenentiefe.

Sie kann jedoch bei Bedarf bereits früher, ab der 2. Ebenentiefe, manuell in den Metadaten einer Menüebene aktiviert werden (siehe Screenshot).

Beachten Sie dabei, dass die Menüpunkte dann nicht im Hauptmenü abgebildet werden.

Auf die mobile Ansicht hat dies keinen Einfluss.

Subnavigation in Metadaten aktivieren

Hinweis

Beachten Sie bitte, dass nicht alle Seitentypen über die Subnavigation verfügen! Diese kann nur auf Standardseiten ausgegeben werden.

Die Brotkrumennavigation

Die Brotkrumennavigation bzw. der Brotkrumenpfad wird auf der Webseite links direkt unterhalb des Bühnen-/Headerbildes angezeigt. Sie gibt den Pfad der Verschachtelung in der Menünavigation wieder. Durch Klicken auf einen der Einträge kann der Leser wieder zu einer übergeordneten Menüebene zurück springen.

Die Brotkrumennavigation wird automatisch aus der Struktur gebildet. Diese kann jedoch auch durch Hinzufügen von Einträgen in den Metadaten auf der www-Ebene des Auftritts beeinflusst werden.