Startseite: Umstellung von 3-spaltig zu 1-spaltig

Hintergründe

Im Designsystem von Berlin.de gilt das Prinzip “mobile first”: Das Layout priorisiert mobile Nutzung und reagiert flexibel auf jedes Endgerät und jede Bildschirmgröße. Um die Startseite vollständig an das Designsystem anzupassen, wurde diese von einem 3-spaltigen in ein 1-spaltiges Layout überführt, das redaktionell mit wenigen Schritten aktiviert werden konnte.

Die Anzeige der 3-spaltigen Startseite auf den Liveseiten von Berlin.de ist ausgeblendet. Es werden nur noch 1-spaltige Startseiten auf Berlin.de gezeigt. Auch die 3-spaltigen Inhalte der Bearbeitungsansicht sind entfernt worden.

Beispiele für einspaltige Startseiten:

Schritte zur Umstellung

Die Umstellung auf eine 1-spaltige Startseite ist zum größten Teil redaktionell möglich. Aber seit Februar 2025 können Sie in der Bearbeitungsansicht nicht mehr auf die dreispaltigen Inhalte zugreifen. Wenn Inhalte fehlen, müssen Sie diese neu erstellen. Bilder aus den alten Inhalten finden Sie nach wie vor im Bereich “Medien”.

Wie im vorherigen Abschnitt dargestellt, gibt es teilweise Unterschiede in der Frontend-Darstellung und bei der Bearbeitung zwischen den einzelnen Verticals. Wenn unklar ist, in welchem Vertical der Auftritt angelegt ist, finden Sie die Information in der Bearbeitungsansicht jeder Seite Ihres Auftritts (inkl. Startseite) im Reiter Metadaten ganz am Ende: “Layout: ScreenVerticalname”.

Die Umstellung selbst ist automatisch erfolgt.

Fügen Sie Ihre Inhalte in 1-spaltige Flex-Module im Reiter “Flex-Module” ein, damit Ihre Inhalte live dargestellt werden.

Redaktioneller Hinweis

Der 3-spaltige Flex-Modul-Bereich wurde aus der Bearbeitungsansicht entfernt. Alle Inhalte, die bisher nicht auf einspaltige Flex-Module übertragen wurden, müssen komplett neu angelegt werden.

Änderungen in der Bearbeitungsansicht

In der Bearbeitungsansicht für die Startseite haben sich die Bezeichnungen der Reiter geändert. Diese Änderungen sind in allen Verticals identisch. Die Reiter “Metadaten”, “Kachel-Opener” und “Footer” sind gleich geblieben.

  • vorher: Flex-Module (1- und 3-spaltig)

    jetzt: Flex-Module

Reiter "Kachel-Opener"

Mit der Umstellung auf die 1-spaltige Startseite wurde die Bühne abgeschaltet. In den meisten Verticals wurde daraus automatisch ein
Kachel-Opener. Die Bühnen-Teaser-Module werden für die Darstellung benutzt.

Hintergrund zur Änderung von Bühne zu Kachel-Opener: Der Kachel-Opener zeugt im Gegensatz zur Bühne von klaren redaktionellen Entscheidungen und einem berechenbaren Verhalten der angebotenen Seite, wie sie von Nutzer*innen erwartet werden.

Besonderheiten im Vertical Identität

Im Vertical Identität werden die ersten 3 aktiven Bühnen-Teaser zusammen mit dem Opener-Bild als Erstes auf der Seite angezeigt.

Weitere Informationen dazu finden Sie auf der Seite Kachel-Opener im Abschnitt zum Vertical.

Besonderheit im Vertical Marketing und im Vertical Shop/Freizeit

Sowohl im Vertical Marketing als auch im Vertical Shop/Freizeit kann kein Kachel-Opener genutzt werden. Der Reiter ist im Edit nicht vorhanden.

Reiter "Opener-Bild"

Im Reiter “Opener-Bild” kann ein großes Bild an erster Stelle auf der Seite gepflegt werden. Ein großes Bild kann nur in den folgenden Verticals genutzt werden:

  • Identität
  • Marketing
  • Shop/Freizeit

Weitere Informationen finden Sie auf der Seite Einrichtung Startseite im Abschnitt zum Opener-Bild.

Screenshot eines leeren Dokuments mit nur einen Button zum Hinzufügen von Flex-Modulen

Flex-Module, nur 1-spaltig, ohne Module

Reiter "Flex-Module"

Im Reiter “Flex-Module” steht ab sofort nur noch ein Bereich zum Einfügen von neuen Flex-Modulen zur Verfügung. Der Bereich mit den 3-spaltigen Flex-Modulen wurde entfernt.

Eine Liste der Flex-Module, die Sie auf der 1-spaltigen Startseite nutzen können, finden Sie auf der Übersichtsseite zum Template Startseite.

Änderungen im Frontend nach Verticals

  • Verticals Organisation, Wirtschaft und Bürgerservice (Ausnahme: Serviceportal)

    In diesen Verticals werden die ersten vier Bühnen-Teaser-Module als Kachel-Opener angezeigt. Weitere Informationen finden Sie auf der Seite zum Kachel-Opener

    Wie oben beschrieben, werden die 3-spaltigen Flex-Module und die Inhalte der Top-Box nicht mehr angezeigt.

  • Vertical Identität

    Wenn eine Startseite im Vertical Identität auf das 1-spaltige Layout umgestellt wird, wird ein Opener-Bild zusammen mit den ersten 3 aktiven Bühnen-Teaser-Modulen angezeigt.

    Bitte beachten Sie vor der Umstellung die folgenden Seiten:

    Wie oben beschrieben, werden die 3-spaltigen Flex-Module nicht mehr angezeigt.

  • Verticals Marketing und Shop/Freizeit

    Bei der Umstellung in diesen Verticals wird ein Opener-Bild am Anfang der Seite angezeigt. Die Inhalte der Bühnen-Teaser sind nicht mehr im Frontend sichtbar.

    Bitte beachten Sie vor der Umstellung die Hinweise auf der Seite Einrichtung Startseite im Abschnitt Opener-Bild.

    Wie oben beschrieben, werden die 3-spaltigen Flex-Module nicht mehr angezeigt.

Die Verticals Info und Asset-Service sind aktuell nicht auf Imperia-Seiten im Einsatz und deshalb nicht gelistet.

Häufige Fragen und Antworten zur Umstellung

Was passiert, falls die Startseite nicht auf 1-spaltig umgestellt wurde?

Falls Sie Ihre Startseite(n) noch nicht auf die 1-Spaltigkeit umgestellt haben, sind einige Seitenbereiche ausgeblendet und werden ggf. anders angezeigt. Nachfolgend listen wir auf, wie Startseiten je nach Layout-Variante reagieren:

  • Identität (z.B. Bezirksämter):
    • Inhalte der Reiter Top-Box und Flex-Module sind ausgeblendet
    • War zuvor eine Bühne gepflegt, werden nun die ersten drei aktiven Bühnen-Teaser als Kachel-Opener ohne Bilder gezeigt
    • Waren zuvor weniger als drei Bühnen-Teaser und/oder diese unvollständig gepflegt, wird kein Kachel-Opener angezeigt
  • Organisation (z.B. Senatsverwaltungen und ihre nachgeordnete Behörden):
    • Inhalte der Reiter Top-Box und Flex-Module sind ausgeblendet
    • War zuvor eine Bühne gepflegt, werden nun die ersten vier Bühnen-Teaser als Kachel-Opener gezeigt, nur der erste Bühnenteaser zeigt ein Bild
    • Waren zuvor weniger als vier Bühnen-Teaser und/oder diese unvollständig gepflegt, wird kein Kachel-Opener angezeigt
  • Shop/Freizeit (z.B. VHS, Musikschulen):
    • Inhalte der Reiter Top-Box und Flex-Module sind ausgeblendet
    • War zuvor eine Bühne (nur Bild oder mehrere Bühnen-Teaser) gepflegt, wird nun lediglich die Seitenüberschrift (H1) der Startseite gezeigt.
  • Wirtschaft (z.B. Einheitlicher Ansprechpartner):
    • Inhalte der Reiter Top-Box und Flex-Module sind ausgeblendet
    • War zuvor eine Bühne gepflegt, werden nun die ersten vier Bühnen-Teaser als Kachel-Opener gezeigt, nur der erste Bühnenteaser zeigt ein Bild
    • Waren zuvor weniger als vier Bühnen-Teaser und/oder diese unvollständig gepflegt, wird kein Kachel-Opener angezeigt
  • Marketing/Asset-Service: keine Änderungen, da nur 1-spaltige Startseiten möglich
  • Info/Bürgerservice: Diese Verticals sind mit Ausnahme der Berliner Standesämter und des Serviceportals bisher nicht auf Imperia-Seiten im Einsatz. Die Startseite des Serviceportals hat zudem eine eigene Programmierung.

Gibt es weitere Änderungen für die 1-spaltigen Startseiten?

  • Verticals Freizeit und Identität: In diesen beiden Layoutvarianten muss ein großes Opener-Bild gepflegt werden. Wenn Sie noch kein Opener-Bild gepflegt haben, erhalten Sie in der Vorschau der Seite den Hinweis: “Bitte Opener-Bild hinzufügen” Das Bild wählen Sie aus. Eingesetzt wird es durch den Support von BerlinOnline. Weitere Informationen zum Bild und zum Einbau finden Sie im Formular Opener-Bild
  • Verticals Identität, Organisation und Wirtschaft: In diesen Layoutvarianten muss ein Kachel-Opener im gleichnamigen Reiter gepflegt werden. In Organisation und Wirtschaft werden die ersten vier aktiven Bühnenteaser angezeigt, in Identität drei. Aktiv sind Bühnenteaser, wenn zum Zeitpunkt der Veröffentlichung keine Startzeit in der Zukunft bzw. Stopzeit in der Vergangenheit am Modul festgelegt ist. Damit das Modul bzw. im Ergebnis der Kachel-Opener korrekt genutzt wird, wurden folgende Änderungen am Modul Bühnenteaser umgesetzt:
    • Gliederungsstufe entfällt: Die Titel/Überschriften der Bühnenteaser-Module erhalten automatisch eine H2. In der Anzeige von Live-Inhalten werden redaktionell gesetzte Gliederungsstufen H3 und H4 in H2 geändert.
    • Titel und Link werden Pflichtfeld: Die Startseite kann nicht gespeichert oder veröffentlicht werden, falls kein Titel und Link im Modul eingetragen sind.
  • Verticals Marketing und Shop: Der Reiter Kachel-Opener wurde aus der Bearbeitungsansicht entfernt.
  • Der Reiter Top-Box wurde aus der Bearbeitungsansicht entfernt.
  • Der 3-spaltige Flex-Modul-Bereich wurde aus dem Edit entfernt.