Einen Zeitstrahl gestalten

Du erstellst einen Zeitstrahl für deine Website, um Meilensteine, Ereignisse oder Entwicklungsschritte chronologisch darzustellen. Der Zeitstrahl kann entweder eine einfache Liste mit Datum und Beschreibung zeigen oder als filmische Erzählung mit Zeitpunkten und visuellen Effekten aufgebaut sein.

Voraussetzungen

Es gibt keine besonderen Voraussetzungen. Du brauchst Zugriff auf einen Seiten-Editor, in dem du einen Zeitstrahl-Block einfügen kannst.

So gehst du vor

Einfacher Zeitstrahl

1. Trage im Feld Überschrift einen Titel ein – etwa den Namen des Prozesses oder der Zeitspanne, die der Strahl zeigt.

2. Klicke auf Eintrag hinzufügen, um einen ersten Zeitpunkt zu erfassen. Ein neuer Eintrag wird angelegt und du kannst ihn ausfüllen.

3. Für jeden Eintrag trage folgende Angaben ein:

   • Datum: Die Jahreszahl, das Datum oder die Zeitangabe, die sichtbar sein soll. Optional.
   • Titel: Der Name oder die Überschrift des Ereignisses. Du kannst Markdown-Formatierung verwenden.
   • Beschreibung: Erläuternder Text zu diesem Punkt. Markdown möglich.
   • Animation: Wähle aus der Liste eine Einlaufanimation, wenn die Einträge sich beim Laden der Seite bewegen sollen. Oder wähle „Keine Animation".

4. Wiederhole Schritt 2 und 3 für alle weiteren Zeitpunkte.

5. Die Reihenfolge änderst du mit den Pfeilen neben jedem Eintrag:

   • Der Pfeil nach oben verschiebt den Eintrag eine Position nach oben.
   • Der Pfeil nach unten verschiebt ihn nach unten.
   • Oben und unten liegende Einträge können nicht weiter verschoben werden.

6. Mit dem Symbol zum Kopieren legst du einen Duplikat eines Eintrags an – sinnvoll, wenn mehrere Einträge ähnliche Werte haben. Mit dem Papierkorb-Symbol löschst du einen Eintrag.

7. Klicke oben rechts auf Speichern, um alle Änderungen zu sichern.

Filmischer Zeitstrahl (Story)

Der filmische Zeitstrahl ist eine Variante, die wie eine Video-Erzählung aufgebaut ist und zusätzliche visuelle Gestaltungsmöglichkeiten bietet.

1. Wähle im Feld Farbvariante eine Farbgebung für den gesamten Block. Die Auswahl bestimmt das Design und die Farbakzente.

2. Trage optional im Feld Eyebrow einen kurzen Vortext ein – etwa eine Kategorie oder ein teaser. Markdown möglich.

3. Im Feld Titel (Markdown) schreibst du die Hauptüberschrift des Zeitstrahls.

4. Das Feld Untertitel enthält einen erklärenden Text unter dem Titel.

5. Klicke auf Zeitpunkt hinzufügen, um einen Schnitt oder eine Szene hinzuzufügen. Ein neuer Punkt wird angelegt.

6. Für jeden Zeitpunkt gibst du ein:

   • Zeit: Die Uhrzeit oder Zeitangabe in Minuten:Sekunden (etwa „2:45"). Dieses Feld ist oben links.
   • Label: Ein Kurzname für diesen Abschnitt.
   • Icon: Ein Symbol, das diesen Moment visuell kennzeichnet. Klicke auf das Feld und wähle ein Icon aus der Bibliothek.
   • Farbton: Wähle eine Färbung – etwa Rot, Grün oder Blau – um den Punkt hervorzuheben.
   • KPI-Chip: Optional eine Kennzahl oder ein Kurzzitat, das neben dem Punkt angezeigt wird.
   • Titel: Die Überschrift dieses Abschnitts. Markdown möglich.
   • Text: Die ausführliche Beschreibung oder Geschichte zu diesem Zeitpunkt. Markdown möglich.

7. Die Reihenfolge änderst du mit den Pfeilen:

   • Der Pfeil nach oben bewegt den Zeitpunkt höher in der Liste.
   • Der Pfeil nach unten bewegt ihn tiefer.

8. Mit dem Papierkorb-Symbol löschst du einen Zeitpunkt.

9. Klicke oben rechts auf Speichern.

Aufbau des Zeitstrahls

Der einfache Zeitstrahl besteht aus einer Überschrift und einer Liste von Einträgen. Jeder Eintrag wird chronologisch von oben nach unten angeordnet und zeigt Datum, Titel und Beschreibung an.

Der filmische Zeitstrahl (Story) hat eine Kopfzeile mit Eyebrow, Titel und Untertitel, gefolgt von Zeitpunkten, die wie Kapitel einer Geschichte wirken. Jeder Zeitpunkt enthält eine Uhrzeit, ein Icon und inhaltliche Angaben. Die Farbvariante bestimmt das Design des ganzen Blocks.

Was danach passiert

Sobald du speicherst, werden deine Angaben in den Block übernommen. Der Zeitstrahl wird auf der Website angezeigt, wenn du die Seite veröffentlichst.

Die nachfolgende Gestaltung des Blockes – etwa Schriftart, Größe und genaues Layout – wird durch das Erscheinungsbild deiner Website bestimmt. Änderungen an einzelnen Einträgen kannst du jederzeit durchführen und neu speichern.

Tipps und Hinweise

• Animationen nutzen: Beim einfachen Zeitstrahl verleihen Animationen der Seite Dynamik, besonders wenn mehrere Einträge hintereinander einlaufen. Verwende sie gezielt, nicht bei jedem Eintrag.

• Markdown-Formatierung: In Titeln und Beschreibungen kannst du fett, kursiv oder unterstrichen schreiben. Nutze Markdown für Struktur und Hervorhebungen.

• Daten prüfen: Kontrolliere Datumsangaben vor dem Speichern. Falsche Jahreszahlen oder Zeiten wirken schnell verwirrend.

• Duplikate klonen: Wenn viele Einträge ähnlichen Aufbau haben, kopiere einen Eintrag und ändere dann nur Datum und Text – das ist schneller, als jedes Mal von vorne anzufangen.