Frontend-Guide · Figma · Fluid · Sitepackage · Content-Elemente
Figma in TYPO3 umsetzen: vom Design zur redaktionsfähigen Website
Figma-Dateien sind noch keine TYPO3-Architektur. Damit ein Design im Alltag funktioniert, müssen Komponenten, Content-Elemente, Fluid-Templates, Breakpoints, A11y, Performance und Backend-Pflege gemeinsam geplant werden.
Designsystem in Content-Modelle übersetzen
Nicht jede Figma-Komponente ist ein eigenes TYPO3-Element. Entscheidend ist, welche Varianten Redaktionen wirklich brauchen.
Fluid und Sitepackage strukturieren
Layouts, Partials, TypoScript, PageTS und Assets sollten so aufgebaut sein, dass spätere Änderungen nicht zur Suchaktion werden.
Qualität vor Go-Live prüfen
Responsiveness, Fokusführung, Performance, Bildgrößen, Semantik und Redaktionsabnahme gehören zur Umsetzung dazu.
Checkliste
Was vor der Entscheidung geklärt sein sollte
- • Komponenten und Varianten priorisieren
- • Content-Elemente und Felder definieren
- • Fluid-Struktur planen
- • Asset-Build festlegen
- • A11y und Performance prüfen
Häufige Fragen
Kann man Figma direkt in TYPO3 importieren? ›
Nein, sinnvoll ist eine technische Übersetzung in Templates, Content-Elemente, Assets und Redaktionslogik.
Wer entscheidet über Content-Elemente? ›
Idealerweise Design, Redaktion und Entwicklung gemeinsam. So entstehen Elemente, die schön aussehen und pflegbar bleiben.
Kann Tailwind genutzt werden? ›
Ja. Tailwind kann gut passen, wenn Klassenstruktur, Build-Prozess und Designsystem sauber im Sitepackage organisiert werden.