Framer zu Astro Migration

Von Framer zu Astro, mit Code, der deinem Team gehört

In Framer bestimmt die Plattform, wo deine Seite läuft und was sie lädt. Wir bauen sie in Astro neu, migrieren das CMS nach Sanity und sichern jede URL, die heute rankt.

  • 50+ B2B SaaS Teams vertrauen uns
  • 5,0 von 5 Sternen
  • 5,0 von 5 Sternen
  • 5,0 von 5 Sternen
Dauer
5–8 WochenFür eine typische SaaS-Marketingwebsite.
SEO-Risiko
MittelCollection-Pfade und lokalisierte URLs bauen wir exakt nach.
Inhalte
Werden übernommenCMS-Collections, Seitentexte, Bilder, Metadaten
Design und Funktionen
Werden neu gebautLayouts, Komponenten, Effekte, Formulare
Preis
FestpreisSteht fest, sobald wir alle URLs geprüft haben.

Warum Teams wechseln

Typische Gründe, Framer zu verlassen

01

Seiten laden mehr, als sie brauchen

Ein Builder liefert Skripte für Funktionen mit, die viele Seiten gar nicht nutzen. Astro rendert HTML und lädt JavaScript nur für Komponenten, die es brauchen. Wir messen vorher und nachher mit PageSpeed Insights.

02

Der Code liegt nicht bei dir

Seiten entstehen im Framer-Canvas, eigene Logik läuft als Code Component innerhalb von Framer. Mit Astro liegt die ganze Website in deinem Repository und lässt sich prüfen, versionieren und weitergeben.

03

Beim Hosting gibt es keine Wahl

Framer-Sites laufen auf Framer. Ein Astro-Projekt deployst du auf Vercel, Netlify, Cloudflare oder eigene Server, je nachdem, was deine IT oder dein Datenschutz verlangt.

04

AI-Agenten sollen mitarbeiten

Im Astro-Projekt ist jede Seite Code und jeder Inhalt ein Sanity-Dokument. In diesem Format bereiten Claude oder Codex Änderungen vor und dein Team gibt sie in der Vorschau frei.

Framer und Astro im Vergleich

Was sich für dein Team ändert

KriteriumFramerAstro
CodeSeiten im Canvas, eigene Logik als React Code Components in Framer.Eigenes Repository mit Astro-Komponenten, versioniert in Git.
HostingInklusive, auf der Infrastruktur von Framer.Frei wählbar: Vercel, Netlify, Cloudflare oder eigene Server.
JavaScript im BrowserBestimmt die Plattform.Standardmäßig keins, nur dort, wo eine Komponente es braucht.
BearbeitungVisuell im Canvas, gemacht für Designer.Inhalte in Sanity, größere Änderungen über den AI-Workflow mit Vorschau.
WeiterleitungenIn den Site Settings unter Hosting, mit Platzhaltern.In der Astro-Konfiguration oder beim Hoster, im Code dokumentiert.

Framer

  • Seiten im Canvas, eigene Logik als React Code Components in Framer.
  • Inklusive, auf der Infrastruktur von Framer.
  • Bestimmt die Plattform.
  • Visuell im Canvas, gemacht für Designer.
  • In den Site Settings unter Hosting, mit Platzhaltern.

Astro

  • Eigenes Repository mit Astro-Komponenten, versioniert in Git.
  • Frei wählbar: Vercel, Netlify, Cloudflare oder eigene Server.
  • Standardmäßig keins, nur dort, wo eine Komponente es braucht.
  • Inhalte in Sanity, größere Änderungen über den AI-Workflow mit Vorschau.
  • In der Astro-Konfiguration oder beim Hoster, im Code dokumentiert.

Was migriert wird

Was von Framer mitkommt

Inhalte übertragen wir, das Canvas wird zu Code. Wo eine Framer-Funktion keinen direkten Ersatz hat, siehst du das schon in der Inventur.

  • Wird migriert
  • Teilweise
  • Neu gebaut
  • Ersetzt
  • CMS-Inhalte

    Wird migriert

    Jede Collection exportieren wir als CSV, bereinigen die Felder und importieren die Einträge als Dokumente in Sanity.

  • Seiten und Layouts

    Neu gebaut

    Canvas-Layouts werden zu Astro-Komponenten und Seitenvorlagen. Das Design kann gleich bleiben, der Aufbau darunter ist neu.

  • Code Components

    Teilweise

    Framer Code Components sind React-Komponenten. Viele laufen in Astro als Island weiter, Framer-spezifische Teile passen wir an.

  • Effekte und Animationen

    Neu gebaut

    Scroll- und Hover-Effekte setzen wir mit CSS oder kleinen Skripten neu um, nur dort, wo sie etwas erklären.

  • SEO-Daten

    Wird migriert

    Seitentitel, Beschreibungen und Open-Graph-Bilder aus Framer übernehmen wir je Seite in eigene Sanity-Felder.

  • Formulare

    Neu gebaut

    Framer-Formulare bauen wir neu, verbinden sie direkt mit HubSpot oder deinem CRM und testen jeden Versand.

  • Sprachversionen

    Teilweise

    Locales und lokalisierte Pfade aus Framer Localization bilden wir in Sanity und im Astro-Routing nach, Pfad für Pfad.

  • Marketplace-Komponenten

    Ersetzt

    Komponenten und Plugins aus dem Framer Marketplace ersetzen wir durch eigene Komponenten oder direkte Integrationen.

Für dein Marketing

Was für dein Marketing weiterläuft

Rankings sind nur ein Teil. Wir sichern auch alles, woran dein Team Leads und Pipeline misst.

Tracking und Attribution

GA4, Tag Manager, UTM-Parameter und Conversion-Events laufen ab dem ersten Tag weiter. In Astro laden Tracking-Skripte erst nach Consent und bremsen die Seite nicht. Vor dem Launch vergleichen wir jedes Event auf Staging mit der alten Seite.

Formulare und CRM

Framer-Formulare ersetzen wir durch eigene Formulare mit direkter Anbindung an dein CRM. Felder, Hidden Fields für die Lead-Quelle und die Übergabe an HubSpot, Salesforce oder Pipedrive bleiben gleich. Testleads prüfen wir direkt im CRM.

Demo-Buchung

Demo- und Kontaktseiten, Kalender wie HubSpot Meetings, Calendly oder Chili Piper und dein Chat bleiben erreichbar. Alte Demo-URLs aus Ads, E-Mails und Sales-Decks leiten wir direkt aufs neue Ziel.

Sichtbarkeit in AI-Suche

Strukturierte Daten, klare Überschriften und eine aktuelle Sitemap sind ab dem Launch da. So finden Google und AI-Suchen wie ChatGPT oder Perplexity deine Seiten schnell wieder.

Content-Mapping

So werden Framer-Inhalte zu Sanity und Astro

In FramerIn Astro
CMS CollectionSanity-Dokumenttypmit typisierten Feldern und echten Referenzen
Collection-SeiteDynamische Astro-Routegleicher Pfad, gleicher Slug wie bisher
Komponente mit VariantenAstro-Komponente mit PropsVarianten werden zu Optionen, die dein Team in Sanity wählt
Code ComponentReact-Island in Astrolädt JavaScript nur, wenn die Komponente es braucht
Bilder im CMSSanity Assetsbeim Import direkt aus den Bild-URLs übernommen
LocalesSprachfelder oder Dokumente je Spracheje nachdem, wie unterschiedlich die Versionen sind

Ablauf

So läuft die Migration
deiner Framer-⁠Website

Ein Beispielprojekt: 7 Wochen bis zum Launch. Danach beobachten wir Rankings und Weiterleitungen noch vier Wochen.

Migration von Framer, Beispielprojekt

path digitalDein Team

Dein Team

Zugänge, Freigaben

SEO

URLs, Weiterleitungen, Tests

Umsetzung

Seiten, Inhalte in Astro

Zeig auf einen Schritt, um zu sehen, was dort passiert.

  1. Woche 1 · Dein Team

    Kickoff

  2. Woche 1 · SEO

    Audit, URL-Inventur und Messung

  3. Wochen 1–2 · SEO

    Redirect-Plan und Sanity-Schema

  4. Wochen 2–4 · Umsetzung

    Astro-Komponenten und Vorlagen

  5. Woche 2 · Dein Team

    Freigabe Redirect-Plan

  6. Wochen 4–5 · Umsetzung

    Content-Migration

  7. Wochen 5–7 · SEO

    SEO-Parität, QA und Übergabe

  8. Woche 7 · Dein Team

    Launch

  9. Nach dem Launch · SEO

    Launch und Monitoring

Pre-Launch-Checkliste

Was vor dem Launch geprüft wird

Phase 1 von 4

Vor der Umsetzung

Phase 2 von 4

Während der Umsetzung

Phase 3 von 4

Vor dem Launch

Phase 4 von 4

Nach dem Launch

Ehrlich gesagt

Wann du besser bei Framer bleibst

  • Dein Designteam iteriert jede Woche visuell

    Wenn Designer Seiten selbst im Canvas bauen und niemand im Team Code anfassen will, ist Framer das passendere Werkzeug.

  • Niemand soll für neue Funktionen zuständig sein

    Inhalte pflegt dein Team in Sanity selbst. Neue Komponenten und Integrationen brauchen in Astro einen Entwicklungspartner.

  • Das Problem ist die Botschaft, nicht die Plattform

    Wenn die Seite schnell genug ist und nur nicht überzeugt, hilft dir ein Relaunch der Inhalte mehr als eine Migration.

  • Übersetzungen laufen komplett über Framer

    Arbeitet dein Team mit Framer Localization und Auto Translate, klären wir zuerst, wie der Übersetzungsprozess in Sanity aussehen soll.

Häufige Fragen zur Migration von Framer zu Astro

Was B2B SaaS Teams vor dem Wechsel von Framer zu Astro wissen wollen.

Kann ich meine Framer-Website als Code nach Astro übernehmen?

Nicht als pflegbares Projekt. Framer exportiert CMS-Inhalte per Plugin als CSV, Seiten und Komponenten bauen wir in Astro neu. Das Design kann dabei unverändert bleiben.

Kommen unsere CMS-Inhalte vollständig mit?

Ja. Wir exportieren jede Collection, ordnen die Felder einem Sanity-Schema zu und importieren Einträge und Bilder. Referenzen zwischen Collections bleiben erhalten.

Was passiert mit unseren Code Components?

Framer Code Components sind React-Komponenten. Astro kann React einbinden, deshalb übernehmen wir viele davon und entfernen nur, was an Framer gebunden ist.

Wird die Website dadurch schneller?

Das hängt von deiner heutigen Seite ab. Astro liefert standardmäßig HTML ohne JavaScript. Wir messen die wichtigsten Seiten vor und nach der Migration mit PageSpeed Insights, damit du das Ergebnis siehst.

Kann mein Team ohne Entwickler Seiten ändern?

Texte, Bilder, Blogartikel und neue Seiten aus bestehenden Bausteinen pflegt dein Team in Sanity. Größere Änderungen beschreibt es dem AI-Workflow unserer AI-native Websites. Für neue Funktionen bleibt ein Entwicklungspartner nötig.

Was kostet die Migration von Framer zu Astro?

Ein kompletter Relaunch mit Positionierung, Copy, Design und Umsetzung kostet typischerweise 40.000–60.000 € netto, je nach Umfang weniger oder mehr. Eine reine Migration kostet weniger. Den Umfang klären wir im Call, danach gibt es einen Festpreis.

Plane deine Migration
von Framer zu Astro

Zeig uns deine Framer-Website. Wir sagen dir, welche Komponenten neu entstehen, wie dein Sanity-Modell aussieht und welche URLs besondere Aufmerksamkeit brauchen.