# CI-Guide Emma Woelk · Elemente

> Maschinenlesbare Markenreferenz für Emma Woelk — Marketing & Sales,
> ein Unternehmen der roboconsulting SL, Barcelona.
> Die 76 Bausteine der Website emmawoelk.com: je Element Zweck, Einsatz, Grenzen, Position, Häufigkeit und gute Nachbarn.
>
> Drei Teile, eine Datei je Teil:
> - https://ci.emmawoelk.com/llms-frontend.txt
> - https://ci.emmawoelk.com/llms-social.txt
> - https://ci.emmawoelk.com/llms-elemente.txt  (diese Datei)

Erzeugt aus https://ci.emmawoelk.com/elemente. Nicht von Hand bearbeiten — Änderungen
werden beim nächsten Build überschrieben.

Quelle: https://ci.emmawoelk.com/elemente
Quelle-SHA256: dc01b00e5ebfcb45dd1d623cb890c1e94fc1a63e411c7d384e822e44f34b3d43

Farben, Schrift, Effekte und die Regeln, die für alle Elemente gelten, stehen im Frontend-Teil: https://ci.emmawoelk.com/llms-frontend.txt, Abschnitte Farbe, Typografie, Hintergründe und Bauteile & Effekte.

## Seitenkopf

Elemente 01 bis 04

### 01 Hero mit Porträt

- **Zweck:** Erster Bildschirm einer Haupt- oder Angebotsseite: Emma als Foto, große Headline, Vorspann, ein Knopf.
- **Einsetzen wenn:** Startseite und Angebotsseiten (KI-Werkstatt, Inner Circle, Beratung), wenn Emma persönlich verkauft.
- **Nicht verwenden:** Unterseiten, Blog, Rechtstexte. Auf dem Telefon wird das Foto nicht geladen, die Seite beginnt mit dem Text.
- **Position:** Ganz oben, direkt unter der Navigation.
- **Häufigkeit:** Genau einmal pro Seite; darin höchstens ein gelber Knopf, dazu optional ein Play-Link.
- **Passt zu:** 66 Play-Link · 18 Handschrift-Notiz mit Pfeil · 21 Karten zentriert mit Symbol

### 02 Seitenkopf zentriert mit Handschrift

- **Zweck:** Ruhiger Einstieg oder Kapitelanfang: zentrierte Headline, Vorspann, persönliche Handschrift.
- **Einsetzen wenn:** Seiten ohne Foto-Hero oder als Auftakt eines großen Kapitels.
- **Nicht verwenden:** Direkt unter einem Hero; nicht mehrfach hintereinander.
- **Position:** Seitenanfang oder Beginn eines großen Kapitels.
- **Häufigkeit:** Höchstens einmal pro Seite. Handschrift insgesamt höchstens zweimal pro Seite.
- **Passt zu:** 21 Karten zentriert mit Symbol · 07 Große Aussage mit Farbverlauf

### 03 Seitenkopf mit Brotkrumen-Pfad

- **Zweck:** Zeigt, wo eine Unterseite liegt, und führt mit einem Klick eine Ebene zurück.
- **Einsetzen wenn:** Unterseiten zweiter Ebene: einzelne Hub-Seiten, einzelne Builds.
- **Nicht verwenden:** Startseite und Hauptangebotsseiten.
- **Position:** Ganz oben, vor der Headline.
- **Häufigkeit:** Einmal pro Unterseite.
- **Passt zu:** 06 Lesespalte · 15 Hinweis-Box Achtung

### 04 Sprungmarken-Leiste

- **Zweck:** Inhaltsverzeichnis langer Seiten; springt zu den Kapiteln.
- **Einsetzen wenn:** Seiten mit mehr als etwa fünf Kapiteln (FAQ, Leitfäden, diese Bibliothek).
- **Nicht verwenden:** Kurze Verkaufsseiten mit einem klaren Weg zur Buchung.
- **Position:** Direkt nach dem Seitenkopf.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 03 Seitenkopf mit Brotkrumen-Pfad · 73 Fragen zum Aufklappen

## Text und Struktur

Elemente 05 bis 13

### 05 Text neben Bild

- **Zweck:** Erklärt einen Punkt mit passendem Foto daneben.
- **Einsetzen wenn:** Ein Format oder Angebotsbestandteil braucht Anschauung (Arbeitssession, Emma bei der Arbeit).
- **Nicht verwenden:** Als reine Dekoration; nicht mehrmals direkt hintereinander mit derselben Bildseite.
- **Position:** Hauptteil.
- **Häufigkeit:** Ein- bis dreimal pro Seite, Bildseite im Wechsel.
- **Passt zu:** 29 Hakenliste · 19 Notiz von Emma

### 06 Lesespalte

- **Zweck:** Längerer Fließtext in angenehmer Zeilenlänge, linksbündig.
- **Einsetzen wenn:** Haltung, Hintergrund oder Geschichte erklären; Rechtstexte.
- **Nicht verwenden:** Für Aufzählbares — dafür Hakenliste oder Karten.
- **Position:** Hauptteil.
- **Häufigkeit:** Beliebig; nach spätestens zwei Textblöcken ein visuelles Element einschieben.
- **Passt zu:** 07 Große Aussage mit Farbverlauf · 08 Merksatz mit gelbem Akzent · 10 Marker im Satz

### 07 Große Aussage mit Farbverlauf

- **Zweck:** Ein Satz als Haltung; die zweite Zeile im laufenden Lila-Verlauf.
- **Einsetzen wenn:** Kernbotschaft einer Seite oder ein Kapitelwechsel.
- **Nicht verwenden:** Für Fakten, Preise oder Anleitungen.
- **Position:** Zwischen zwei Kapiteln.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 06 Lesespalte · 02 Seitenkopf zentriert mit Handschrift

### 08 Merksatz mit gelbem Akzent

- **Zweck:** Ein Satz zum Merken; der Schlussteil in Gelb.
- **Einsetzen wenn:** Nach einer Erklärung, um sie auf einen Satz zu verdichten.
- **Nicht verwenden:** Als Überschrift; nicht im selben Kapitel wie der Merksatz mit gelber Fläche.
- **Position:** Ende eines Textkapitels.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 06 Lesespalte · 05 Text neben Bild

### 09 Merksatz mit gelber Fläche

- **Zweck:** Variante des Merksatzes mit gelb hinterlegtem Schlussteil — stärkerer Akzent.
- **Einsetzen wenn:** Der wichtigste Merksatz einer Seite.
- **Nicht verwenden:** Auf derselben Ansicht wie ein Marker im Satz oder die gelbe CTA-Box.
- **Position:** Ende eines Kapitels.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 08 Merksatz mit gelbem Akzent · 06 Lesespalte

### 10 Marker im Satz

- **Zweck:** Hebt zwei bis vier Wörter im Fließtext gelb hervor (CI-Marker).
- **Einsetzen wenn:** Das eine entscheidende Wort eines Absatzes.
- **Nicht verwenden:** Mehrfach auf einer Ansicht; nicht im selben Hero wie ein gelber Knopf.
- **Position:** Im Fließtext.
- **Häufigkeit:** Höchstens einmal pro Ansicht (Guide Abschnitt 06; pruefe.js prüft das).
- **Passt zu:** 06 Lesespalte

### 11 Trenner mit Handschrift

- **Zweck:** Persönlicher Übergang zwischen zwei Kapiteln.
- **Einsetzen wenn:** Vor dem Abschluss oder vor einem Perspektivwechsel.
- **Nicht verwenden:** Direkt über einer Überschrift mit derselben Aussage.
- **Position:** Zwischen Kapiteln, meist vor der Handlungsaufforderung.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 70 CTA-Band mit Emma · 71 Gelbe CTA-Box

### 12 Laufband mit Schlagworten

- **Zweck:** Bewegte Themenleiste über die volle Breite — Stimmung, keine Information.
- **Einsetzen wenn:** Themenfelder zwischen zwei Kapiteln zeigen (Agenten, Automatisierung, HubSpot …).
- **Nicht verwenden:** Für wichtige Inhalte (für Screenreader ausgeblendet); nicht neben dem Kundenlogo-Band.
- **Position:** Zwischen zwei Kapiteln, volle Breite.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 13 Schlagwort-Wolke · 22 Karten mit Symbol links oben

### 13 Schlagwort-Wolke

- **Zweck:** Themen als Wolke, große Wörter wichtiger; die Wörter treiben beim Scrollen.
- **Einsetzen wenn:** Überblick über Themen, Leistungen oder Blog-Kategorien.
- **Nicht verwenden:** Als Navigation (die Wörter sind keine Links).
- **Position:** Hauptteil oder vor den Blogkarten.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 12 Laufband mit Schlagworten · 76 Blogkarten

## Hinweise und persönliche Noten

Elemente 14 bis 20

### 14 Hinweis-Box Info

- **Zweck:** Neutrale Zusatzinformation, die ergänzt oder beruhigt.
- **Einsetzen wenn:** Organisatorische Details (Aufzeichnung, Zugänge, Zeiten).
- **Nicht verwenden:** Für Werbeaussagen oder Preise.
- **Position:** Direkt unter dem Absatz, auf den sie sich bezieht.
- **Häufigkeit:** Höchstens 2 Hinweis-Boxen pro Kapitel.
- **Passt zu:** 06 Lesespalte · 73 Fragen zum Aufklappen

### 15 Hinweis-Box Achtung

- **Zweck:** Warnt vor einer Voraussetzung oder Stolperfalle.
- **Einsetzen wenn:** Pflichten, Kosten Dritter, Einschränkungen (z. B. Pflicht-Onboarding bei HubSpot).
- **Nicht verwenden:** Um Druck aufzubauen; nicht als Rechtshinweis ohne geprüfte Grundlage.
- **Position:** Vor der Entscheidung, meist über Preisen oder Formularen.
- **Häufigkeit:** Höchstens einmal pro Kapitel.
- **Passt zu:** 46 Preiskarten mit Empfehlung · 48 Vergleichstabelle

### 16 Hinweis-Box Tipp

- **Zweck:** Praktischer Rat aus Emmas Erfahrung.
- **Einsetzen wenn:** Wie man ein Angebot am besten nutzt.
- **Nicht verwenden:** Für Pflichtangaben.
- **Position:** Hauptteil oder beim Ablauf.
- **Häufigkeit:** Höchstens einmal pro Kapitel.
- **Passt zu:** 41 Zeitstrahl · 19 Notiz von Emma

### 17 Hinweis-Box Erfolg

- **Zweck:** Bestätigt eine abgeschlossene Aktion.
- **Einsetzen wenn:** Danke-Seiten, nach dem Absenden eines Formulars, Eintrag in eine Liste.
- **Nicht verwenden:** Für Kundenerfolge — dafür die Elemente unter Beweise.
- **Position:** Oben auf Bestätigungsseiten oder direkt unter dem Formular.
- **Häufigkeit:** Einmal pro Bestätigung.
- **Passt zu:** 75 Formular · 74 E-Mail-Eintrag

### 18 Handschrift-Notiz mit Pfeil

- **Zweck:** Persönlicher Fingerzeig mit geschwungenem Pfeil auf einen Knopf.
- **Einsetzen wenn:** Der wichtigste Knopf einer Seite soll zusätzlich auffallen.
- **Nicht verwenden:** An mehreren Knöpfen; nicht, wenn im selben Bildschirm schon eine Handschrift steht.
- **Position:** Neben dem Hauptknopf.
- **Häufigkeit:** Höchstens einmal pro Seite; Handschrift insgesamt höchstens zweimal.
- **Passt zu:** 65 Knopf mit Textlink · 01 Hero mit Porträt

### 19 Notiz von Emma

- **Zweck:** Kurzer persönlicher Kommentar von Emma mit Foto, wie eine Nachricht.
- **Einsetzen wenn:** Eine Erfahrung oder Begründung aus erster Hand.
- **Nicht verwenden:** Für lange Texte — dafür der Brief von Emma.
- **Position:** Neben oder nach einem Sachkapitel.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 05 Text neben Bild · 16 Hinweis-Box Tipp

### 20 Brief von Emma

- **Zweck:** Längere persönliche Ansprache mit Unterschrift.
- **Einsetzen wenn:** Haltung und Versprechen eines Angebots; Über-mich-Seite.
- **Nicht verwenden:** Auf kurzen Verkaufsseiten zusätzlich zur Notiz von Emma.
- **Position:** Mitte der Seite oder vor dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 07 Große Aussage mit Farbverlauf · 69 CTA-Karte mit Lichtband

## Karten und Listen

Elemente 21 bis 32

### 21 Karten zentriert mit Symbol

- **Zweck:** Drei bis vier gleichwertige Bestandteile auf einen Blick, Symbol oben.
- **Einsetzen wenn:** Zeigen, was in einem Angebot steckt (Zugänge, Termine, Aufzeichnung).
- **Nicht verwenden:** Für Schritte mit Reihenfolge oder für Preise.
- **Position:** Direkt nach dem Hero oder dem Seitenkopf.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 01 Hero mit Porträt · 02 Seitenkopf zentriert mit Handschrift

### 22 Karten mit Symbol links oben

- **Zweck:** Leistungen oder Themen mit kurzer Erklärung.
- **Einsetzen wenn:** Leistungsbereiche, Arten von Builds.
- **Nicht verwenden:** Für Angebote mit Preis — dafür Preiskarten oder Angebots-Karussell.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 26 Link-Karten · 12 Laufband mit Schlagworten

### 23 Karten ohne Symbol

- **Zweck:** Aussagen mit Titel und Erklärung, wenn ein Symbol nichts beiträgt.
- **Einsetzen wenn:** Ausschlusskriterien („Nichts für euch, wenn …“) und Einwände.
- **Nicht verwenden:** Für Leistungen, die ein klares Symbol haben.
- **Position:** Vor dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 30 Passt / Passt nicht · 71 Gelbe CTA-Box

### 24 Bildkarten

- **Zweck:** Zwei bis drei Bestandteile mit Foto oben.
- **Einsetzen wenn:** Formate oder Angebote, die man sehen soll (Arbeitssession, Probe-Freitag).
- **Nicht verwenden:** Ohne echte Fotos; keine KI-Gesichter von Kunden.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 05 Text neben Bild · 62 Bild-Galerie mit Lightbox

### 25 Karten mit großer Ziffer

- **Zweck:** Drei kurze Schritte oder Prinzipien mit Reihenfolge.
- **Einsetzen wenn:** Eine Methode in wenigen Worten (Scannen, Bauen, Andocken).
- **Nicht verwenden:** Für mehr als vier Schritte — dafür der Zeitstrahl.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 41 Zeitstrahl · 06 Lesespalte

### 26 Link-Karten

- **Zweck:** Die ganze Karte ist ein Link zu einer anderen Seite.
- **Einsetzen wenn:** Weiterführen zu Angeboten oder Unterseiten (Hubs, Builds).
- **Nicht verwenden:** Für Inhalte ohne Zielseite.
- **Position:** Ende eines Kapitels oder Seitenende.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 22 Karten mit Symbol links oben · 55 Angebots-Karussell

### 27 Bento-Raster

- **Zweck:** Foto, Zahl und Fakten in unterschiedlich großen Kacheln.
- **Einsetzen wenn:** Ein Angebot kompakt und abwechslungsreich zusammenfassen.
- **Nicht verwenden:** Für mehr als fünf Kacheln oder lange Texte.
- **Position:** Nach dem Hero oder als Zusammenfassung.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 33 Kennzahlen-Kacheln · 21 Karten zentriert mit Symbol

### 28 Symbol-Liste zweispaltig

- **Zweck:** Vier bis sechs Merkmale mit Symbol, Titel und einem Satz.
- **Einsetzen wenn:** Eigenschaften eines Angebots, die keine Karten brauchen.
- **Nicht verwenden:** Für mehr als acht Punkte.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 05 Text neben Bild · 29 Hakenliste

### 29 Hakenliste

- **Zweck:** Aufzählung mit Haken: Voraussetzungen oder Inhalte.
- **Einsetzen wenn:** Was man mitbringen soll oder was man bekommt.
- **Nicht verwenden:** Für Ausschlusskriterien — dafür Passt / Passt nicht.
- **Position:** In einem Textkapitel.
- **Häufigkeit:** Höchstens einmal pro Kapitel.
- **Passt zu:** 06 Lesespalte · 30 Passt / Passt nicht

### 30 Passt / Passt nicht

- **Zweck:** Zwei Spalten: für wen es passt und für wen nicht.
- **Einsetzen wenn:** Besucher vor dem Preis oder der Buchung qualifizieren.
- **Nicht verwenden:** Mehrfach; nicht als Ersatz für Voraussetzungen im Text.
- **Position:** Vor Preisen oder dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 45 Selbstcheck zum Anklicken · 46 Preiskarten mit Empfehlung

### 31 Vorher und Nachher

- **Zweck:** Die Veränderung durch ein Angebot in zwei Spalten.
- **Einsetzen wenn:** Ein Kundenfall mit belegten Zahlen oder klarer Wirkung.
- **Nicht verwenden:** Mit erfundenen oder unbelegten Zahlen.
- **Position:** Beweis-Kapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 35 Ergebniskarte vorher/nachher · 36 Zitat

### 32 Reiter (Tabs)

- **Zweck:** Mehrere Varianten auf gleichem Platz zum Umschalten.
- **Einsetzen wenn:** Angebote oder Zielgruppen vergleichen, ohne die Seite zu verlängern.
- **Nicht verwenden:** Für Inhalte, die jeder sehen muss — verborgene Reiter werden seltener gelesen.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 48 Vergleichstabelle · 54 Zwei Wege zur Wahl

## Beweise

Elemente 33 bis 40

### 33 Kennzahlen-Kacheln

- **Zweck:** Vier belegte Zahlen in Kacheln; sie zählen beim Sichtbarwerden hoch.
- **Einsetzen wenn:** Ergebnisse oder Fakten mit Quelle.
- **Nicht verwenden:** Mit Zahlen ohne Beleg (Guide 05: jede Zahl braucht einen Besitzer); nicht zusammen mit Kennzahlen in Glas.
- **Position:** Nach dem Hero oder im Beweis-Kapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 39 Kundenlogo-Band · 35 Ergebniskarte vorher/nachher

### 34 Kennzahlen in Glas

- **Zweck:** Variante der Kennzahlen mit sehr transparenter Fläche und Zahlen in Gelb und Lila.
- **Einsetzen wenn:** Über Bildern oder dunklen Flächen, wo die Kacheln zu schwer wirken.
- **Nicht verwenden:** Zusammen mit den Kennzahlen-Kacheln auf einer Seite.
- **Position:** Wie die Kennzahlen-Kacheln.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 64 Glas-Panel über Bild · 63 Spotlight mit Glaskarten

### 35 Ergebniskarte vorher/nachher

- **Zweck:** Eine Zahl vorher und nachher mit handgeschriebenem Pfeil und Erklärung — der stärkste Einzelbeweis.
- **Einsetzen wenn:** Ein belegter Kundenerfolg mit Freigabe.
- **Nicht verwenden:** Ohne Quelle oder Freigabe des Kunden.
- **Position:** Beweis-Kapitel, gern neben einem Video mit Text.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 56 Video mit Text · 36 Zitat

### 36 Zitat

- **Zweck:** Ein Kundenzitat mit Name und Firma, lila Linie links.
- **Einsetzen wenn:** Eine Aussage stützt das Kapitel direkt davor.
- **Nicht verwenden:** Ohne Freigabe der zitierten Person.
- **Position:** Nach einem Sachkapitel.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 31 Vorher und Nachher · 06 Lesespalte

### 37 Stimmen-Raster

- **Zweck:** Drei Kundenstimmen mit rundem Foto nebeneinander.
- **Einsetzen wenn:** Sozialer Beweis vor dem Preis.
- **Nicht verwenden:** Zusammen mit dem Stimmen-Karussell; nicht ohne Freigaben der Personen.
- **Position:** Vor den Preisen oder dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 39 Kundenlogo-Band · 46 Preiskarten mit Empfehlung

### 38 Stimmen-Karussell

- **Zweck:** Viele Kundenstimmen platzsparend; läuft automatisch und endlos.
- **Einsetzen wenn:** Mehr als drei freigegebene Stimmen.
- **Nicht verwenden:** Zusammen mit dem Stimmen-Raster; nicht ohne Freigaben.
- **Position:** Vor den Preisen oder dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 58 Video-Karussell quer · 39 Kundenlogo-Band

### 39 Kundenlogo-Band

- **Zweck:** Laufende Reihe echter Kundenlogos.
- **Einsetzen wenn:** Vertrauen früh auf der Seite aufbauen.
- **Nicht verwenden:** Neben dem Laufband mit Schlagworten; nicht mit Logos ohne echte Kundenbeziehung.
- **Position:** Direkt nach dem Hero oder vor dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 01 Hero mit Porträt · 33 Kennzahlen-Kacheln

### 40 Vertrauenszeile

- **Zweck:** Eine Zeile Vertrauenssignale zwischen zwei Linien.
- **Einsetzen wenn:** Kurz vor oder nach einem Knopf (Partnerstatus, Aufzeichnung).
- **Nicht verwenden:** Mit Abzeichen ohne gültige Berechtigung (Nutzung des Gold-Partner-Status vorher prüfen).
- **Position:** Unter einer Handlungsaufforderung oder unter dem Kundenlogo-Band.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 68 CTA-Zeile · 39 Kundenlogo-Band

## Ablauf und Termine

Elemente 41 bis 45

### 41 Zeitstrahl

- **Zweck:** Schritte mit Reihenfolge, versetzt an einer durchgehenden Linie.
- **Einsetzen wenn:** Was nach der Buchung passiert, drei bis sechs Schritte.
- **Nicht verwenden:** Für gleichwertige Bestandteile ohne Reihenfolge.
- **Position:** Nach dem Preis oder vor dem Abschluss.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 42 Fortschritt in Schritten · 71 Gelbe CTA-Box

### 42 Fortschritt in Schritten

- **Zweck:** Drei Schritte nebeneinander; die Linie zum nächsten Schritt leuchtet.
- **Einsetzen wenn:** Zeigen, wo jemand gerade steht (Onboarding, Bestätigungsseiten).
- **Nicht verwenden:** Ohne aktiven Schritt — dafür Zeitstrahl oder Karten mit großer Ziffer.
- **Position:** Danke-Seiten, Onboarding.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 17 Hinweis-Box Erfolg · 44 Termin-Karten

### 43 Wochenrhythmus

- **Zweck:** Montag bis Freitag mit den festen Terminen eines Programms.
- **Einsetzen wenn:** Der wiederkehrende Rhythmus (Check-in, Arbeitssession).
- **Nicht verwenden:** Für einmalige Termine; nicht im selben Kapitel wie die Termin-Karten.
- **Position:** Angebotsbeschreibung.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 21 Karten zentriert mit Symbol · 14 Hinweis-Box Info

### 44 Termin-Karten

- **Zweck:** Feste Termine als Kalenderblatt mit Beschreibung.
- **Einsetzen wenn:** Zwei bis vier wiederkehrende Termine.
- **Nicht verwenden:** Im selben Kapitel wie der Wochenrhythmus.
- **Position:** Angebotsbeschreibung oder Onboarding.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 14 Hinweis-Box Info · 42 Fortschritt in Schritten

### 45 Selbstcheck zum Anklicken

- **Zweck:** Besucher haken Voraussetzungen selbst an.
- **Einsetzen wenn:** Vor einem Probeangebot, um die Entscheidung zu erleichtern.
- **Nicht verwenden:** Als Formular — es wird nichts gesendet.
- **Position:** Vor dem Preis oder der Sicherheitsbox.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 30 Passt / Passt nicht · 53 Sicherheitsbox Probeangebot

## Preise und Angebote

Elemente 46 bis 55

### 46 Preiskarten mit Empfehlung

- **Zweck:** Zwei bis drei Angebote mit Preis; die Empfehlung höher, mit Verlauf und Lichtband.
- **Einsetzen wenn:** Zwischen Angeboten wählen lassen.
- **Nicht verwenden:** Für ein einzelnes Angebot — dafür Paketinhalt plus Knopf.
- **Position:** Nach den Beweisen.
- **Häufigkeit:** Einmal pro Seite.
- **Passt zu:** 48 Vergleichstabelle · 53 Sicherheitsbox Probeangebot

### 47 Sitz-Staffel

- **Zweck:** Preis je Anzahl Sitze als drei Karten.
- **Einsetzen wenn:** Gestaffelte Preise nach Menge.
- **Nicht verwenden:** Zusammen mit Einfacher Tabelle oder Staffel-Balken für dieselben Preise.
- **Position:** Preiskapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 50 Ersparnis-Zeile · 46 Preiskarten mit Empfehlung

### 48 Vergleichstabelle

- **Zweck:** Zwei Angebote Merkmal für Merkmal; die empfohlene Spalte leuchtet oben.
- **Einsetzen wenn:** Besucher schwanken zwischen zwei Angeboten.
- **Nicht verwenden:** Für mehr als drei Spalten; kein Band darunter (Guide 07).
- **Position:** Nach den Preiskarten.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 46 Preiskarten mit Empfehlung · 32 Reiter (Tabs)

### 49 Einfache Tabelle

- **Zweck:** Schlichte Daten in Zeilen.
- **Einsetzen wenn:** Preise, Sitze oder technische Angaben ohne Hervorhebung.
- **Nicht verwenden:** Für Vergleiche mit Empfehlung — dafür die Vergleichstabelle; kein Band darunter.
- **Position:** Überall, wo Daten stehen.
- **Häufigkeit:** Beliebig.
- **Passt zu:** 06 Lesespalte · 15 Hinweis-Box Achtung

### 50 Ersparnis-Zeile

- **Zweck:** Alter Preis rot durchgestrichen, neuer Preis, Begründung.
- **Einsetzen wenn:** Ein Paket ist nachweislich günstiger als die Einzelpreise.
- **Nicht verwenden:** Mit erfundenen Vergleichspreisen.
- **Position:** Direkt unter den Preisen.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 47 Sitz-Staffel · 46 Preiskarten mit Empfehlung

### 51 Paketinhalt

- **Zweck:** Alles, was in einem Angebot steckt, als Liste neben einem Symbol.
- **Einsetzen wenn:** Ein einzelnes Angebot zusammenfassen.
- **Nicht verwenden:** Für Dinge, die nicht zum Leistungsumfang gehören (FernUSG: z. B. Builds nur als Preisvorteil nennen).
- **Position:** Vor dem Preis oder dem Knopf.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 53 Sicherheitsbox Probeangebot · 71 Gelbe CTA-Box

### 52 Staffel-Balken

- **Zweck:** Preisstaffel als Balken, durch die im Loop ein Licht läuft.
- **Einsetzen wenn:** Eine Mengenstaffel anschaulich machen.
- **Nicht verwenden:** Zusammen mit der Sitz-Staffel für dieselben Preise.
- **Position:** Preiskapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 50 Ersparnis-Zeile · 49 Einfache Tabelle

### 53 Sicherheitsbox Probeangebot

- **Zweck:** Grüner Kasten mit risikoarmem Einstieg und grünem Knopf.
- **Einsetzen wenn:** Es gibt ein echtes Probeangebot (Probe-Freitag, erster Monat).
- **Nicht verwenden:** Ohne echtes Probeangebot; nicht als Garantieversprechen.
- **Position:** Direkt nach den Preisen.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 46 Preiskarten mit Empfehlung · 45 Selbstcheck zum Anklicken

### 54 Zwei Wege zur Wahl

- **Zweck:** Zwei Angebote nebeneinander; das empfohlene mit lila Lichtband.
- **Einsetzen wenn:** Entscheidung zwischen allein und mit Team (Inner Circle oder KI-Werkstatt).
- **Nicht verwenden:** Für mehr als zwei Wege — dafür Preiskarten.
- **Position:** Vor dem Abschluss oder als Abzweig.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 48 Vergleichstabelle · 71 Gelbe CTA-Box

### 55 Angebots-Karussell

- **Zweck:** Alle Angebote als blätterbare Karten mit Preis.
- **Einsetzen wenn:** Startseite oder Seitenende, um weitere Angebote zu zeigen.
- **Nicht verwenden:** Auf einer Angebotsseite vor deren eigenem Preis.
- **Position:** Seitenende oder Startseite.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 26 Link-Karten · 72 Kontaktkarte mit Emma

## Video und Bild

Elemente 56 bis 64

### 56 Video mit Text

- **Zweck:** Kundenvideo mit Überschrift und Erklärung daneben.
- **Einsetzen wenn:** Ein Erfolgsvideo erzählt, was der Text belegt.
- **Nicht verwenden:** Ein Video ohne Text daneben (Emmas Regel).
- **Position:** Beweis-Kapitel; mehrere untereinander, Seiten im Wechsel.
- **Häufigkeit:** Bis zu dreimal pro Seite.
- **Passt zu:** 35 Ergebniskarte vorher/nachher · 36 Zitat

### 57 Video-Vorschau mit Play

- **Zweck:** Vorschaubild mit großem Play-Knopf für ein eigenes Erklärvideo.
- **Einsetzen wenn:** Ein Erklärvideo („So funktioniert’s“) oder ein Platzhalter, bis es fertig ist.
- **Nicht verwenden:** Für Kundenvideos — dafür Video mit Text.
- **Position:** Nach dem Hero.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 66 Play-Link · 01 Hero mit Porträt

### 58 Video-Karussell quer

- **Zweck:** Viele Kundenvideos blätterbar; öffnen in der Lightbox.
- **Einsetzen wenn:** Mehr als drei Erfolgsvideos.
- **Nicht verwenden:** Zusammen mit dem hochkanten Video-Karussell oder der Video-Bühne.
- **Position:** Beweis-Kapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 37 Stimmen-Raster · 69 CTA-Karte mit Lichtband

### 59 Video-Karussell hochkant

- **Zweck:** Wie das Video-Karussell, im Hochformat mit der Person im Vordergrund.
- **Einsetzen wenn:** Der persönliche Eindruck zählt mehr als der Text im Standbild.
- **Nicht verwenden:** Zusammen mit dem queren Video-Karussell oder der Video-Bühne.
- **Position:** Beweis-Kapitel.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 39 Kundenlogo-Band · 37 Stimmen-Raster

### 60 Video-Bühne mit Liste

- **Zweck:** Großes Video, daneben eine scrollbare Liste zum Wechseln.
- **Einsetzen wenn:** Eine Sammlung vieler Videos (Erfolgsgeschichten-Seite).
- **Nicht verwenden:** Auf Verkaufsseiten, wo ein Video reicht.
- **Position:** Hauptteil einer Video-Seite.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 33 Kennzahlen-Kacheln · 36 Zitat

### 61 Bild-Karussell mit Lightbox

- **Zweck:** Fotos mit Beschriftung blätterbar; öffnen groß in der Lightbox.
- **Einsetzen wenn:** Eindrücke aus Formaten (Sessions, Check-ins).
- **Nicht verwenden:** Für Kundenfotos ohne Freigabe; keine KI-Gesichter von Kunden; nicht zusammen mit der Bild-Galerie.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 05 Text neben Bild · 24 Bildkarten

### 62 Bild-Galerie mit Lightbox

- **Zweck:** Mehrere Fotos im Raster, das erste groß; öffnen in der Lightbox.
- **Einsetzen wenn:** Eine Galerie zu einem Format oder Termin.
- **Nicht verwenden:** Zusammen mit dem Bild-Karussell; keine KI-Gesichter von Kunden.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 24 Bildkarten · 05 Text neben Bild

### 63 Spotlight mit Glaskarten

- **Zweck:** Ein Foto mit pulsierenden Punkten und kurzen Glaskarten daneben.
- **Einsetzen wenn:** Drei Merkmale eines Formats am Bild zeigen.
- **Nicht verwenden:** Für mehr als drei Karten oder Fotos ohne klare Motive.
- **Position:** Hauptteil.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 34 Kennzahlen in Glas · 05 Text neben Bild

### 64 Glas-Panel über Bild

- **Zweck:** Großes Foto mit transparenter Box für Headline und Knopf.
- **Einsetzen wenn:** Emotionaler Abschluss mit Emma-Foto, als Alternative zum CTA-Band mit Emma.
- **Nicht verwenden:** Zusammen mit dem CTA-Band mit Emma.
- **Position:** Seitenende.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 34 Kennzahlen in Glas · 72 Kontaktkarte mit Emma

## Handlungsaufforderungen

Elemente 65 bis 72

### 65 Knopf mit Textlink

- **Zweck:** Gelber Hauptknopf, daneben ein leiser zweiter Weg als Textlink.
- **Einsetzen wenn:** Standard am Ende eines Verkaufskapitels.
- **Nicht verwenden:** Zwei gelbe Knöpfe nebeneinander; kein gelber Knopf im Hero neben einem Marker.
- **Position:** Ende eines Kapitels.
- **Häufigkeit:** Etwa nach jedem zweiten bis dritten Kapitel; pro Kapitel ein gelber Knopf.
- **Passt zu:** 18 Handschrift-Notiz mit Pfeil · 40 Vertrauenszeile

### 66 Play-Link

- **Zweck:** Runder Play-Knopf mit Text, führt zu einem Video.
- **Einsetzen wenn:** Neben dem Hero-Knopf zu einem Erklärvideo.
- **Nicht verwenden:** Als Ersatz für den Hauptknopf.
- **Position:** Im Hero, neben dem Knopf.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 01 Hero mit Porträt · 57 Video-Vorschau mit Play

### 67 Knopf-Varianten

- **Zweck:** Knopf mit Pfeil, mit Rand, klein, lila oder grün — für Nebenwege und besondere Flächen.
- **Einsetzen wenn:** Rand für die zweite Wahl, klein in Karten, lila in lila Karten, grün in der Sicherheitsbox.
- **Nicht verwenden:** Mehrere Varianten gleichrangig nebeneinander.
- **Position:** In Karten, Preisen und Nebenwegen.
- **Häufigkeit:** Nach Bedarf; pro Kapitel bleibt ein Knopf der wichtigste.
- **Passt zu:** 46 Preiskarten mit Empfehlung · 54 Zwei Wege zur Wahl

### 68 CTA-Zeile

- **Zweck:** Schmale Zeile mit Frage, Satz und Knopf.
- **Einsetzen wenn:** Leise Handlungsaufforderung mitten in einer Seite.
- **Nicht verwenden:** Als Seitenabschluss — dafür CTA-Band mit Emma oder gelbe CTA-Box.
- **Position:** Zwischen Kapiteln.
- **Häufigkeit:** Höchstens zweimal pro Seite.
- **Passt zu:** 40 Vertrauenszeile · 06 Lesespalte

### 69 CTA-Karte mit Lichtband

- **Zweck:** Zentrierte Karte mit lila Knopf und Textlink, Lichtband am Rand.
- **Einsetzen wenn:** Zwischenabschluss auf langen Seiten.
- **Nicht verwenden:** Direkt vor der gelben CTA-Box.
- **Position:** Mitte oder zweites Drittel der Seite.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 20 Brief von Emma · 58 Video-Karussell quer

### 70 CTA-Band mit Emma

- **Zweck:** Breites Band mit Emma-Foto und abschließender Aufforderung.
- **Einsetzen wenn:** Persönlicher Seitenabschluss auf Angebotsseiten.
- **Nicht verwenden:** Zusammen mit dem Glas-Panel über Bild; nicht unter Tabellen oder Formularen (Guide 07).
- **Position:** Seitenende.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 11 Trenner mit Handschrift · 71 Gelbe CTA-Box

### 71 Gelbe CTA-Box

- **Zweck:** Gelber Kasten mit großer, schwarz hinterlegter Headline und schwarzem Knopf.
- **Einsetzen wenn:** Der Schlusspunkt einer Seite oder ein klares Einzelangebot.
- **Nicht verwenden:** Öfter als einmal; nicht auf einer Ansicht mit dem Merksatz mit gelber Fläche.
- **Position:** Ganz am Ende, vor dem Fuß.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 41 Zeitstrahl · 11 Trenner mit Handschrift

### 72 Kontaktkarte mit Emma

- **Zweck:** Foto, kurze Frage und Knopf zur Beratungsstunde.
- **Einsetzen wenn:** Für Unentschlossene, die erst sprechen möchten.
- **Nicht verwenden:** Als einziger Abschluss einer Kaufseite.
- **Position:** Nach dem Hauptabschluss oder am Ende der Fragen.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 73 Fragen zum Aufklappen · 55 Angebots-Karussell

## Fragen, Formulare, Weiterlesen

Elemente 73 bis 76

### 73 Fragen zum Aufklappen

- **Zweck:** Häufige Fragen, immer nur eine offen; liefert FAQ-Daten für Suchmaschinen.
- **Einsetzen wenn:** Einwände und Details vor der Entscheidung klären.
- **Nicht verwenden:** Für Inhalte, die jeder lesen muss.
- **Position:** Vor dem Abschluss.
- **Häufigkeit:** 1 Fragenblock pro Seite mit 3–8 Fragen.
- **Passt zu:** 72 Kontaktkarte mit Emma · 71 Gelbe CTA-Box

### 74 E-Mail-Eintrag

- **Zweck:** Ein Feld und ein Knopf für eine Benachrichtigungsliste.
- **Einsetzen wenn:** Etwas ist noch nicht verfügbar (Builds, Warteliste).
- **Nicht verwenden:** Für Kontaktanfragen — dafür das Formular.
- **Position:** Dort, wo das Produkt beschrieben wird.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 17 Hinweis-Box Erfolg · 75 Formular

### 75 Formular

- **Zweck:** Formular mit allen Feldtypen; fehlende Pflichtfelder werden im Formular markiert.
- **Einsetzen wenn:** Kontakt, Anfrage oder Benachrichtigung mit Auswahl.
- **Nicht verwenden:** Ohne Einwilligung und Link zur Datenschutzerklärung; kein Band darunter (Guide 07).
- **Position:** Eigenes Kapitel, meist am Seitenende.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 17 Hinweis-Box Erfolg · 72 Kontaktkarte mit Emma

### 76 Blogkarten

- **Zweck:** Die neuesten drei Beiträge als Karten.
- **Einsetzen wenn:** Weiterlesen am Ende von Wissens- oder Über-mich-Seiten.
- **Nicht verwenden:** Auf Kaufseiten vor dem Abschluss.
- **Position:** Seitenende.
- **Häufigkeit:** Höchstens einmal pro Seite.
- **Passt zu:** 13 Schlagwort-Wolke · 72 Kontaktkarte mit Emma