{ "schema": "fundus-rezept/1", "stand": "02.11.2026", "basis": { "stand": "02.11.2026 (Runde 5: Redaktion nach KI-Audit und Lückenrecherche)", "muster": [ "vt-cross-document-mpa", "css-view-reveal-nativ", "unterstreichung-varianten", "button-zustaende", "validierung-nach-interaktion", "consent-banner-gestaltet", "fokus-stil-system", "sprunglinks-landmarken", "bewegung-pausieren-schalter", "fehlerseite-leerzustand", "dialog-modal-nativ", "zoom-und-textabstand-robust", "kontrastmodus-forced-colors", "firmendaten-strukturiert", "sofort-navigation-vorladen" ], "beschreibung": "Grundausstattung, die jedes Rezept ohne Nennung bekommt: native Seitenübergänge zwischen echten Seiten (vt-cross-document-mpa) und Vorladen der Hauptwege (sofort-navigation-vorladen), beides nicht bei Onepagern; native Scroll-Reveals nur wo sinnvoll, Link-Unterstreichung, vollständige Button-Zustände, Validierung erst nach Interaktion, ein gestaltetes Consent-Banner, Fehlerseite und Leerzustand, natives Dialog-Modal und eine einzige Datenquelle für Firmendaten, aus der Kontaktblock, Öffnungszeiten und JSON-LD entstehen (firmendaten-strukturiert). Dazu die Barrierefreiheit der Kategorie zugang: sichtbarer Fokus, Sprunglinks und Landmarken, Pause für Bewegung, 200 % Zoom und Textabstände ohne Abschneiden (zoom-und-textabstand-robust), Kontrastmodus (kontrastmodus-forced-colors). In Sektionen dürfen Basis-Muster genannt werden, wenn sie dort besonders wichtig sind (z. B. Formular-Validierung); in den Kategorie-Listen der Rezepte stehen sie nicht.", "regeln": [ "Keine Schrift kommt in mehr als 3 Rezepten vor (headline, text und akzent zusammen gezählt, alternative_eigenprojekt ausgenommen).", "Ein Rezept darf Headline- und Textschrift nicht 1:1 mit einem anderen Rezept teilen.", "Pflichtfeld signatur: 1–2 Muster, die kein anderes Rezept nutzt (Basis ausgenommen); jedes Signatur-Muster steht auch in den Muster-Listen des Rezepts.", "cinematic-video-hero nur mit eigenem, hochwertigem Footage. Für typische KMU-Kunden (Gastro, Mode/Concept Store) ist ein Foto-Hero Standard, Video steht unter hero_variante.", "Kontakt/Anfrage, Online-Termin und Anfahrt sind eigene Sektionen (kontakt-anfrage-formular bzw. mehrschritt-anfrage, termin-buchung-zwei-klick, karte-zwei-klick, oeffnungszeiten-status), auch wenn ein Rezept sie nicht nennt; die Adresse steht immer auch als Text da; studio-visitenkarte-footer steht nur im Footer.", "Drittanbieter-Inhalte (Video, Karte, Buchung, Social Feeds) erst nach Einwilligung bzw. Klick laden.", "Höchstens ein Material-Effekt (Glow, Verlaufsrahmen, Raster, Textur) pro Ansicht.", "Automatisch bewegte Inhalte (Laufband, Wortwechsel, Autoplay) nie für wichtige Information; immer pausierbar und unter prefers-reduced-motion statisch.", "Barrierefreiheit gehört zur Grundausstattung (BFSG seit 28.06.2025): sichtbarer Fokus (fokus-stil-system), Sprunglinks und Landmarken, Pause für alles, was sich länger als 5 s bewegt (bewegung-pausieren-schalter), native Dialoge, 200 % Zoom und 320 px Breite ohne Abschneiden (zoom-und-textabstand-robust), Kontrastmodus prüfen (kontrastmodus-forced-colors). Rechtliches (Erklärung zur Barrierefreiheit) vom Kunden prüfen lassen.", "Firmendaten (Name, Adresse, Telefon, Zeiten samt Sonderzeiten, Leistungen, Profil-Links) aus einer Quelle; JSON-LD nur für sichtbare Inhalte, keine eigenen Bewertungssterne im Markup (firmendaten-strukturiert).", "Wer online Verträge mit Verbrauchern schließt (Shop, Kurs, Abo, Mitgliedschaft, Online-Anmeldung), braucht im Footer ohne Login „Vertrag widerrufen“ und bei Dauerverträgen „Verträge hier kündigen“ (widerruf-und-kuendigung-schaltflaeche, seit 19.06.2026) – vom Kunden prüfen lassen.", "Bewertungen von Google oder anderen Plattformen nur mit Echtheitshinweis direkt an den gezeigten Bewertungen (bewertungsprofil-mit-echtheitshinweis); bewertungen-verteilung nur für eigene, geprüfte Bewertungen.", "Pflichtangaben (Impressum, Datenschutzerklärung, Branchenpflichten aus Leitfaden 8a und den Rezept-regeln) als Seiten, Links oder markierte Platzhalter; keine Rechtstexte erfinden, alles vom Kunden prüfen lassen. Chatbots und KI-Funktionen direkt beim Start kennzeichnen (Art. 50 KI-VO), keine pauschalen Umweltaussagen ohne Nachweis.", "consent-banner-gestaltet nur, wenn beim Laden einwilligungspflichtige Dienste laufen. Laden alle Dritten erst per 2-Klick, genügt ein Einstellungs-Dialog im Footer („Datenschutz-Einstellungen“) zum Widerrufen.", "Starter- und Beispielseiten ohne echte Daten: Bewertungen, Preise, Allergene und Kennzahlen als markierte Platzhalter, nie erfundene Kundenstimmen als echt.", "Werbung mit Rate, Zins, „0 %“, Ratenzahlung, Leasing oder „später bezahlen“ braucht ab 20.11.2026 finanzierung-pflichtangaben: effektiver Jahreszins mindestens so groß wie die Rate, Warnhinweis „Achtung! Kreditaufnahme kostet Geld.“ direkt dabei (vom Kunden prüfen lassen).", "Verkauf von Waren an Verbraucher braucht seit 27.09.2026 den EU-Hinweis zur gesetzlichen Gewährleistung (eu-gewaehrleistungshinweis), mindestens als Footer-Link, sicherer an Produktseite und Checkout; nur die amtliche Vorlage der EU-Kommission." ], "herkunft": "Art-Director-Prüfung der 18 Rezepte, Runde 3 (Basis-Block, Signatur-Pflichtfeld, Schriftverteilung, 2-Klick-Muster). Runde 5 (02.11.2026): zugang-Muster, Firmendaten und Vorladen in die Grundausstattung, Regeln zu Kontakt, Verträgen, Bewertungen und Pflichtangaben (KI-Audit Befund 3, Lückenrecherche N1–N3, N6, K5)." }, "id": "arbeitgeber-karriere", "name": "Arbeitgeber: Einblick statt Floskel", "branche": "Karriereseite und Recruiting-Microsite eines KMU (Handwerk, Pflege, Industrie, Gastronomie, Handel)", "stimmung": [ "ehrlich", "nahbar", "konkret", "warm" ], "kurz": "Eine Seite für Menschen, die gerade einen Job suchen, oft am Handy und in der Pause: oben das echte Angebot mit Gehaltsspanne, darunter die offenen Stellen und eine Kurzbewerbung ohne Anschreiben. Danach erst die Einblicke: eine Collage aus echten Handyfotos des Teams, ein Tag im Betrieb als waagerechte Zeitleiste, Stimmen mit Namen und Benefits als Zahlen statt Icons. Funnel Display und Funnel Sans, Kreide und Tannengrün, Klatschmohn nur für „Bewerben“. Fotos und Zettel landen wie Sticker mit einem kleinen Überschwinger, Menüs und Formulare bleiben ruhig. Anders als pflege (zweite Startseite im Dienstleister-Auftritt) ist das hier ein eigener Auftritt nur fürs Recruiting, für jede Branche.", "referenzen": [ { "seite": "MFM Elektrotechnik (Elektromeisterbetrieb, Wunstorf / Bad Nenndorf; Stellenseite)", "url": "https://karriere.mfm.energy/stelle/elektroniker-energie-gebaeudetechnik-bad-nenndorf/", "art": "website", "herkunft": "beobachtet", "abgerufen": "2026-11-02", "quelle": "https://karriere.mfm.energy/stelle/elektroniker-energie-gebaeudetechnik-bad-nenndorf/", "beobachtung": "Live geprüft 02.11.2026 (Seite per WebFetch als Text abgerufen; CSS, Schriften und Kurven nicht gemessen): Betrieb mit „rund zehn Leuten“, Stelle mit Gehaltsspanne „19,50 bis 25,00 € pro Stunde brutto“, 38 Stunden, 30 Urlaubstage; Probetag „einen Tag mitfahren“ mit Baustellen, Werkzeug und Kollegen; Anschreiben und Zeugnisse optional; Ansprechperson mit Name, E-Mail und Telefon. Nicht übernehmen: Gehaltsvorstellung als Formularfeld, Lebenslauf als Pflicht, keine Team-Stimmen, Ansprechperson ohne Foto." }, { "seite": "Kälte-Bast (Kälte- und Klimatechnik, Hamburg; Azubi-Microsite)", "url": "https://karriere.kaelte-bast.de/azubi", "art": "website", "herkunft": "beobachtet", "abgerufen": "2026-11-02", "quelle": "https://karriere.kaelte-bast.de/azubi", "beobachtung": "Live geprüft 02.11.2026 (WebFetch als Text): eigene Microsite eines Familienbetriebs (75 Jahre), Formular „nicht länger als 30 Sekunden“, kein Anschreiben, kein Lebenslauf; Ablauf Formular → Telefonat → Gespräch vor Ort oder per Video; konkrete Benefits (30 Tage Urlaub, „4 1/2 Tage“-Woche, Jobrad, Arbeitskleidung, Smartphone und Tablet, Betriebsarzt); Geschäftsführung und Personalleitung mit Namen. Nicht übernehmen: „weit über dem Tarif“ ohne Betrag, keine Stimmen, ein Bild dreimal." }, { "seite": "Siloanlagen Achberg (Anlagenbau, Achberg; Ausbildungsstelle Mechatroniker)", "url": "https://www.achberg.com/karriere/ausbildung/ausbildung-zum-mechatroniker-m-w-d/", "art": "website", "herkunft": "beobachtet", "abgerufen": "2026-11-02", "quelle": "https://www.achberg.com/karriere/ausbildung/ausbildung-zum-mechatroniker-m-w-d/", "beobachtung": "Live geprüft 02.11.2026 (WebFetch als Text): Vergütung je Ausbildungsjahr in Euro (1.300 / 1.400 / 1.500 / 1.600 €), Benefits als Klartext-Liste („30 TAGE URLAUB“, „KEINE SCHICHTARBEIT UND FLEXIBLE ARBEITSZEITEN“, Kinderbetreuungszuschuss, betriebliche Altersvorsorge), Start ohne Unterlagen mit Telefonat oder Rückruf-Formular, Ansprechperson Personal mit Durchwahl, Stimme eines Azubis mit Vornamen und eines Abteilungsleiters. Nicht übernehmen: 3,5 Jahre Ausbildung, aber vier Vergütungsjahre ohne Erklärung." }, { "seite": "Autohaus Siemon (Münster; Ausbildungsstelle Kfz-Mechatroniker)", "url": "https://autohaus-siemon.de/karriere/azubi-kfz-mechatroniker-m-w-d-in-muenster-08-26/", "art": "website", "herkunft": "beobachtet", "abgerufen": "2026-11-02", "quelle": "https://autohaus-siemon.de/karriere/azubi-kfz-mechatroniker-m-w-d-in-muenster-08-26/", "beobachtung": "Live geprüft 02.11.2026 (WebFetch als Text): Bewerbung in drei Schritten, wahlweise klassisch oder per Video-Link, Startdatum der Ausbildung genannt. Als Gegenbeispiel aufgenommen: „Ohne Anschreiben und ohne Lebenslauf“ im Intro, aber im klassischen Weg Anschreiben, Lebenslauf und Zeugnisse als Pflicht; Vergütung nur „attraktiv und leistungsgerecht“; keine Stimmen, keine Ansprechperson mit Namen." } ], "schrift": { "paarung_basis": "", "abweichung": "Neue Paarung aus einer Superfamilie, beide template_ok. funnel-display (NORD ID) steht in keinem anderen Rezept; die trichterförmig geschnittenen Strichenden geben großen, kurzen Sätzen („19,50 bis 25 € die Stunde.“) Charakter, ohne verspielt zu werden. funnel-sans ist damit in zwei Rezepten (fitness nutzt sie als Text neben Anybody) und hat Tabellenziffern (im Font geprüft: tnum vorhanden) für Gehälter, Uhrzeiten und Urlaubstage. Bewusst ohne Handschrift-Akzent: Notizen in der Collage sind echte Fotos von Zetteln oder stehen in Funnel Sans kursiv, keine Fake-Handschrift. Unterschied zu pflege (Literata + Hanken, Pflaume), kurs (Bricolage + Onest + Shantell) und fitness (Anybody + Funnel Sans + Mono): kein Serif, keine Mono, Display aus derselben Familie wie der Text.", "headline": "funnel-display", "text": "funnel-sans", "akzent": "", "groessen": "h1 Funnel Display clamp(2.5rem, 1.6rem + 3.8vw, 4.75rem), wght 700, Laufweite -0.03em, Zeilenhöhe 0.96; h2 clamp(1.75rem, 1.3rem + 2vw, 3rem), wght 600, -0.02em; h3 Funnel Sans 1.25rem wght 600. Fließtext Funnel Sans 1.125rem (18 px), wght 400, Zeilenhöhe 1.6, max. 62ch. Gehaltsspanne in Stellenkarten Funnel Sans 1.25rem wght 700 Tabellenziffern („3.100–3.600 € brutto im Monat“); Uhrzeiten in der Tageszeitleiste Funnel Display 2rem wght 600 Tabellenziffern; Bildunterschriften (Name, Aufgabe, Datum) Funnel Sans 0.875rem wght 500; Zettel in der Collage Funnel Sans kursiv 1rem. Höchstens zwei Gewichte je Familie im Text (400/700).", "techniken": [ "fluide-typo-clamp-cqi", "headline-laufweite-zeilenabstand", "tabellenziffern", "lesesatz-text-wrap", "text-box-trim" ], "alternative_eigenprojekt": "Headline cabinet-grotesk in 700, Text general-sans (beide ITF) – nur für Eigenprojekte, nicht für Templates." }, "farbe": { "prinzip": "Kreide als Grund, Tinte statt Schwarz, Tannengrün als Hausfarbe für die dunklen Sektionen (Ein Tag als …, Stimmen, Fußzeile), Klatschmohn nur für „Bewerben“ und den aktiven Schritt der Kurzbewerbung. Auf Tannengrün steht der Bewerben-Knopf mit 2 px Kreide-Rand (Klatschmohn auf Tannengrün hat nur 1,9 : 1). Die echten Fotos bringen die übrige Farbe; im Projekt ersetzt die Hausfarbe des Arbeitgebers das Tannengrün, der Signalton bleibt ein einziger.", "beispiel": [ "#F6F3EC Grund Kreide", "#161616 Text Tinte (16,3 : 1)", "#5A5650 Sekundärtext, Bildunterschrift, Stand-Datum (6,6 : 1)", "#EFE6D2 Zettel und Hinweisflächen (Tinte darauf 14,6 : 1)", "#1D4A3A Tannengrün: dunkle Sektionen, Fußzeile (Kreide darauf 9,1 : 1)", "#C8382A Signal Klatschmohn: Bewerben, aktiver Schritt (Weiß darauf 5,2 : 1; auf Kreide 4,7 : 1; auf Tannengrün nur mit 2 px Kreide-Rand)" ] }, "animationsstil": "token-federnd-verspielt", "animationsstil_hinweis": "Federn nur auf kleinen und mittleren Teilen, die ankommen: die Fotos und Zettel der Collage beim Laden (einmal), der Haken nach dem Absenden der Kurzbewerbung, Druck auf Knöpfe, aktive Filter-Chips. Nie auf Deckkraft (200 ms linear), nie auf Flächen über die halbe Breite, nie auf Text. Menü, Akkordeon, Schritte der Kurzbewerbung und Dialoge laufen über animationsstil_ui token-toggle-asymmetrisch (öffnen 280 ms, schließen 190 ms), weil token-federnd-verspielt große Flächen ausschließt. Die Tageszeitleiste ist scrollgebunden und linear.", "bewegung": { "easing": "cubic-bezier(0.34, 1.56, 0.64, 1) (token-federnd-verspielt, Spielart Überschwinger, nur Transform kleiner Elemente); UI über token-toggle-asymmetrisch: cubic-bezier(0.16, 1, 0.3, 1) öffnen, cubic-bezier(0.7, 0, 0.84, 0) schließen", "beobachtet": "nicht gemessen: Referenzen nur inhaltlich per WebFetch geprüft (siehe offen); Kurven und Dauern aus den Animationsstilen", "dauer_ms": "150 (Druck, Farbe, Schatten; Farbe linear), 400 (Knopf-Hover, Haken nach dem Absenden), 500 (Ankunft der Collage-Teile, Versatz 50 ms, Weg höchstens 48 px, Drehung auf den Endwinkel); UI: 280 öffnen, 190 schließen (Menü, Akkordeon, Schritt der Kurzbewerbung, Dialog)", "regel": "Die Collage kommt einmal an und steht dann still (keine Parallaxe, kein Ziehen). Überschwingen nur auf Transform von Fotos, Zetteln, Haken und Knöpfen, nie auf Deckkraft, nie auf Flächen über die halbe Breite. Stellen, Gehälter und Formular stehen sofort, keine Einblendungen beim Scrollen. Die Tageszeitleiste läuft nur, solange gescrollt wird; auf dem Telefon ist sie eine native Wischleiste ohne Pin. Bei prefers-reduced-motion stehen alle Fotos an ihrem Platz (Rückfall cubic-bezier(0, 0, 0.58, 1), 200 ms), die Zeitleiste ist eine senkrechte Liste.", "herkunft": "Kurve, Landen (translate 48 px auf Touch, Rotation auf Endwinkel, Deckkraft 200 ms linear) und Druck (scale 0.95, 150 ms) aus token-federnd-verspielt (bau.werte, Variante ueberschwinger: Karten 500 ms, UI 400 ms); UI-Paar aus token-toggle-asymmetrisch auf UI-Maß gekürzt. Collage-Aufbau aus collage-scrapbook, dessen Kurve (easeInOutCubic) durch die des Stils ersetzt. Referenzen inhaltlich geprüft, CSS nicht gemessen." }, "hero_beschreibung": "Collage aus fünf bis sieben echten Fotos aus dem Betrieb (Handyfotos reichen: Werkbank, Tourauto, Küche, Pausenraum, Menschen bei der Arbeit, alle mit Einwilligung), leicht gedreht auf einem verdeckten 12er-Raster, dazu ein Zettel mit einem echten Satz aus dem Team. Links davon die H1 mit dem konkreten Angebot („Elektroniker:in in Wunstorf. 19,50 bis 25 € die Stunde, 38 Stunden, Freitag früher Schluss.“), darunter „Offene Stellen“ und „In zwei Minuten bewerben“ sowie die Ansprechperson mit Foto, Telefon und WhatsApp. Mobil drei bis vier Fotos im Hochformat unter der H1. Ohne eigenes Bildmaterial entfällt die Collage (wann_nicht) und der Hero wird ein einzelnes echtes Teamfoto; das Rezept verlangt aber eigenes Material, also vorher einen halben Tag mit dem Handy fotografieren. Kein Imagefilm im Hero, keine Stockfotos.", "muster": { "seitenuebergang": [], "preloader": [], "navigation": [ "mobile-bottom-navigation" ], "hero": [ "collage-scrapbook" ], "hero_variante": [], "sektionen": [ { "zweck": "Offene Stellen (Titel geschlechtsneutral oder mit (m/w/d), Ort, Stunden, Gehaltsspanne oder Tarifgruppe, Start, Schicht oder Tour; ab vier Stellen Filter nach Bereich, Ort, Teilzeit; jede Stelle mit eigener Seite und JobPosting-Daten; Initiativbewerbung darunter)", "muster": [ "stellen-karriere", "stellenseite-mit-jobposting" ], "varianten": { "stellen-karriere": "liste" } }, { "zweck": "Kurzbewerbung in zwei Minuten (Stelle, Name, Telefon oder E-Mail, Erfahrung als Auswahl, frühester Start; Lebenslauf freiwillig, kein Anschreiben, keine Frage nach dem bisherigen Gehalt; WhatsApp und Anruf als zweiter Weg; Bestätigung mit Name der Ansprechperson und Antwortfrist)", "muster": [ "mehrschritt-anfrage", "formular-fehlerzusammenfassung", "validierung-nach-interaktion", "datei-upload-ablage" ], "varianten": { "mehrschritt-anfrage": "ring", "formular-fehlerzusammenfassung": "kompakt", "datei-upload-ablage": "dokument" } }, { "zweck": "So läuft deine Bewerbung (Eingang sofort bestätigt → Anruf innerhalb von x Werktagen → Kennenlernen vor Ort oder per Video → Probetag, bezahlt oder nicht, klar gesagt → Zusage und erster Tag; Dauer je Schritt nur, wenn sie gehalten wird)", "muster": [ "prozess-timeline-wachsende-linie" ] }, { "zweck": "Ein Tag als … (je Beruf eine Strecke mit vier bis acht Stationen und Uhrzeit, von Schichtbeginn bis Feierabend: echte Fotos, ein Satz je Station, auch was anstrengend ist; auf dem Telefon als Wischleiste)", "muster": [ "horizontal-scroll-section" ] }, { "zweck": "Team-Stimmen (Vorname oder Name, Aufgabe, seit wann dabei, ein konkreter Satz statt Lob; kurze Videos nur mit Untertiteln und schriftlicher Einwilligung)", "muster": [ "testimonials-neu-gedacht", "eigener-videoplayer" ], "varianten": { "testimonials-neu-gedacht": "zitat", "eigener-videoplayer": "kapitel" } }, { "zweck": "Was du bekommst, konkret (Gehalt oder Tarif, Zuschläge in Prozent, Urlaubstage, Arbeitszeitmodell, Dienstwagen oder Jobrad mit Betrag, Weiterbildung mit Budget, Altersvorsorge mit Arbeitgeberanteil; und was es nicht gibt: Schicht, Wochenende, Bereitschaft)", "muster": [ "zahlen-fakten-section" ], "varianten": { "zahlen-fakten-section": "tabelle" } }, { "zweck": "Ausbildung und Einstieg (Berufe mit Dauer, Vergütung je Ausbildungsjahr, Berufsschule, Übernahme, Praktikum zum Reinschnuppern; Quereinstieg und Teilzeit-Ausbildung; Infos für Eltern)", "muster": [ "akkordeon-hoehe-auto" ], "varianten": { "akkordeon-hoehe-auto": "leistungen" } }, { "zweck": "Fragen vor der Bewerbung (Quereinstieg, Teilzeit, Führerschein, Deutschkenntnisse, Anerkennung ausländischer Abschlüsse, Barrierefreiheit des Arbeitsplatzes, Kinderbetreuung)", "muster": [ "akkordeon-hoehe-auto" ], "varianten": { "akkordeon-hoehe-auto": "faq" } }, { "zweck": "Deine Ansprechperson und der Weg zu uns (Foto, Name, Aufgabe, Telefon und WhatsApp mit Erreichbarkeit; Adresse als Text, Anfahrt mit Bus und Rad, Parken; Karte per 2-Klick)", "muster": [ "team-ueber-mich-layout", "oeffnungszeiten-status", "karte-zwei-klick" ], "varianten": { "team-ueber-mich-layout": "statement", "oeffnungszeiten-status": "termin", "karte-zwei-klick": "bild" } }, { "zweck": "Job-Alert (neue Stellen per E-Mail mit Double-Opt-in, Bereich wählbar; nur wenn wirklich verschickt wird) und Barrierefreiheit (eigene Seite als freiwilliger Aufbau)", "muster": [ "footer-newsletter-mit-persoenlichkeit", "barrierefreiheit-seite" ], "varianten": { "footer-newsletter-mit-persoenlichkeit": "basis", "barrierefreiheit-seite": "erklaerung" } } ], "scroll": [ "horizontal-scroll-section" ], "schrift_animation": [], "hover": [], "cursor": [], "mikro": [ "checkbox-radio-animiert", "einblenden-starting-style" ], "material": [], "galerie": [], "footer": [ "footer-newsletter-mit-persoenlichkeit", "studio-visitenkarte-footer" ], "button": [ "fuellung-vom-eintrittspunkt", "pfeil-icon-button" ] }, "signatur": [ "collage-scrapbook", "horizontal-scroll-section" ], "optional": [], "varianten_demo": { "fuellung-vom-eintrittspunkt": "basis", "pfeil-icon-button": "linie", "mobile-bottom-navigation": "fab", "studio-visitenkarte-footer": "basis", "footer-newsletter-mit-persoenlichkeit": "basis" }, "nicht_verwenden": [ "cinematic-video-hero – ein Imagefilm im Hero verdrängt Stellen und Gehalt und lädt lange; Videos gehören zu den Stimmen, mit Untertiteln", "zahlen-odometer – „98 % zufriedene Mitarbeitende“ hochgezählt ist die Floskel in Zahlen", "rotating-words / typewriter-natural – „Wir suchen dich als … Held:in“ versteckt, welche Stelle es wirklich gibt", "bento-grid-interaktiv / stapelkarten – Benefits als Icon-Kacheln sind genau die Floskel, die das Rezept vermeiden will; Benefits als Tabelle mit Zahlen", "logo-wand-social-proof – gekaufte Arbeitgebersiegel und Awards ohne Jahr und Quelle; echte Auszeichnungen als Textzeile mit Jahr", "graustufen-zu-farbe – die meisten Bewerbenden kommen per Handy und sähen die Farbe nie (wann_nicht)", "flick-karten-stapel – Signatur von friseur; außerdem Wischgeste statt lesbarer Liste", "corner-shape-eckenformen – Signatur von pflege", "konfetti-erfolg – nach der Bewerbung eine ruhige Bestätigung mit Name, Foto und Rückrufzeit der Ansprechperson", "prompt-hero-eingabefeld / ki-streaming-text-denkindikator – kein Chatbot statt Ansprechperson; wenn doch, beim Start gekennzeichnet (Art. 50 KI-VO)", "smooth-scroll-lenis / cursor-follower-lerp / magnetische-elemente – bremsen auf dem Handy und gehören zu Agenturseiten", "hide-on-scroll-header – „Bewerben“ und Telefon müssen immer erreichbar sein", "Stockfotos von lachenden Teams am Laptop, Daumen hoch und Puzzleteile – nur echte Menschen aus dem Betrieb, mit Einwilligung; KI-Bilder von „Mitarbeitenden“ gar nicht" ], "regeln": [ "Erster Bildschirm: Collage aus echten Fotos, H1 mit dem konkreten Angebot (Beruf, Ort, Gehaltsspanne oder Tarif, Stunden), „Offene Stellen“ und „In zwei Minuten bewerben“, Ansprechperson mit Telefon und WhatsApp. Die untere Mobilleiste (mobile-bottom-navigation, Variante fab) zeigt Bewerben, Anrufen und WhatsApp.", "Gehalt in jeder Stelle: Spanne in Euro brutto mit Bezug (Stunde, Monat, Jahr) oder Tarifvertrag mit Entgeltgruppe, dazu Zuschläge. Grundlage: Art. 5 der Entgelttransparenzrichtlinie (EU) 2023/970 verlangt Information über Einstiegsentgelt oder Spanne vor dem Vorstellungsgespräch und verbietet die Frage nach dem bisherigen Gehalt; die Frist zur Umsetzung lief am 07.06.2026 ab, ein deutsches Gesetz ist Stand 02.11.2026 nicht in Kraft (Bundesregierung, BT-Drs. 21/7026). Die Spanne trotzdem nennen; Umsetzung in Deutschland vom Kunden prüfen lassen.", "AGG: Stellentitel geschlechtsneutral oder mit (m/w/d), Texte ohne Merkmale aus § 1 AGG („junges Team“, „Muttersprache Deutsch“, „bis 35 Jahre“); stattdessen Anforderungen der Aufgabe („Deutsch gut genug für Kundengespräche“). Kein Foto, kein Geburtsdatum, keine Staatsangehörigkeit als Pflichtfeld. Vom Kunden prüfen lassen.", "Kurzbewerbung: höchstens fünf Pflichtangaben, kein Anschreiben, Lebenslauf freiwillig, keine Frage nach dem bisherigen Gehalt und keine Gehaltsvorstellung als Pflichtfeld (MFM fragt sie ab). Was im Intro versprochen wird, gilt im Formular (Siemon verspricht „ohne Lebenslauf“ und verlangt ihn dann). Nach dem Absenden: Bestätigung mit Name und Foto der Ansprechperson und der Frist, bis wann sie sich meldet.", "Datenschutz bei Bewerbungen: Hinweis nach Art. 13 DSGVO direkt am Formular, Speicherdauer nach Absage (Frist für AGG-Ansprüche: zwei Monate, § 15 Abs. 4 AGG; übliche Löschfrist etwa sechs Monate) und Talent-Pool nur mit eigener Einwilligung; WhatsApp-Weg mit Hinweis auf die Datenübermittlung. Text vom Kunden; Claude schreibt keine Rechtstexte.", "Echte Einblicke: Fotos, Namen, Stimmen und Videos nur von echten Mitarbeitenden mit schriftlicher, widerrufbarer Einwilligung; wer geht oder widerruft, verschwindet von der Seite. Keine Stockfotos, keine KI-Bilder von Menschen; wo KI-Bilder doch vorkommen, gekennzeichnet (Art. 50 KI-VO). Die Collage (collage-scrapbook) ist statisch, Teile sind nicht ziehbar, der Inhalt steht zusätzlich als Bildbeschreibung im Text.", "Benefits konkret: jede Leistung mit Zahl und Bedingung („30 Tage Urlaub“, „Jobrad, wir zahlen 30 € im Monat dazu“, „1.000 € Weiterbildungsbudget im Jahr“); keine Floskeln wie „Obstkorb“, „flache Hierarchien“, „familiäres Umfeld“ ohne Beleg. Auch sagen, was es nicht gibt (Wochenenddienst, Rufbereitschaft, Schicht).", "Ein Tag als … (horizontal-scroll-section): vier bis acht Stationen mit Uhrzeit und echtem Foto; auf dem Telefon und bei reduzierter Bewegung kein Pin, sondern eine Wischleiste mit Pfeilknöpfen bzw. eine senkrechte Liste. Keine Kerninformation nur in der Zeitleiste (Gehalt, Stunden, Ort stehen in der Stelle).", "Ausbildung: Vergütung je Ausbildungsjahr in Euro, mindestens nach § 17 BBiG bzw. Tarif, Dauer und Zahl der Jahre stimmen überein (Achberg listet vier Jahre bei 3,5 Jahren Dauer), Übernahme nur versprechen, wenn sie gilt. Für Minderjährige eine kurze Info für Eltern.", "Stellenseiten für Google: JobPosting-Daten nur auf der Seite einer einzelnen Stelle, passend zum sichtbaren Text, mit datePosted, Ort und, wo vorhanden, baseSalary und validThrough; abgelaufene Stellen sofort entfernen oder als beendet kennzeichnen (Google erlaubt keine abgelaufenen Stellen). Nicht auf der Übersicht.", "Arbeitgeberbewertungen (kununu, Google): wenn gezeigt, mit Quelle, Schnitt, Anzahl, Stand und dem Hinweis, ob und wie geprüft wird; lieber verlinken als einbetten.", "Bewegung nach token-federnd-verspielt mit UI-Stil token-toggle-asymmetrisch: Fotos und Zettel der Collage landen einmal mit kleinem Überschwinger (500 ms), der Haken nach dem Absenden federt (400 ms); Menü, Akkordeon und Formularschritte öffnen 280 ms und schließen 190 ms ohne Federn. Der Bewerben-Knopf (fuellung-vom-eintrittspunkt) füllt sich vom Eintrittspunkt, auf Touch nur Druck und Farbe; Links zu Stellen als pfeil-icon-button, Variante linie.", "Barrierefreiheit: Bewerbung ohne Upload möglich (Telefon, WhatsApp, Formular), Fehlerliste bei der Kurzbewerbung, 200 % Zoom und Kontrastmodus geprüft. Ein Hinweis, dass Bewerbungen schwerbehinderter Menschen willkommen sind, nur ehrlich und mit Ansprechperson. Pflichtangaben (Impressum, Datenschutz) wie auf jeder Seite; Claude schreibt keine Rechtstexte." ], "varianten": [ { "name": "Ausbildung und Praktikum (Azubi-Microsite)", "hinweis": "Zielgruppe 15 bis 19 Jahre und ihre Eltern. Vergütung je Jahr gleich oben, Praktikum zum Reinschnuppern als eigener kurzer Weg (Wunschwoche, Schule, Telefon der Eltern freiwillig), Schulabschluss nur nennen, wo er wirklich nötig ist. Stimmen von Azubis aus allen Lehrjahren; Fotos von Minderjährigen nur mit Einwilligung der Eltern.", "sektionen": [ "Deine Ausbildung bei uns (Berufe mit Vergütung je Jahr)", "Praktikum buchen (mehrschritt-anfrage, Variante ring)", "Ein Tag als Azubi (horizontal-scroll-section)", "Für Eltern (akkordeon-hoehe-auto, Variante faq)" ], "weglassen": [ "Was du bekommst – auf Ausbildungs-Benefits kürzen" ], "muster_zusatz": [] }, { "name": "Pflege und Gesundheit", "hinweis": "Tarif oder AVR mit Entgeltgruppe und Stufe, Schicht- und Tourenmodell als Tabelle, Dienstwagen, Einspringregel und Frei-Garantie nur, wenn sie gelten; Anerkennung ausländischer Abschlüsse mit Ansprechperson. Ist die Karriereseite Teil eines Pflegedienst-Auftritts, gilt dort pflege-dienst-naehe (zweite Startseite); dieses Rezept nur für eine eigene Recruiting-Microsite, ohne Signatur von pflege. Federn hier gedämpft (wann_nicht von token-federnd-verspielt: Gesundheit): Collage-Teile ohne Überschwinger, nur der Haken nach dem Absenden federt.", "sektionen": [ "Dienste und Touren (Tabelle: Früh, Spät, Wochenende, Touren pro Tag)", "Anerkennung und Einstieg für internationale Fachkräfte" ], "weglassen": [], "muster_zusatz": [] }, { "name": "Gastronomie und Hotel", "hinweis": "Stundenlohn und Monatsgehalt nebeneinander, Trinkgeld-Regel (wie verteilt wird), Vorlauf des Dienstplans, Personalessen, Unterkunft für Saisonkräfte mit Preis, Minijob und Aushilfe mit Stundenlohn. Ein Tag als … mit echten Zeiten auch für Spätdienst.", "sektionen": [ "Schichten und Dienstplan (wann er steht, wie getauscht wird)", "Saison und Unterkunft" ], "weglassen": [ "Ausbildung, wenn nicht ausgebildet wird" ], "muster_zusatz": [] }, { "name": "Industrie mit Schichtbetrieb", "hinweis": "Schichtmodell als Tabelle mit Zuschlägen in Prozent, Tarif mit Entgeltgruppe (z. B. Metall und Elektro), Werksverkehr und Parken, Probearbeit in der Linie. Passt als Microsite zu industrie-b2b-mittelstand; Schrift, Farbe und Signatur bleiben die dieses Rezepts.", "sektionen": [ "Schichtmodell und Zuschläge", "Anfahrt zum Werk (Werksbus, Rad, Parken)" ], "weglassen": [], "muster_zusatz": [] } ], "template_tauglich": true, "aufwand": "mittel", "leistung": "Die Collage ist der größte Posten: fünf bis sieben Fotos als AVIF mit festen Seitenverhältnissen, das erste mit fetchpriority=high, die übrigen nach dem LCP; mobil nur drei bis vier. Keine Ziehen-Bibliothek nötig (Collage statisch), die Ankunft per CSS. Die Zeitleiste als CSS-Variante (view-timeline, sticky) mit Rückfall auf eine Wischleiste; GSAP und ScrollTrigger nur, wenn die CSS-Fassung nicht reicht. Videos nur nach Klick, mit Untertiteln, Vorschaubild statt Autoplay. Funnel Display und Funnel Sans als Variable-WOFF2, nur Latin, nur wght. Die Seite muss auf einem alten Handy im Mobilfunk schnell sein: Stellen und Kurzbewerbung ohne Bibliothek.", "offen": [ "Fehlender Baustein (siehe arbeitgeber-karriere-fehlend.md): stellenseite-mit-jobposting. Die id steht schon in der Sektion Offene Stellen und wird von der Prüfung als unbekannt gemeldet.", "Referenzen nur inhaltlich per WebFetch geprüft; Schriften, Farben und Kurven nicht gemessen. Ein Vorbild aus Gastronomie oder Pflege mit Gehaltsangabe auf der eigenen Seite fehlt noch; die Suche lieferte fast nur Jobbörsen.", "Signatur collage-scrapbook: wann_nicht nennt „seriöse B2B-Kontexte“. Die Karriereseite eines Industrie-Arbeitgebers richtet sich an Bewerbende, nicht an Einkäufer; AD prüfen, ob die Collage für Industrie-Arbeitgeber ruhig genug ist (sonst weniger Drehung, ±2°).", "Die Demo von collage-scrapbook lebt in der Welt von verein (Big Shoulders, Caveat, Riso-SVGs) und nutzt Draggable; beim Nachbau nur Aufbau und Raster übernehmen, Ziehen weglassen.", "Deutsche Umsetzung der Entgelttransparenzrichtlinie bei jedem Bau neu prüfen (Stand 02.11.2026: kein Gesetz in Kraft).", "Schriftdatei funnel-display liegt noch nicht unter assets/fonts (funnel-sans liegt dort als WOFF).", "Eintrag in werkzeug/fundus/rezept-finder.json fehlt (Vorschlag: ziele bewerbung; begriffe Karriereseite, Karriere, Recruiting, Stellenangebote, Jobs, Ausbildung, Azubi, Personalgewinnung, Fachkräfte, Arbeitgebermarke, Employer Branding, Bewerbung)." ], "animationsstil_ui": "token-toggle-asymmetrisch", "stimmung_tags": [ "warm", "verspielt" ], "raum": { "basis_px": 8, "skala_px": [ 4, 8, 12, 16, 24, 32, 48, 64, 88, 128 ], "sektion": "clamp(64px, 8vw, 120px)", "dichte": "mittel", "hinweis": "Mobil zuerst: Stellenkarten mit 16 px Innenabstand und Gehalt oben, Kurzbewerbung mit 20 px zwischen Feldern. Die Collage darf eng überlappen." }, "raster": { "spalten": 12, "rand": "clamp(16px, 4vw, 48px)", "spalt": "clamp(12px, 2vw, 24px)", "max_breite": "1360px", "hinweis": "Hero 6/6 (H1 links, Collage rechts auf verdecktem 12er-Raster). Stellen als Liste, Tageszeitleiste waagerecht (horizontal-scroll-section), mobil Wischleiste." }, "form": { "radius_klein": "6px", "radius_gross": "2px", "pille": false, "linie": "1px #5A5650 mit 20 % Deckkraft", "schatten": "nur Fotos und Zettel der Collage liegen mit kurzem, weichem Schatten wie Papier auf dem Tisch", "hinweis": "Fotos fast eckig wie Abzüge, leicht gedreht (Demo collage-scrapbook: 1,5 bis 4°); Knöpfe 6 px. Links zu Stellen als Textlink mit Pfeil (pfeil-icon-button, Variante linie)." }, "bildsprache": { "licht": "Echtes Licht im Betrieb, Handyfotos reichen, ungefiltert.", "ausschnitt": "Werkbank, Tourauto, Küche, Pausenraum, Menschen bei der Arbeit.", "personen": "Ja: nur echte Mitarbeitende mit schriftlicher, widerrufbarer Einwilligung.", "formate": [ "3:4", "4:5", "1:1" ], "nicht": "Keine Stockfotos, keine KI-Bilder von Menschen, kein Imagefilm im Hero, keine Daumen-hoch-Teamfotos." }, "ton": { "anrede": "du", "saetze": "Kurz und konkret: Beruf, Ort, Gehalt, Stunden. Benefits mit Zahl und Bedingung.", "haltung": "Ehrlich und nahbar; sagt auch, was es nicht gibt. Bei Stellen für Führungskräfte oder in sehr förmlichen Betrieben Sie, dann durchgehend.", "beispiele": [ "Elektroniker:in gesucht. 38 Stunden, freitags um 13 Uhr Schluss.", "Bewirb dich in zwei Minuten, ohne Anschreiben." ], "nicht": "„junges, dynamisches Team“, „flache Hierarchien“, „familiäres Umfeld“, „Obstkorb“, Merkmale aus § 1 AGG." }, "hero_aufbau": { "raster": "12 Spalten: H1 über Spalte 1 bis 6, Collage über 6 bis 12 auf verdecktem Raster (collage-scrapbook); mobil drei bis vier Fotos im Hochformat unter der H1.", "bild": "Fünf bis sieben echte Fotos, 3:4 und 4:5, leicht gedreht, dazu ein Zettel mit einem echten Satz aus dem Team.", "h1": "clamp(2.5rem, 1.6rem + 3.8vw, 4.75rem), Funnel Display 700, links.", "handlung": "„In zwei Minuten bewerben“ (Klatschmohn gefüllt) und „Offene Stellen“ (Textlink mit Pfeil).", "zusatz": "Ansprechperson mit Foto, Telefon und WhatsApp unter den Knöpfen; mobil untere Leiste Bewerben / Anrufen / WhatsApp." }, "url": "https://cecodesign.de/lab/fundus/rezepte/arbeitgeber-karriere/", "tokens_css": "https://cecodesign.de/lab/fundus/rezepte/arbeitgeber-karriere/tokens.css", "bauplan": "https://cecodesign.de/lab/fundus/rezepte/arbeitgeber-karriere/bauplan.txt", "rezept_json": "https://cecodesign.de/lab/fundus/rezepte/arbeitgeber-karriere/rezept.json", "nicht_verwenden_ids": [ { "ids": [ "cinematic-video-hero" ], "grund": "ein Imagefilm im Hero verdrängt Stellen und Gehalt und lädt lange; Videos gehören zu den Stimmen, mit Untertiteln" }, { "ids": [ "zahlen-odometer" ], "grund": "„98 % zufriedene Mitarbeitende“ hochgezählt ist die Floskel in Zahlen" }, { "ids": [ "rotating-words", "typewriter-natural" ], "grund": "„Wir suchen dich als … Held:in“ versteckt, welche Stelle es wirklich gibt" }, { "ids": [ "bento-grid-interaktiv", "stapelkarten" ], "grund": "Benefits als Icon-Kacheln sind genau die Floskel, die das Rezept vermeiden will; Benefits als Tabelle mit Zahlen" }, { "ids": [ "logo-wand-social-proof" ], "grund": "gekaufte Arbeitgebersiegel und Awards ohne Jahr und Quelle; echte Auszeichnungen als Textzeile mit Jahr" }, { "ids": [ "graustufen-zu-farbe" ], "grund": "die meisten Bewerbenden kommen per Handy und sähen die Farbe nie (wann_nicht)" }, { "ids": [ "flick-karten-stapel" ], "grund": "Signatur von friseur; außerdem Wischgeste statt lesbarer Liste" }, { "ids": [ "corner-shape-eckenformen" ], "grund": "Signatur von pflege" }, { "ids": [ "konfetti-erfolg" ], "grund": "nach der Bewerbung eine ruhige Bestätigung mit Name, Foto und Rückrufzeit der Ansprechperson" }, { "ids": [ "prompt-hero-eingabefeld", "ki-streaming-text-denkindikator" ], "grund": "kein Chatbot statt Ansprechperson; wenn doch, beim Start gekennzeichnet (Art. 50 KI-VO)" }, { "ids": [ "smooth-scroll-lenis", "cursor-follower-lerp", "magnetische-elemente" ], "grund": "bremsen auf dem Handy und gehören zu Agenturseiten" }, { "ids": [ "hide-on-scroll-header" ], "grund": "„Bewerben“ und Telefon müssen immer erreichbar sein" }, { "ids": [], "grund": "Stockfotos von lachenden Teams am Laptop, Daumen hoch und Puzzleteile – nur echte Menschen aus dem Betrieb, mit Einwilligung; KI-Bilder von „Mitarbeitenden“ gar nicht" } ], "alle_muster": [ { "id": "collage-scrapbook", "rolle": "Signatur", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/collage-scrapbook/meta.json" }, { "id": "horizontal-scroll-section", "rolle": "Signatur", "demo": true, "meta": "https://cecodesign.de/lab/fundus/scroll/horizontal-scroll-section/meta.json" }, { "id": "stellen-karriere", "rolle": "Sektion: Offene Stellen (Titel geschlechtsneutral oder mit (m/w/d), Ort, Stunden, Gehaltsspanne oder Tarifgruppe, Start, Schicht oder Tour; ab vier Stellen Filter nach Bereich, Ort, Teilzeit; jede Stelle mit eigener Seite und JobPosting-Daten; Initiativbewerbung darunter)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/stellen-karriere/meta.json", "variante": "liste", "demo_url": "https://cecodesign.de/lab/fundus/sektionen/stellen-karriere/demo?v=liste" }, { "id": "stellenseite-mit-jobposting", "rolle": "Sektion: Offene Stellen (Titel geschlechtsneutral oder mit (m/w/d), Ort, Stunden, Gehaltsspanne oder Tarifgruppe, Start, Schicht oder Tour; ab vier Stellen Filter nach Bereich, Ort, Teilzeit; jede Stelle mit eigener Seite und JobPosting-Daten; Initiativbewerbung darunter)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/stellenseite-mit-jobposting/meta.json" }, { "id": "mehrschritt-anfrage", "rolle": "Sektion: Kurzbewerbung in zwei Minuten (Stelle, Name, Telefon oder E-Mail, Erfahrung als Auswahl, frühester Start; Lebenslauf freiwillig, kein Anschreiben, keine Frage nach dem bisherigen Gehalt; WhatsApp und Anruf als zweiter Weg; Bestätigung mit Name der Ansprechperson und Antwortfrist)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/mehrschritt-anfrage/meta.json", "variante": "ring", "demo_url": "https://cecodesign.de/lab/fundus/sektionen/mehrschritt-anfrage/demo?v=ring" }, { "id": "formular-fehlerzusammenfassung", "rolle": "Sektion: Kurzbewerbung in zwei Minuten (Stelle, Name, Telefon oder E-Mail, Erfahrung als Auswahl, frühester Start; Lebenslauf freiwillig, kein Anschreiben, keine Frage nach dem bisherigen Gehalt; WhatsApp und Anruf als zweiter Weg; Bestätigung mit Name der Ansprechperson und Antwortfrist)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/zugang/formular-fehlerzusammenfassung/meta.json", "variante": "kompakt", "demo_url": "https://cecodesign.de/lab/fundus/zugang/formular-fehlerzusammenfassung/demo?v=kompakt" }, { "id": "validierung-nach-interaktion", "rolle": "Sektion: Kurzbewerbung in zwei Minuten (Stelle, Name, Telefon oder E-Mail, Erfahrung als Auswahl, frühester Start; Lebenslauf freiwillig, kein Anschreiben, keine Frage nach dem bisherigen Gehalt; WhatsApp und Anruf als zweiter Weg; Bestätigung mit Name der Ansprechperson und Antwortfrist)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/validierung-nach-interaktion/meta.json" }, { "id": "datei-upload-ablage", "rolle": "Sektion: Kurzbewerbung in zwei Minuten (Stelle, Name, Telefon oder E-Mail, Erfahrung als Auswahl, frühester Start; Lebenslauf freiwillig, kein Anschreiben, keine Frage nach dem bisherigen Gehalt; WhatsApp und Anruf als zweiter Weg; Bestätigung mit Name der Ansprechperson und Antwortfrist)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/datei-upload-ablage/meta.json", "variante": "dokument", "demo_url": "https://cecodesign.de/lab/fundus/sektionen/datei-upload-ablage/demo?v=dokument" }, { "id": "prozess-timeline-wachsende-linie", "rolle": "Sektion: So läuft deine Bewerbung (Eingang sofort bestätigt → Anruf innerhalb von x Werktagen → Kennenlernen vor Ort oder per Video → Probetag, bezahlt oder nicht, klar gesagt → Zusage und erster Tag; Dauer je Schritt nur, wenn sie gehalten wird)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/prozess-timeline-wachsende-linie/meta.json" }, { "id": "testimonials-neu-gedacht", "rolle": "Sektion: Team-Stimmen (Vorname oder Name, Aufgabe, seit wann dabei, ein konkreter Satz statt Lob; kurze Videos nur mit Untertiteln und schriftlicher Einwilligung)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/testimonials-neu-gedacht/meta.json", "variante": "zitat", "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/testimonials-neu-gedacht/demo?v=zitat" }, { "id": "eigener-videoplayer", "rolle": "Sektion: Team-Stimmen (Vorname oder Name, Aufgabe, seit wann dabei, ein konkreter Satz statt Lob; kurze Videos nur mit Untertiteln und schriftlicher Einwilligung)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/eigener-videoplayer/meta.json", "variante": "kapitel", "demo_url": "https://cecodesign.de/lab/fundus/sektionen/eigener-videoplayer/demo?v=kapitel" }, { "id": "zahlen-fakten-section", "rolle": "Sektion: Was du bekommst, konkret (Gehalt oder Tarif, Zuschläge in Prozent, Urlaubstage, Arbeitszeitmodell, Dienstwagen oder Jobrad mit Betrag, Weiterbildung mit Budget, Altersvorsorge mit Arbeitgeberanteil; und was es nicht gibt: Schicht, Wochenende, Bereitschaft)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/zahlen-fakten-section/meta.json", "variante": "tabelle", "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/zahlen-fakten-section/demo?v=tabelle" }, { "id": "akkordeon-hoehe-auto", "rolle": "Sektion: Ausbildung und Einstieg (Berufe mit Dauer, Vergütung je Ausbildungsjahr, Berufsschule, Übernahme, Praktikum zum Reinschnuppern; Quereinstieg und Teilzeit-Ausbildung; Infos für Eltern)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/akkordeon-hoehe-auto/meta.json", "varianten_je_rolle": [ { "rolle": "Sektion: Ausbildung und Einstieg (Berufe mit Dauer, Vergütung je Ausbildungsjahr, Berufsschule, Übernahme, Praktikum zum Reinschnuppern; Quereinstieg und Teilzeit-Ausbildung; Infos für Eltern)", "variante": "leistungen", "demo_url": "https://cecodesign.de/lab/fundus/mikroanimationen/akkordeon-hoehe-auto/demo?v=leistungen" }, { "rolle": "Sektion: Fragen vor der Bewerbung (Quereinstieg, Teilzeit, Führerschein, Deutschkenntnisse, Anerkennung ausländischer Abschlüsse, Barrierefreiheit des Arbeitsplatzes, Kinderbetreuung)", "variante": "faq", "demo_url": "https://cecodesign.de/lab/fundus/mikroanimationen/akkordeon-hoehe-auto/demo?v=faq" } ] }, { "id": "team-ueber-mich-layout", "rolle": "Sektion: Deine Ansprechperson und der Weg zu uns (Foto, Name, Aufgabe, Telefon und WhatsApp mit Erreichbarkeit; Adresse als Text, Anfahrt mit Bus und Rad, Parken; Karte per 2-Klick)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/team-ueber-mich-layout/meta.json", "variante": "statement", "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/team-ueber-mich-layout/demo?v=statement" }, { "id": "oeffnungszeiten-status", "rolle": "Sektion: Deine Ansprechperson und der Weg zu uns (Foto, Name, Aufgabe, Telefon und WhatsApp mit Erreichbarkeit; Adresse als Text, Anfahrt mit Bus und Rad, Parken; Karte per 2-Klick)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/sektionen/oeffnungszeiten-status/meta.json", "variante": "termin", "demo_url": "https://cecodesign.de/lab/fundus/sektionen/oeffnungszeiten-status/demo?v=termin" }, { "id": "karte-zwei-klick", "rolle": "Sektion: Deine Ansprechperson und der Weg zu uns (Foto, Name, Aufgabe, Telefon und WhatsApp mit Erreichbarkeit; Adresse als Text, Anfahrt mit Bus und Rad, Parken; Karte per 2-Klick)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hero-layouts/karte-zwei-klick/meta.json", "variante": "bild", "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/karte-zwei-klick/demo?v=bild" }, { "id": "footer-newsletter-mit-persoenlichkeit", "rolle": "Sektion: Job-Alert (neue Stellen per E-Mail mit Double-Opt-in, Bereich wählbar; nur wenn wirklich verschickt wird) und Barrierefreiheit (eigene Seite als freiwilliger Aufbau)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/footer/footer-newsletter-mit-persoenlichkeit/meta.json", "variante": "basis", "demo_url": "https://cecodesign.de/lab/fundus/footer/footer-newsletter-mit-persoenlichkeit/demo?v=basis" }, { "id": "barrierefreiheit-seite", "rolle": "Sektion: Job-Alert (neue Stellen per E-Mail mit Double-Opt-in, Bereich wählbar; nur wenn wirklich verschickt wird) und Barrierefreiheit (eigene Seite als freiwilliger Aufbau)", "demo": true, "meta": "https://cecodesign.de/lab/fundus/zugang/barrierefreiheit-seite/meta.json", "variante": "erklaerung", "demo_url": "https://cecodesign.de/lab/fundus/zugang/barrierefreiheit-seite/demo?v=erklaerung" }, { "id": "mobile-bottom-navigation", "rolle": "Navigation", "demo": true, "meta": "https://cecodesign.de/lab/fundus/navigation/mobile-bottom-navigation/meta.json", "variante": "fab", "demo_url": "https://cecodesign.de/lab/fundus/navigation/mobile-bottom-navigation/demo?v=fab" }, { "id": "checkbox-radio-animiert", "rolle": "Mikroanimation", "demo": true, "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/checkbox-radio-animiert/meta.json" }, { "id": "einblenden-starting-style", "rolle": "Mikroanimation", "demo": true, "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/einblenden-starting-style/meta.json" }, { "id": "studio-visitenkarte-footer", "rolle": "Footer", "demo": true, "meta": "https://cecodesign.de/lab/fundus/footer/studio-visitenkarte-footer/meta.json", "variante": "basis", "demo_url": "https://cecodesign.de/lab/fundus/footer/studio-visitenkarte-footer/demo?v=basis" }, { "id": "fuellung-vom-eintrittspunkt", "rolle": "Buttons", "demo": true, "meta": "https://cecodesign.de/lab/fundus/hover/fuellung-vom-eintrittspunkt/meta.json", "variante": "basis", "demo_url": "https://cecodesign.de/lab/fundus/hover/fuellung-vom-eintrittspunkt/demo?v=basis" }, { "id": "pfeil-icon-button", "rolle": "Buttons", "demo": true, "meta": "https://cecodesign.de/lab/fundus/buttons/pfeil-icon-button/meta.json", "variante": "linie", "demo_url": "https://cecodesign.de/lab/fundus/buttons/pfeil-icon-button/demo?v=linie" }, { "id": "token-federnd-verspielt", "rolle": "Animationsstil", "demo": true, "meta": "https://cecodesign.de/lab/fundus/animationsstile/token-federnd-verspielt/meta.json" }, { "id": "token-toggle-asymmetrisch", "rolle": "Animationsstil für UI", "demo": true, "meta": "https://cecodesign.de/lab/fundus/animationsstile/token-toggle-asymmetrisch/meta.json" }, { "id": "fluide-typo-clamp-cqi", "rolle": "Schrift-Technik", "demo": true, "meta": "https://cecodesign.de/lab/fundus/typo-techniken/fluide-typo-clamp-cqi/meta.json" }, { "id": "headline-laufweite-zeilenabstand", "rolle": "Schrift-Technik", "demo": true, "meta": "https://cecodesign.de/lab/fundus/typo-techniken/headline-laufweite-zeilenabstand/meta.json" }, { "id": "tabellenziffern", "rolle": "Schrift-Technik", "demo": true, "meta": "https://cecodesign.de/lab/fundus/typo-techniken/tabellenziffern/meta.json" }, { "id": "lesesatz-text-wrap", "rolle": "Schrift-Technik", "demo": true, "meta": "https://cecodesign.de/lab/fundus/typo-techniken/lesesatz-text-wrap/meta.json" }, { "id": "text-box-trim", "rolle": "Schrift-Technik", "demo": true, "meta": "https://cecodesign.de/lab/fundus/typo-techniken/text-box-trim/meta.json" } ] }