Design · Bausteine-Dossier

Bereich

Webdesign — ganze Seiten bauen

Die komplette Website Block für Block: die Sektionen in der Reihenfolge, in der man eine Seite von oben nach unten zusammensetzt — je in mehreren Stil-Varianten (Pol 2 Klarheit / Pol 1 Craft). Darunter fertige Nebenseiten-Layouts zum direkten Einsetzen.

Seiten-Sektionen — von oben nach unten 17 Kategorien

Header

Milchglas beim Scrollen, Logo-Lockup, Brand-Mark-Auto-Switch.

9 Bausteine →

Navigation

Rail-Nav, Mega-Dropdown, Mobile-Drawer, Dock, Unterstrich, Zoom-Fokus.

13 Bausteine →

Hero

Foto-Leseschleier, Letter-Burst, Muster-Maske, Trust-Reihe, Stat-Leiste.

13 Bausteine →

Über uns

Zweispaltig-klar mit Kennzahlen · Craft mit Glow & Glas-Karte.

4 Varianten →

Leistungen

Klares 3er-Raster · Bento-Layout mit hervorgehobener Kernleistung.

4 Varianten →

Ablauf / So arbeiten wir

Nummerierte Schritt-Reihe · vertikale Craft-Timeline mit Glow.

4 Varianten →

Zahlen / Erfolge

Ruhiges Kennzahlen-Raster · Glas-Karten mit Count-Up beim Scrollen.

4 Varianten →

Team

Klares Raster · Craft-Reveal · Laufband · Gründer-Zitat · Flip-Karten · Flip mit Unterschrift.

6 Bausteine →

Bewertung / Kundenstimmen

Testimonial-Karten mit Sternen · großes Zitat mit Avatar · Bewertungs-Badges (Google/Trustpilot).

5 Bausteine →

Referenzen / Galerie

Portfolio-Grid mit Overlay · Mosaik-Showcase mit Zoom & Glas-Label.

4 Varianten →

Preise / Pakete

Klare Tarif-Karten · Craft mit Glow & Monatlich/Jährlich-Umschalter.

4 Varianten →

Partner / Logos

Ruhiges Logo-Raster mit Hover-Aufhellung · Logo-Laufband mit Rand-Fades.

4 Varianten →

FAQ-Sektion

Zweispaltig mit nativem Akkordeon · gerahmt mit Plus→X-Morph & CTA-Kachel.

4 Varianten →

Kontakt-Sektion

Kontaktdaten + Formular · Glas-Panel mit CSS-Karte (DSGVO-clean).

4 Varianten →

Schluss-CTA / Newsletter

Ruhiges CTA-Band · Newsletter-Band mit Aura & E-Mail-Feld.

4 Varianten →

Inhalts-Bänder

CTA-Band, Count-Up, Stepper, Quote, Sektions-Übergänge — Bänder zwischen den Sektionen.

13 Bausteine →

Footer

Multi-Spalten, schlank, Personal-Brand mit Kontakt-Spalte, Lokal mit Einsatzgebiet.

6 Bausteine →

Nebenseiten-Layouts — fertige Unterseiten 5 Layouts

Ganze Unterseiten zum direkten Belegen: Hero-Sektion + Hintergrund + Dienstleistungs-Karten im Stil bewährter Kundenseiten. Fünf verschiedene Bild-/Text-Anordnungen, copy-paste-fähig.

Leistungs-Unterseite

Hero mit Akzent-Glow + zwei Buttons + 3er-Raster mit Dienstleistungs-Karten.

Layout ansehen →

Detail-/Angebotsseite

Kompakter Hero + alternierende Bild/Text-Zeilen mit Merkmal-Liste + CTA-Band.

Layout ansehen →

Über-uns-Unterseite

Hero + zweispaltig Text/Werte-Liste + Kennzahlen-Leiste.

Layout ansehen →

Kontakt-Unterseite

Hero + Formular (DSGVO-clean) + Kontaktdaten + CSS-Karten-Andeutung.

Layout ansehen →

Referenz-/Projektseite

Hero + Galerie-Raster mit Hover-Overlay + Ergebnis-Zahlen.

Layout ansehen →

Impressum & Datenschutz — Rechtsseiten zum Schluss

Die rechtlich nötigen Unterseiten jeder Website. Struktur-Vorlagen mit markierten Platzhaltern (⚠) — vor dem Live-Gang juristisch prüfen lassen.

Impressum

Struktur-Vorlage nach § 5 DDG, mit markierten Platzhaltern.

Vorlage ansehen →

Datenschutzerklärung

Struktur-Vorlage (DSGVO / § 25 TDDDG), mit markierten Platzhaltern.

Vorlage ansehen →