Jede Startseite wird mit einem Text oder Text/Bild Intro eingeleitet. Zusätzlich enthält sie verschiedene Teaser auf Unterseiten, sowie Teaserlisten.

Die Teaser werden eingesetzt, um auf Unterseiten zu verlinken. Eine über dem Teaser stehende Absenderkennung wird eingesetzt, um den Nutzern die Orientierung zwischen verschiedenen Absendern innerhalb der TU zu erleichtern.

Teaser über den gesamten Inhaltsbereich haben eine Breite von 99% und sind links gefloatet. Schmale Teaser haben eine Breite von 235px und sind links gefloatet (weitere Details zu den einzelnen Elementen finden sich im Abschnitt Module).

Teaserlisten sind eine Kombination aus kurzen Textteasern, die gruppiert und mit einer Überschrift ergänzt werden. Die Teaser werden je nach Einsatz mit verschiedenen Zusatzinformationen ergänzt. Teaserlisten bestehen aus einem <div class="listing">, das eine Liste (ul) beinhaltet (weitere Details zu den einzelnen Elementen finden sich im Abschnitt Module).

Es gibt neben der Startseite der TU Berlin, die sich nur durch das besondere Kopfbild von anderen Startseiten unterscheidet, vier weitere Startseiten:

• Startseite TU Berlin
• Startseite Fakultät, Organisation/Verwaltung
• Startseite Institut
• Startseite Fachgebiet
• Startseite Zentrale Einrichtung

Um den Code so sauber und semantisch wie möglich zu halten und das CSS so effizient wie möglich zu gestalten, wird allen Startseiten der TU Berlin über eine Id ein seitentypenspezifisches Design zugewiesen.

Der Seitentyp wird als Id in das Body-Element geschrieben:
<body...id="welcome">

Das Bild der Startseite wird als Hintergrund-Bild über die CSS-Datei eingebunden. Alternativ können andere Hintergrund-Bilder über das CSS im Kopf der Seite eingebunden werden.

        #branding {
            height: 19em;
            background: #ADC4D2 
               url(img/headerfoto-04.jpg) no-repeat 
               top left !important;
        }

>> Startseite der TU Berlin