Gestaltungsraster
Ein Gestaltungsraster ist ein unsichtbares System aus Linien, an dem die verschiedenen Gestaltungselemente einer Website ausgerichtet werden. Durch den Einsatz eines Gestaltungsrasters kann ein strukturiertes Layout umgesetzt werden. Zudem unterstützt das Raster bei der Weiter- und Neuentwicklung von Gestaltungselementen sowie Inhaltskomponenten.
Das definierte Gestaltungsraster berücksichtigt die Vielfalt der Auflösungen und Endgeräte. Inhalte werden entsprechend positioniert, Texte und Bilder neu skaliert. Dadurch kann für alle Endgeräte ein einheitliches Design gewährleistet werden.
Desktop
Tablet Landscape
Tablet Portrait
Smartphone
Layoutspalten
Es gibt folgende Layout-Spalten:
- ASide links
- Content-Bereich
- ASide rechts
Diese können vom Redakteur in 3 verschiedenen Stufen angezeigt werden:
- 1-2-1: Content-Bereich doppelt so groß wie ASide
- 1-3-0: keine rechte ASide und Content-Bereich 3-mal so groß
- 0-4-0: keine ASide (außer den Seitentitel) und Content-Bereich geht über volle Breite
Gridspalten
Für die Layout-Spalten gibt es je nach Einteilung folgende Grid-Spalten-Einteilung:
1-2-1
ASide links: 14 Grid-Spalten
Content-Bereich: 30 Grid-Spalten + 1 Grid-Spalte Abstand links
ASide rechts: 14 Grid-Spalten + 1 Grid-Spalte Abstand links
1-3-0
ASide links: 14 Grid-Spalten
Content-Bereich: 45 Grid-Spalten + 1 Grid-Spalte Abstand links
ASide rechts: 0 Grid-Spalten
0-4-0
ASide links: 0 Grid-Spalten
Content-Bereich: 60 Grid-Spalten
ASide rechts: 0 Grid-Spalten
