Übersicht der Template-Layouts

für das TYPO3-News-System

Gestaltungshinweis

Alle News-Layouts sind für 100% Seitenbreite gestaltet worden und sollen auch so, d.h. ohne umgebenden Container, verwendet werden. 

Einzelne Ansichten sind auch in 66% breiten Spalten eines Containers vertretbar. Siehe Beschreibung.

Sollten Sie News-Layouts in weniger als 100% Seitenbreite einsetzen, ist die Darstellungsqualität sehr wahrscheinlich eingeschränkt. 

Überprüfen Sie unbedingt auch die mobile Darstellung der Seite! Diese ist bedeutsamer als die Dektopansicht, die Sie wahrscheinlich während der Bearbeitung am häufigsten sehen.

 

Layouts für Newsübersichten

(Stand 2025)

Listenansicht Standard

Beschreibung
  • Dreispaltige Darstellung in Kartenform mit
    • Bild
    • Datum
    • Teasertext
    • Verlinkung zur Detailansicht
  • Weitere News können über die Seiten-Nummern unterhalb der Karten angewählt werden. (Paginierung)
  • Entworfen für 100% Seitenbreite
Verwendung

Gut geeignet als News-Übersicht für Organisationseinheiten, mit überschaubarem Aufkommen an News. Die drei Karten sollten ausreichen die aktuellsten News anzuzeigen. Die Paginierung nutzen Seitenbesucher häufig nur, wenn Sie auf der Suche nach einem bestimmten Thema sind. Wichtige News auf Seite 2 oder 3 werden von vorbeisurfenden Seitenbesuchern wahrscheinlich eher nicht wahrgenommen.

Beispiel Listenansicht Standard

Listenansicht ohne Bilder

Beschreibung
  • Dreispaltige Darstellung in Kartenform mit
    • Datum
    • Teasertext
    • Verlinkung zur Detailansicht
  • Weitere News können über die Seiten-Nummern unterhalb der Karten angewählt werden. (Paginierung)
  • Entworfen für 100% Seitenbreite
Verwendung

Gut geeignet als News-Übersicht, 

  • die weniger Platz benötigt,
  • für die eine Auswahl an Bildern unnötig erscheint  und
  • mit geringem Aufkommen an News (max. 3 wirklich aktuelle News sichtbar auf den ersten Blick)
Beispiel Listenansicht ohne Bilder

Liste nur Bilder (60%-100% Breite)

Beschreibung
  • Dreispaltige Darstellung in Kartenform mit
    • Bild
    • Verlinkung zur Detailansicht
  • Weitere News können über die Seiten-Nummern unterhalb der Karten angewählt werden. (Paginierung)

Redakteure müssen darauf achten, stets das gleiche Seiten-Verhältnis bei verwendeten Bildern einzuhalten.

Verwendung

Ursprünglich entworfen für unsere Architektur, die mit eigens gestalteten, plakatartigen Bildern Events angekündigt hat.

Für diese Newsansicht müssen alle relevanten Informationen im Bild selbst sichtbar sein. Achtung Barrierefreiheit: Jedes bisschen Text auf dem Bild muss zwingend im Alternativtext mit aufgeführt werden. 

Zukunft der Ansicht

Wegen seltener Verwendung und der Herausforderung zur Barrierefreiheit wird diese Ansicht u.U. nicht weitergeführt.


3er Teaser Pyramide (100% Breite)

Beschreibung

Das Layout 3er-Teaser Pyramide zeigt in Karten drei aktuelle News an, wobei das Bild links neben Datum, Titel und Teasertext steht. Die erste News wird in 100% Seitenbreite angezeigt und ist sehr groß. Die 2. und 3. News werden darunter und nebeneinander angezeigt. 

Unterhalb der 3er-Teaser Pyramide verlinkt ein Button auf eine vollständige News-Liste. 

Verwendung

Gut geeignet als News-Einstieg auf einer Startseite. Während die prominentesten News direkt angezeigt werden, führt der Button unterhalb den Seitenbesucher in eine vollständige News-Übersicht. 

Dieses Layout verlangt ausdruckstarkes Bildmaterial und aussagekräftige Teasertexte, die allerdings nicht zu lang werden dürfen. 

Beispiel 3er Teaser Pyramide (100% Breite)

3er Teaser Karten


3er Teaser Events (100% Breite)

Beispiel 3er Teaser Events (100% Breite)
Momentan sind keine Veranstaltungen geplant.

Liste mit Karten Monatsansicht (100% Breite)


Liste Events (66%-100% Breite)


Liste klassisch mit Bild (66%-100% Breite)


Teaser mit Titel (ohne Bild)


Layouts für Detailansichten

(Stand 2025)

Detailseite Standard

Beispiel Detailseite Standard

Wissen Sie, wie Sie die redaktionell zuständigen Personen einer Typo3-Seite kontaktieren können?

Mitarbeitende im Büro am Computer. Mann im Vordergrund, Frau im Hintergrund
Mitarbeitende im Büro am Computer

Am Fuß jeder Seite finden Sie die redaktionell verantwortliche Stelle mit der entsprechenden E-Mail-Adresse verlinkt. So können Sie direkt Kontakt aufnehmen.

Dieser Eintrag ist aufgrund gesetzlicher Bestimmungen zur Barrierefreiheit erforderlich. Wenn ein Seitenbesucher auf eine Barriere stößt, kann er die zuständige Redaktion über den E-Mail-Link direkt kontaktieren. Eine Antwort muss innerhalb von 30 Tagen erfolgen.

Sollte hier „N.N.“ oder das „TYPO3-Team“ stehen, wurde die zuständige Stelle nicht gemeldet. In diesem Fall freuen wir uns über einen Hinweis, wo noch Einträge fehlen. Wir nehmen dann Kontakt zu den uns bekannten Redakteur*innen auf und ergänzen den Eintrag.

Wer diesen Eintrag für seine Seiten anpassen möchte, kann das Formular zur Meldung der redaktionellen Zuständigkeit ausfüllen.

Mitarbeitende im Büro am Computer. Mann im Vordergrund, Frau im Hintergrund
Mitarbeitende im Büro am Computer

Detailseite Event

Beispiel Detailseite Event

Typo3 für Einsteiger Teil 1 (Jan 26)

In Schulung 1 werden grundlegende Themen zu TYPO3 vermittelt, darunter der Aufbau von Frontend und Backend, das Anlegen von Seiten und Inhaltselementen, das Erstellen von Inhalten, Verlinkungen, der Umgang mit Dateien, Metadaten sowie die Erstellung von News-Datensätzen und Barrierefreiheit.
TYPO3 Logo
TYPO3 Logo

Liebe (angehende) Webredakteur*innen,
wir freuen uns im WiSe25/26 wieder die Onlineschulungsreihe TYPO3 für Einsteiger 1-3 anbieten zu können.

Diese vermittelt Ihnen die Grundlagen für den Umgang und das Arbeiten mit dem Webseiten-Content-Management-System TYPO3.

Die Schulungen sind eng aufeinander abgestimmt. Daher empfehlen wir sich für alle drei (idealerweise aufeinanderfolgenden) Schulungsteile anzumelden. 

In Schulung 1 werden unter anderem folgende Themen behandelt:
- Was ist TYPO3?
- Aufbau von TYPO3: Frontend und Backend
- Typische Struktur eines Seitenbaumes
- Anlegen von Seiten(strukturen) und Inhaltselementen
- Erstellen erster Inhalte mittels Inhaltselement Text und Medien
- Verlinkungen
- Container
- Einstieg in die Dateiliste: Dateien auf den Server hochladen
- Metadaten
- Anlegen von News-Datensätzen
- Barrierefreiheit

 

Die Anmeldung für die Schulung erfolgt wie gewohnt in unserem Schulungsportal. Dort finden Sie zudem weitere Informationen zu dem einzelnen Veranstaltungen.

 

Wir freuen uns auf Ihre Teilnahme!

Viele Grüße
Ihr Webteam

Weitere Infos
Dozent: David Braun
Details

Detailseite Pressemitteilung

Beispiel Detailseite Pressemitteilung
Pressemitteilung

Kontinuierliche Verbesserungen am RPTU Template

04. August 2025

Wir arbeiten kontinuierlich an der Optimierung des RPTU-Templates für TYPO3-Webseiten - welche Verbesserungen bringt das aktuelle Update?

Detailansicht einer Computerplatine mit dem beleuchteten Schriftzug "Update"

Das RPTU-Template für TYPO3-Webseiten ist in einer intensiven Entwicklungsphase entstanden. Seitdem arbeiten wir kontinuierlich – parallel zum Tagesgeschäft – an dessen Optimierung. Dabei stehen Korrekturen, Barrierefreiheitsverbesserungen und technische Modernisierungen im Fokus.

Mit dem heutigen Update haben wir unter anderem folgende Änderungen umgesetzt:

  • Verbesserte Tastaturnavigation: Der Seitenkopf und das Hauptmenü sind nun korrekt per Tabulatortaste erreichbar und sichtbar fokussierbar.
  • Teaser-Optimierung: In den 25 %- und 50 %-Teasern wurde der wenig aussagekräftige „Weiterlesen“-Link entfernt. Stattdessen ist jetzt der Titel des Teasers verlinkt. Die Detailansichten der News passen wir zu einem späteren Zeitpunkt entsprechend an.
  • Semantische Auszeichnung von Menüs: Inhaltselemente vom Typ „Menü“ werden nun als Navigation ausgezeichnet.
  • Lightbox-Anzeige verbessert: Die Lightbox zeigt jetzt die korrekte Anzahl an Bildern sowie einen lesefreundlicheren Beschreibungstext an.

Auch wenn wir nicht zu jedem Update eine eigene News veröffentlichen, arbeiten wir im Hintergrund stetig daran, das Template technisch wie inhaltlich weiterzuentwickeln.