Die Website läuft auf Webflow. Anfangs hat das gut funktioniert. Inzwischen stoßen Sie an Grenzen: CMS-Beschränkungen, Performance-Probleme, fehlende Funktionen, die sich nur mit Umwegen realisieren lassen. Next.js steht zur Diskussion.
Der Wechsel von Webflow zu Next.js ist bei klarem Scope kein Neuland. Die Komplexität liegt im Detail: Ein einfacher Export reicht nicht. So sieht der Prozess in der Praxis aus.
Wann eine Migration sinnvoll ist
Nicht jede Webflow-Site braucht eine Migration. Eine schlichte Marketing-Seite, die ein Designer einmal im Monat aktualisiert, ist auf Webflow gut aufgehoben. Eine Migration lohnt sich, wenn:
- Ihr CMS-Bedarf das 10.000-Einträge-Limit oder das starre Datenmodell von Webflow übersteigt
- Echtes i18n gefragt ist, nicht Webflows eingeschränkte Lokalisierung
- Eigene Funktionen (Auth, Dashboards, APIs) mehr als Embed-Blöcke erfordern
- Mobile PageSpeed-Werte für SEO entscheidend sind und sich der Wert nicht über 70 heben lässt
- Die monatlichen Kosten für Webflow und Drittanbieter-Tools die Investition in die Migration übersteigen
Von Webflow zu Next.js: der Vergleich
| Bereich | Webflow | Next.js |
|---|---|---|
| Hosting | Webflow-Server | Vercel / AWS / beliebiges CDN |
| CMS | Integriert (eingeschränkt) | Headless CMS, MDX oder dateibasiert |
| Styling | Visueller Builder | Tailwind, CSS Modules oder beliebiger CSS-Ansatz |
| Formulare | Webflow Forms (eingeschränkt) | Eigene Formulare mit beliebigem Backend |
| Animationen | Webflow Interactions | Framer Motion, GSAP, CSS-Animationen |
| Eigene Logik | Embed-Blöcke und Drittanbieter-Tools | Nativer Code, keine Grenzen |
Der Migrationsprozess
Schritt 1: Content-Audit (1-2 Tage)
Zuerst wird das Webflow-CMS als CSV exportiert. Jede Seite, jede Collection und jedes Asset wird erfasst. Dann entscheidet sich, welche Inhalte übernommen, umstrukturiert oder gestrichen werden. Gleichzeitig bietet sich die Gelegenheit aufzuräumen: Die meisten Sites enthalten Seiten, die längst keinen Zweck mehr erfüllen.
Schritt 2: Design-Übertragung (2-5 Tage)
Das bestehende Design bleibt erhalten. Die visuelle Ausgabe ändert sich nicht. Was sich ändert, ist die Technik darunter: Webflow-Komponenten werden in React-Komponenten übersetzt, Animationen mit Framer Motion oder CSS neu aufgebaut.
Dabei lassen sich auch Designprobleme beheben, mit denen man bisher gelebt hat. Responsive-Breakpoints, die nicht ganz stimmen, Layout Shifts auf Mobilgeräten, inkonsistente Abstände: All das wird im Zuge der Übertragung korrigiert.
Schritt 3: CMS-Einrichtung (1-3 Tage)
Die Inhalte brauchen eine neue Heimat. Zur Wahl stehen ein Headless CMS wie Sanity oder Contentful, Markdown- bzw. MDX-Dateien im Repository oder eine eigene Content-Struktur. Die Entscheidung hängt davon ab, wer Inhalte bearbeitet und wie häufig.
Für die meisten Business-Sites ist dateibasierter Content mit einem verwalteten Bearbeitungsservice der einfachste und wirtschaftlichste Ansatz.
Schritt 4: Aufbau und Test (3-7 Tage)
Die Next.js-Site wird gebaut, auf verschiedenen Geräten getestet und für Performance optimiert. Jede Seite wird mit der Webflow-Version abgeglichen, damit nichts fehlt. Formulare, Integrationen und Tracking-Skripte werden neu verbunden.
Schritt 5: SEO-Migration (1 Tag)
Dieser Schritt bereitet die meisten Sorgen. Entscheidend ist URL-Parität: Jede bestehende URL bleibt entweder identisch oder erhält eine saubere 301-Weiterleitung. Metadaten, Open-Graph-Tags und strukturierte Daten werden vollständig übertragen. Bei sauberem Redirect-Mapping und erhaltenen hreflang-Attributen ist der Ranking-Verlust in der Regel minimal und kurzfristig; manche Sites verzeichnen bereits nach wenigen Wochen bessere Rankings durch die Leistungsgewinne.
Schritt 6: Launch und Monitoring (1 Tag)
DNS-Umschaltung, SSL-Prüfung, finaler Test und Monitoring. Der Cutover dauert bei content-getriebenen Sites ohne komplexe Integrationen typischerweise unter einer Stunde. Search Console und Analytics werden in den ersten zwei Wochen engmaschig beobachtet, um Probleme frühzeitig zu erkennen.
Zeitplan und Kosten
Eine typische Webflow-zu-Next.js-Migration dauert vom Start bis zum Launch 2-4 Wochen. Einfache Sites (unter 20 Seiten, kaum CMS) können schneller fertig sein. Sites mit umfangreichem CMS-Einsatz, mehreren Integrationen oder individueller Funktionalität brauchen länger.
| Komplexität | Timeline | Typische Investition |
|---|---|---|
| Einfach (5-15 Seiten, kein CMS) | 1-2 Wochen | 2.000-4.000 $ |
| Mittel (15-50 Seiten, CMS-Collections) | 2-3 Wochen | 4.000-8.000 $ |
| Komplex (50+ Seiten, Integrationen, i18n) | 3-5 Wochen | 8.000-15.000 $ |
Was sich für Ihr Team ändert
Die größte Umstellung betrifft die Content-Pflege. Der visuelle Editor von Webflow entfällt. Je nach Setup laufen Inhaltsänderungen über ein Headless-CMS-Dashboard oder über einen verwalteten Bearbeitungsservice, bei dem Änderungen per E-Mail eingereicht werden und innerhalb von 24-48 Stunden live gehen.
Alles andere verbessert sich. Die Site ist schneller, sicherer und günstiger zu betreiben. Neue Funktionen entstehen als sauberer Code, nicht als Zusammenstücklung aus Embed-Blöcken und Drittanbieter-Tools.
Häufige Bedenken
"Verliere ich meine SEO-Rankings?" Nicht, wenn URL-Weiterleitungen und Metadaten korrekt übertragen werden. Dazu gibt es einen ausführlichen Artikel: Die kurze Antwort lautet, dass sauber durchgeführte Migrationen Rankings erhalten und häufig verbessern.
"Kann ich Inhalte weiterhin selbst bearbeiten?" Ja, über ein Headless CMS oder den verwalteten Bearbeitungsservice. Das visuelle Drag-and-Drop fällt weg, die Möglichkeit, Texte, Bilder und Seiten zu ändern, bleibt bestehen.
"Was passiert mit meinen Webflow-Animationen?" Sie werden neu aufgebaut. Framer Motion und GSAP können alles replizieren, was Webflow Interactions leisten, und noch mehr. Oft performen die Animationen sogar besser, weil sie gezielt für die jeweilige Implementierung optimiert werden.
Entscheidungsrahmen
Rechnen Sie Ihre aktuellen Webflow-Kosten zusammen: Hosting-Plan, Workspace-Zugänge, Überschreitungen bei Formularübermittlungen, Drittanbieter-Tools und Entwicklerzeit für Workarounds. Stellen Sie dem die einmaligen Migrationskosten plus minimale laufende Hosting-Kosten gegenüber.
Viele Unternehmen haben die Migrationskosten durch geringere Plattformgebühren und Conversion-Gewinne innerhalb von 6-12 Monaten wieder eingespielt; die Amortisation hängt vom Traffic-Volumen und den bisherigen Kosten ab. Danach wächst der Spareffekt weiter, während die Möglichkeiten der Site zunehmen.