Aufbau der Seiten

Hamburger-Symbol und Mega-Menü

Bei Klick auf das Hamburger-Symbol oben rechts auf Ihren Webseiten öffnet sich ein Mega-Menü, in dem Ihre Hauptseiten inklusive ihrer Unterseiten angezeigt werden. Die Nutzer können so direkt zur gewünschten Unterseite navigieren. Wenn Sie neue Seiten erstellen, erscheinen diese automatisch im Menü. Allerdings können im Mega-Menü nicht mehr als zwei Ebenen dargestellt werden. Sollten Sie Seiten haben, die tiefer im Seitenbaum liegen, müssen Sie diese über ein Inhaltselement vom Typ Seiten oder Unterseiten erreichbar machen.

Meta-Navigation, Logo und Footer

Die Meta-Navigation am oberen Seitenrand mit Uni-Logo, Zielgruppeneinstieg, Quicklinks, Liste der Fakultäten, Suche, Sprachauswahl und Social Media sowie der Footer am Ende der Seite sind für alle Seiten in unserem Typo3-System gleich. Sie können hier keine Änderungen vornehmen. Auf Wunsch können wir jedoch einen Link zur nächsthöheren Organisationseinheit (z.B. bei Lehrstuhlseiten zur zugehörigen Fachrichtung, in diesem Beispiel: "Webteam") eintragen. Außerdem kann links neben dem Seitentitel (in diesem Beispiel: "Handbuch und Vorlagen") Ihr Logo eingefügt werden. Das Logo muss in einem üblichen Bildformat vorliegen und eine Höhe von 145 Pixel haben.

Weiße und graue Bereiche sowie Bildschirmbreite

Sie können die Seiten strukturieren, indem Sie Inhalte abwechselnd in weißen und in grauen Bereichen (sog. Sections) platzieren. Hierfür stehen insgesamt acht Sections zur Verfügung. Grundsätzlich laufen Inhalte nicht über die volle Bildschirmbreite, sondern nur über ca. 60% des Bildschirms. Dies können Sie in den Eigenschaften des Inhaltselements jedoch ändern und Elemente, die mehr Platz benötigen (z.B. Kachelfelder) über die gesamte Bildschirmbreite laufen lassen. Außerdem können Sie den Bildschirm quasi in der Mitte teilen und den Inhalt nur über 50% der Seitenbreite laufen lassen bzw. zwei Elemente nebeneinander legen.

Beispiel für eine Spalte, die über 50% der Bildschirmbreite läuft

50%-Spalten nehmen immer die Hälfte des gesamten Bildschirms ein (also nicht die Hälfte der 60%-Ansicht). Sie können Texte, Bilder und andere Inhaltselemente (außer Kachelfelder) unterbringen. Allerdings bietet sich diese Darstellung nicht für alle Inhalte an.

Verwendungsmöglichkeiten für 50%-Spalten

In schmalen Spalten können Sie z.B. News und Veranstaltungen unterbringen oder auch Kontaktdaten einzelner Ansprechpartner mit Foto. Auch mehrere kurze Texte lassen sich gut in 50%-Spalten unterbringen.

Abstände definieren

Eine der größten Herausforderungen von responsiven Webseiten ist die Definition von Abständen zwischen Inhaltselementen, da diese je nach Bildschirmgröße und Browser unterschiedlich dargestellt werden können. Aus diesem Grund haben Sie die Möglichkeit, den voreingestellten Abstand eines Inhaltselements zum vorherigen oder zum folgenden Inhaltselement zu vergrößern oder zu verkleinern. Klicken Sie in Ihrem Inhaltselement hierfür auf den Reiter "Erscheinungsbild".

Vererbbarer Inhalt

Bei Bedarf können Sie das letzte Inhaltselement einer Seite auf die Unterseiten vererben lassen. Es stehen weiße 100%- und 50%-Bereiche zur Verfügung. Hier können Sie z.B. wiederkehrende Kontaktinformationen unterbringen. Wenn Sie die Vererbung auf einer Unterseite unterbrechen möchten, legen Sie in die vererbende Spalte ein Überschriftenelement, in dem die Überschrift verborgen ist.