Link to demo site: Live-Demo
Layout-Preview:
Die Templates bilden zwölf Seitengerüste ab, die in der Praxis häufig benötigt werden.
Sie setzen sich aus Zeilen (einer horizontalen Aufteilung) und Spalten (einer vertikalen Aufteilung) zusammen. Je nach Aufbau der Templates entstehen z.B. Bereiche für Logo, Hauptnavigation, Unternavigation, Hilfsnavigation, Adresse, Inhalt und aktuelle Mitteilungen.
- Template 1.1: Ein-Zeiler mit zwei Spalten
- Template 1.2: Ein-Zeiler mit drei Spalten
- Template 2.1: Zwei-Zeiler mit jeweils einer Spalte im Kopf- und Inhaltsbereich
- Template 2.2: Zwei-Zeiler mit einer Spalte im Kopfbereich und zwei Spalten im Inhaltsbereich
- Template 2.3: Zwei-Zeiler mit einer Spalte über zwei Zeilen links und zwei Zeilen als Kopf- und Inhaltsbereich rechts
- Template 2.4: Zwei-Zeiler mit jeweils zwei Spalten im Kopf- und Inhaltsbereich
- Template 2.5: Zwei-Zeiler mit drei Spalten im Kopfbereich und zwei Spalten im Inhaltsbereich
- Template 2.6: Zwei-Zeiler mit einer Spalte im Kopf- und drei Spalten im Inhaltsbereich
- Template 2.7: Zwei-Zeiler mit jeweils drei Spalten im Kopf- und Inhaltsbereich
- Template 3.1: Drei-Zeiler mit jeweils einer Spalte im Kopf-, Inhalts- und Fußbereich
- Template 3.2: Drei-Zeiler mit jeweils zwei Spalten im Kopf-, Inhalts- und Fußbereich
- Template 3.3: Drei-Zeiler mit jeweils drei Spalten im Kopf-, Inhalts- und Fußbereich
Für den Produktivbetrieb eines Templates müssen diverse Links im Kopfbereich angepasst werden:
- Link zur mobile.css (Layout für mobile Geräte mit Bildschirmbreiten bis 480px)
- Link zur general.css (Layout für alle Bildschirmbreiten ab 481px)
- Link zur print.css (Layout für Druck)
- Link zum favicon.ico
- Link zur html5shiv.js
This project provides 12 website templates that are often needed in practice.
They are composed of rows (horizontal layout) and columns (vertical layout). Depending on the structure of the template there are areas e.g. for logo, nain navigation, sub navigation, navigation aids, address, content and current news.
- Template 1.1: One row with two columns
- Template 1.2: One row with three columns
- Template 2.1: Two rows with one column in each row
- Template 2.2: Two rows with one column in first row (header) an two columns in second row (content)
- Template 2.3: Two rows with one column above two rows on the left site and a second column with to rows on the right site
- Template 2.4: Two rows with two columns in each row
- Template 2.5: Two rows. Three columns in first row (header), two columns in second row (content)
- Template 2.6: Two rows. One column in first row (header), three columns in second row (content)
- Template 2.7: Two rows with three columns in each row
- Template 3.1: Three rows with one column in each row
- Template 3.2: Three rows with two columns in each row
- Template 3.3: Three rows with three columns in each row
For productive use you have to adapt various links in the header area:
- anchor to mobile.css (design for mobile devices with a maximal screen width of 480px)
- anchor to general.css (design for screens greater than 480px)
- anchor to print.css (design for print layout)
- anchor to favicon.ico
- anchor to html5shiv.js