SideBarMenu

Überblick Visual Style Guide

Inhaltsbereich

Der Inhaltsbereich umfasst alle jene Inhalte, die von der jeweiligen Funktion angezeigt oder bearbeitet werden.

In diesem Bereich finden alle Objektmanipulationen und die Inhaltsanzeige statt. Entscheidend ist, dass in diesem Bereich eigentlich nur Objekte (die als solche gekennzeichnet sind, siehe später), sie manipulierende Methoden und verschiedene weitere (Meta-)Informationen zu diesen Objekten platziert werden sollten. Erklärungstexte, verweise auf andere Systemteile und andere Navigationselemente dürfen nicht in diesem Bereich erscheinen.

Für die Gestaltung sollten standardisierte grafische Elemente verwendet werden, Funktionen, die bereits in ähnlicher Weise im System vorhanden sind, müssen sich in der Bedienung daran anlehnen. Gerade im Inhaltsbereich muss es das erklärte Ziel sein, mit bekannten Elementen zu arbeiten, um dem Nutzer eine vertraute Umgebung – auch bei neuen Funktionen – zu bieten.

Einige grundsätzliche Hinweise zur Gestaltung des Inhaltsbereiches:

  • Vermeiden Sie, im Inhaltsbereich der Seiten Texte frei zu platzieren. Es gibt eine Reihe von grafischen Gestaltungsmöglichkeiten, die im folgenden beschrieben werden, mit denen Sie jedwede Inhalte innerhalb des Inhaltsbereiches markieren und jeweils von anderen Objekten abgrenzen können.

Inhaltselemente

Generell gilt: Alle Elemente im Inhaltsbereich müssen durch passende Objekte eingefasst werden. Meistens sind dies Content-Boxen (bzw. Fieldareas in Formularen) oder Tabellen. Texte und Eingabemöglichkeiten dürfen nicht frei auf dem (weißen) Hintergrund gesetzt werden.

Text

Fließtext sollte in Stud.IP durch die Verwendung semantisch entsprechender HTML Attribute strukturiert werden. Dies gilt auch für die Formatierung des Textbildes. Die inhaltliche und logische Struktur des Textes wird somit auf den Quellcode übertragen. Dadurch wird der Text nicht nur lesbarer für den Entwickler, sondern auch zugänglicher für Screenreader.

Übersicht der HTML Markups

Überschriften

Überschriften werden seit Stud.IP 4.0 im Inhaltsbereich nicht mehr verwendet. Entsprechende Auszeichnungen von Überschriften dürfen nur noch im Content der jeweiligen Funktion (etwa Wiki-Texte, Informationsseite oder Foren-Beiträge) verwendet werden, dienen aber nicht mehr der Gliederung oder Beschreibung des Inhaltsbereiches.

Einfache Listen und Aufzählungen

Um einfache Listen in Stud.IP darzustellen wird das <ul> - Markup verwendet. Entsprechende Listenelemente werden mittels <li> eingefügt. Auch für Listen gilt, dass diese durch gliedernde Elemente (in der Regel Content-Boxen) eingefasst werden.

Beispiel: <ul> <li> Eintrag 1</li> <li> Eintrag 2</li> ... <li> Eintrag N</li> </ul>

Weitere Elemente werden in den entsprechende Bereichen dieses Styleguides genauer beschrieben:

  1. Tabellen
  2. Formulare
  3. Content-Boxen
  4. Suchen

Letzte Änderung am 21.06.2017 15:41 Uhr von ckater.