Container

Container Inhalt und Positionierung

Container Abstand

Größendefinition und Kombinationen

Container Inhalt und Positionierung

Container werden mit Text oder Bild gefüllt. Der Inhalt einer Seite wird durch die Aufteilung auf verschiedene Container strukturiert.

Unterschiedlich breite Container können problemlos untereinander linksbündig positioniert werden, dabei auftretende Leerräume auf der rechten Seite sind erwünscht (linksbündiger Flatersatz).

Container Abstand

Container werden durch einen horizontalen bzw. vertikalen Abstand von 8px untereinander getrennt sowie neben und unter diesem Container.

Container, die keinen semantischen Bezug untereinander haben, beispielsweise Themengruppen, werden vertikal mit einem großem Abstand getrennt. Unter diesem Container ist ein großer Abstand von 24px zu sehen, darüber der Abstand von 8px.

Größendefinition und Kombinationen

Container können ein-, zwei-, drei-, oder vierspaltig groß sein und haben generell einen Abstand von 8px. Die Container können untereinander gemischt werden und dürfen nicht größer als vier Spalten sein. Daraus ergeben sich acht Kombinationsmöglichkeiten bei der Ausnutzung aller vier Spalten:
4 (760px)
2:2 (je 376px)
1:3, 3:1 (184 bzw. 568px)
1:1:2, 1:2:1, 2:1:1 (184 bzw. 376px)
1:1:1:1 (je 184px)

Mehr Gestaltungmöglichkeiten können durch die Ausnutzung von weniger als vier Spalten erzeugt werden.

Weitere Kombinationsmöglichkeiten entstehen durch die Variation der Spaltenbreiten (ein-, zwei-, drei oder vierspaltig) und der direkten Aneinanderreihung, wie nachfolgend zu sehen ist.

Kopf-Container

Jede Seite wird mit einem übergeordneten Container kenntlich gemacht. Nur die nachfolgenden Kopf-Container sind auf der FACE-Seite zugelassen.