1. Projektablauf & Inhaltsstruktur

Dieses Kapitel beschreibt den gesamten Projektfluss – von der Planung bis zur Umsetzung – und legt die Grundlage für konsistente Arbeitsabläufe im Team.

A. Ziel & Nutzen dieses Guides

Der Guide stellt sicher, dass alle Elementor-Projekte konsistent, wartbar und performant umgesetzt werden. Fokus: globale Einstellungen statt Einzellösungen, em/%/vh statt px, minimale DOM-Tiefe, lokale Assets.

Tipp

Baue Seiten mit globalen Styles und nutze nur Margin-Bottom für vertikale Abstände. So bleiben Debugging und Wartung simpel.

B. Projekt-Workflow (Design → Build → QA → Live)

Designphase: Moodboard, CI, Figma-Layout, Typo-Basis (1 Primärschrift + Varianten), Komponenten.
Build: WordPress-Basis, Hello Biz Child, assets/, lokale Fonts, globale Elementor-Settings, Seitenstruktur.
QA: Responsives Verhalten, Abstände, Bildergrößen, Lighthouse/Core Web Vitals.
Live & Nachpflege: Indexing aktivieren, Caching finalisieren, Changelog pflegen.

✅ Richtig

Globale Fonts/Colors/Typo zuerst setzen
Container flach halten (wenig Nesting)
Abstände in em/%/vh

❌ Falsch

Inline-CSS pro Widget
px-Festwerte statt relativ
Unnötig viele Wrapper/Spalten

C. Detailkapitel (Quicklinks)

D. Projekt-Checkliste (Build-Start)

WordPress-Basis: Plugins, Permalinks, Favicon, Indexing (DEV gesperrt)
Hello Biz Child + /assets/ Struktur + lokale Fonts
Elementor: Globale Farben & Typo gesetzt
Seitenstruktur & Menü „Guide – Kapitel“ angelegt
Bilderrichtlinien bekannt (JPG, Größen, Benennung)