Navigation

Inhalt Hotkeys
Universitäts­rechen­zentrum
Corporate Design

Hinweise zum Corporate Design für Webseiten

Im Zuge der Weiterentwicklung des Corporate Design der TU Chemnitz wurde 2014 der Online-Auftritt neu gestaltet (siehe Rektorrundschreiben 08/2013).

Richtlinien zur Strukturierung eines Webangebotes

Der Webautor steht vor der Aufgabe, die darzustellenden Informationen logisch zu strukturieren, d. h. auf einzelne Webseiten aufzuteilen und diese für den Leser sinnvoll in eine Menüstruktur nach obigen Vorgaben anzuordnen. Diese Struktur sollte möglichst schon vor der Umsetzung mit dem Inhaltsverantwortlichen abgesprochen werden.

Für einige Webseiten-Typen gibt es Empfehlungen hinsichtlich der Strukturierung des Menüs:

Für die Strukturierung von Webseiten eines Angebotes (z. B. einer Professur, eines Projektes oder eines Bereiches) gelten folgende Richtlinien:

  • Klare Strukturierung durch inhaltlich abgegrenzte Gruppen für darzustellende Inhalte (z.B. zentrale Seiten einer Professur oder eines Projekts)
  • Übersichtlichkeit durch flache Hierarchie: maximal zwei Ebenen in der Navigation, maximal sieben Menüpunkte pro Ebene
    • Ebene eins der Menühierarchie ist immer sichtbar.
    • Ebene zwei wird nur zum jeweils angeklickten Menüpunkt der Ebene eins angezeigt oder wenn zu einer Seite der Ebene zwei navigiert wurde.
    • Zu jedem Menüeintrag existiert eine Webseite.
  • Eine Rahmenkonfiguration (d. h. eine config-Datei) pro festgelegter Gruppe
  • Eindeutige Abgrenzung von Inhaltsangeboten durch konsequente Einhaltung der Navigationsregeln:
    • innerhalb einer Gruppe durch Menüeinträge im Navigationsmenü,
    • Wechsel der Gruppe nur über Verweise im Text der Seite
Eine Beispielnavigation mit maximal zwei Ebenen
Zur Veranschaulichung einer sinnvollen Strukturierung kann der Vergleich mit einem Buch herangezogen werden.
  • Ein Buch ist dabei als eine Gruppe inhaltlich zusammengehörender Webseiten zu verstehen.
  • Darin kann es ein Vorwort geben, das nicht im Inhaltsverzeichnis angegeben sein muss. Dies könnte z.B. eine Einstiegsseite für eine Gruppe von Webseiten sein. → Menü ist dann eingeklappt.
In einem Buch gibt es
  • ein Inhaltsverzeichnis, in dem alle Kapitel und Abschnitte mit Angabe der Seitennummer untereinander aufgelistet werden → Inhaltsmenü links zur Navigation zu den Webseiten
  • Kapitel, die erste Ebene der Navigation → die oberste Seite aus einer Gruppe von Webseiten
  • Abschnitte, die zweite Ebene der Navigation → die restlichen Webseiten der Gruppe
  • Verweise, ein auf einer Seite im Text auftauchender Hinweis/Link auf ein anderes Buch, das den wiederzugebenden Inhalt bereits ausführlich beschreibt oder weiterführende Informationen enthält

Darstellung der Strukturierung am Beispiel Buch: Das Inhaltsverzeichnis des Buches (→ Menü der Webseite) wird in einer Rahmendefinition (→ Datei config.inc) festgelegt.
Darstellung der Strukturierung am Beispiel eines Buches

Das im obigen Bild verwendete Buchbeispiel in analoger Umsetzung im Design der Webseite:
Beispielhafte Umsetzung eines Inhaltsverzeichnisses

Gestaltung der Inhalte

Lesen Sie dazu bitte die Hinweise unter

Umsetzung

Zur Umsetzung des Corporate Designs für Webseiten auf den zentralen Webservern empfehlen wir den Einsatz des Autoren- und Layoutsystems TUCAL.

Falls dies z. B. für Webanwendungen nicht möglich ist, können folgende Templates verwendet werden:

Einfacher HTML-Rahmen

Diese Vorlage bietet einen einfachen HTML-Rahmen mit Kopf- und Fusszeile. Das Stylesheet und Logo sind in einzelne Dateien ausgelagert. Dies ist eine einfache und flexible Vorlage die für verschiedene Web-Applikationen mit HTML-Unterstützung verwendet werden kann.

HTML-Rahmen für PHP/TWIG

Diese Vorlage bietet ein Anwendungsgerüst auf Basis von PHP mit der Template-Engine TWIG. Das Stylesheet, Logo und das Template an sich sind in einzelne Dateien ausgelagert.

TUC-Template für Django

Diese Django-App ermöglicht die Nutzung des Corporate Designs der TU Chemnitz mit dem Django-Template-System. Dazu wird sowohl ein Basis-Template für eigene Django-Seiten, als auch ein angepasstes Template für Inhalte der Admin-Seiten bereitgestellt.

Presseartikel

  • TUCtalk wird interaktiv

    Rektor Prof. Dr. Gerd Strohmeier lädt die Hochschulöffentlichkeit ein, ihm am 4. und 11. Juli 2017 in Vorbereitung der nächsten Sendung Fragen zu stellen …

  • Sechste Folge von TUCtalk ist online

    Prof. Dr. Winfried Thielmann gibt Einblick in seine Arbeit als Professor und Wissenschaftlicher Leiter des Zentrums für Fremdsprachen der TU Chemnitz …

  • Gelungene Premiere der TUCsommernacht

    Mehr als 1.000 Gäste erlebten im Innenhof des Böttcher-Baus einen wunderschönen Abend - Fotorückblick ist online - Zum Vormerken: Die nächste TUCsommernacht findet am 23. Juni 2018 statt …

  • „TUCsommernacht“ feiert Premiere

    Musik, Tanz und kulinarische Genüsse verspricht am 24. Juni 2017 ein neues Veranstaltungsformat – "Glimpses of India" sorgt für internationales Flair – Restkarten gibt es an der Abendkasse …