--- title: "Migrer de Webflow vers Astro sans perdre son SEO — Dardo" description: "Migrer de Webflow vers Astro : l'export ignore le CMS, les formulaires et les langues. Quoi exporter, quoi reconstruire et comment garder URL et SEO." url: "https://dardo.studio/fr/blog/migrer-webflow-vers-astro/" language: "fr" translations: {"en":"https://dardo.studio/en/blog/webflow-to-astro/","es":"https://dardo.studio/es/blog/migrar-de-webflow-a-astro/","de":"https://dardo.studio/de/blog/webflow-zu-astro-migrieren/","it":"https://dardo.studio/it/blog/migrare-da-webflow-ad-astro/","pt":"https://dardo.studio/pt/blog/migrar-de-webflow-para-astro/","nl":"https://dardo.studio/nl/blog/webflow-naar-astro/","sv":"https://dardo.studio/sv/blogg/migrera-webflow-till-astro/","pl":"https://dardo.studio/pl/blog/migracja-z-webflow-do-astro/","uk":"https://dardo.studio/uk/blog/webflow-to-astro/","ru":"https://dardo.studio/ru/blog/webflow-to-astro/","ar":"https://dardo.studio/ar/blog/webflow-to-astro/","hi":"https://dardo.studio/hi/blog/webflow-to-astro/","th":"https://dardo.studio/th/blog/webflow-to-astro/","ja":"https://dardo.studio/ja/blog/webflow-to-astro/","ko":"https://dardo.studio/ko/blog/webflow-to-astro/","zh-Hans":"https://dardo.studio/zh-Hans/blog/webflow-to-astro/","zh-Hant":"https://dardo.studio/zh-Hant/blog/webflow-to-astro/"} updated: "2026-10-13T02:20:06.422Z" --- [Blog](https://dardo.studio/fr/blog/) # Migrer de Webflow vers Astro : quitter Webflow sans perdre contenu, design ni référencement Migrer de Webflow vers Astro : l'export de code laisse de côté CMS, formulaires, recherche et langues. Quoi exporter, quoi reconstruire, comment garder le SEO. Par [Nicolás Cerón](https://dardo.studio/fr/studio/) ·12 octobre 2026 ![Une ancienne écluse en pierre, la nuit, aux portes de bois ouvertes : un petit bateau cramoisi quitte un canal au courant rapide pour entrer dans un port calme, sous un observatoire illuminé sur la colline.](https://dardo.studio/_astro/01M4SGD5R7TZ48H2M3RJ9DSK7D_Z2nrI.webp) ## Points clés - Avec un plan Workspace payant, Webflow exporte HTML, CSS, JavaScript et images, mais pas le contenu du CMS, le traitement des formulaires, la recherche du site, la protection par mot de passe ni les langues secondaires. - Exportez chaque Collection du CMS en CSV, une fois par langue, ou lisez-la via l'API Data de Webflow, et téléchargez chaque image : les champs image exportés pointent toujours vers l'hébergement de Webflow. - Traitez l'export de code comme une référence, pas comme le nouveau site : il embarque le JavaScript de Webflow, jQuery et des Collection lists vides. - Webflow sert ses URL sans slash final : réglez trailingSlash et build.format dans Astro en conséquence, et ajoutez des redirections 301 une à une côté serveur pour tout ce qui change. - Avant de fermer le projet Webflow, vérifiez qu'aucune image, aucun PDF ni aucune image Open Graph n'est encore servi depuis website-files.com. ## La réponse courte Webflow est plus facile à quitter que Framer, qui n'a aucun export HTML, mais seulement en partie. Avec un plan Workspace payant, vous pouvez exporter le HTML, le CSS, le JavaScript et les images de votre site et les héberger où vous voulez. Le centre d'aide de Webflow est tout aussi clair sur ce qui reste derrière : le contenu du CMS, le traitement des formulaires, la recherche du site, la protection par mot de passe, les pages localisées et les code components ne font pas partie de l'export, et les Collection lists s'affichent dans leur état vide ([Webflow Help](https://help.webflow.com/hc/en-us/articles/33961386739347-How-do-I-export-my-Webflow-site-code)). Migrer de Webflow vers Astro, c'est donc en partie exporter, en partie reconstruire. Vous exportez ce que Webflow vous donne, vous sortez le CMS en CSV ou via l'API, vous reconstruisez chaque gabarit en composants Astro, vous remplacez formulaires et recherche, vous recréez les interactions que vous voulez garder et vous donnez une redirection permanente à chaque URL qui change. Dans cet ordre, le nouveau site conserve son design, son contenu et son référencement. ## Pourquoi les équipes passent de Webflow à Astro Webflow est un excellent outil de création visuelle, et beaucoup d'équipes marketing ont intérêt à y rester. Les raisons de partir tiennent en général à la maîtrise du site et au coût plutôt qu'au design : - **Le site passe aux mains des développeurs.** Quand ce sont des développeurs qui font l'essentiel des modifications, une base de code dans votre propre dépôt est plus rapide à faire évoluer qu'un canevas visuel, et elle peut vivre à côté de votre produit, de votre backend et de vos tests. - **Le coût des plans par site.** Sur la [page des tarifs de Webflow](https://webflow.com/pricing), consultée le 13 octobre 2026, le plan de site Basic coûte 15 USD par mois et Premium, le plan qui inclut le CMS de Webflow, 25 USD par mois, tous deux en facturation annuelle. La localisation est une option à partir de 9 USD par mois. - **Des fonctionnalités qui exigent un vrai backend :** des formulaires qui écrivent dans votre CRM, du contenu réservé, une recherche sur plusieurs sites ou tout ce qui doit tourner sur votre propre infrastructure. - **Exporter ne suffit pas pour partir.** L'export de code exige un plan Workspace payant, pas seulement un plan de site, et il laisse de côté le CMS. Une sortie propre se prépare dans tous les cas. Si votre équipe marketing publie des pages visuellement chaque semaine et que le site remplit son rôle, rester sur Webflow est un choix raisonnable. Une migration doit apporter quelque chose de précis. ## Ce que l'export de code de Webflow inclut et laisse de côté | Partie du site | Dans l'export de code ? | Que faire dans Astro | | ------------------------------------------------- | ---------------------------------------------------- | ----------------------------------------------------------------- | | Pages statiques | Oui, en fichiers .html, langue principale uniquement | Les reconstruire en pages et composants Astro | | Styles | Oui : le CSS du site, webflow.css et normalize.css | S'en servir comme référence et ne garder que le CSS utile | | Interactions et composants | Oui, via les fichiers JavaScript de Webflow | Les recréer en CSS ou avec un petit script | | Images du panneau Assets | Oui | Les optimiser avec astro:assets | | Éléments et listes des Collections du CMS | Non ; les listes s'affichent vides | Les exporter en CSV ou les lire via l'API | | Envois de formulaires | Aucun traitement | Relier chaque formulaire à votre propre récepteur | | Recherche du site | Non | Ajouter un index de recherche statique ou un service de recherche | | Protection par mot de passe | Non | Protéger les pages chez votre hébergeur ou dans votre application | | Langues secondaires | Non ; seule la langue principale | Les reconstruire avec le routage i18n d'Astro | | E-commerce, comptes utilisateurs, code components | Non | Traiter chacun comme un projet à part | Source : l'article d'aide de Webflow sur [l'export du code du site](https://help.webflow.com/hc/en-us/articles/33961386739347-How-do-I-export-my-Webflow-site-code). ## Ce que nous avons vu en examinant des sites Webflow publiés Le 13 octobre 2026, nous avons téléchargé la page d'accueil de sept sites construits avec Webflow, dont webflow.com, et regardé ce qu'une migration devrait reprendre : - **Les sept chargent jQuery et leurs images depuis les serveurs de Webflow.** Les images viennent de cdn.prod.website-files.com, et le centre d'aide de Webflow précise lui-même que les champs image et fichier exportés en CSV sont des liens vers l'hébergement du projet d'origine, qui cessent de fonctionner si ce projet est supprimé ([Webflow Help](https://help.webflow.com/hc/en-us/articles/33961290794771-How-do-I-import-content-into-the-Webflow-CMS)). Chaque fichier doit être téléchargé et hébergé à nouveau. - **Les sept servent aussi leur image de partage depuis Webflow.** L'image Open Graph est facile à oublier, et les aperçus de liens sur LinkedIn ou WhatsApp perdent leur image une fois l'ancien projet fermé. - **Les sept affichent leurs listes du CMS directement dans le HTML publié**, entre 3 et 19 Collection lists par page d'accueil. C'est une bonne nouvelle : contrairement à un site Framer, qui est reconstruit par un runtime après le chargement, comme le montre notre [guide pour migrer de Framer vers Astro](https://dardo.studio/fr/blog/migrer-framer-vers-astro/), une page Webflow publiée est une référence complète pour savoir quel contenu va où, même si l'export de code laisse ces listes vides. - **Cinq des sept utilisent Webflow Interactions**, signalées par des attributs data-w-id sur jusqu'à 109 éléments d'une même page d'accueil. Chaque interaction est un petit comportement à recréer, ou une décision d'y renoncer. ## Migrer de Webflow vers Astro, étape par étape 1. **Inventoriez toutes les URL.** Webflow génère automatiquement /sitemap.xml quand l'option est activée ([Webflow Help](https://help.webflow.com/hc/en-us/articles/33961355371667-Create-a-sitemap-in-Webflow)). Ajoutez chaque page de Collection, téléchargez le rapport Pages de Google Search Console sur la plus longue période disponible et exportez vos redirections 301 existantes en CSV depuis Site settings, Publishing ([Webflow Help](https://help.webflow.com/hc/en-us/articles/33961211526291-Import-export-301-redirects)). 2. **Exportez le contenu.** Exportez chaque Collection du CMS en CSV depuis le panneau CMS, une fois par langue si vous utilisez Localize, et gardez la colonne Item ID. Le CSV aplatit les données : les champs de référence sortent en texte brut, les références multiples en texte séparé par des virgules et le texte enrichi en HTML. Pour tout ce qui comporte des références, l'[API Data de Webflow](https://developers.webflow.com/data/reference/cms/collection-items) liste les éléments avec leurs champs et leurs langues, ce qui est en général plus propre que de recoller des fichiers CSV entre eux. 3. **Téléchargez tous les fichiers.** Images, PDF, polices que votre licence permet d'héberger vous-même, images Open Graph et favicon. Ne fermez pas le projet Webflow tant que le nouveau site pointe encore vers website-files.com. 4. **Exportez le code comme référence.** Si vous avez un plan Workspace payant, exportez le HTML et le CSS. Ne le mettez pas en ligne comme nouveau site : il embarquerait webflow.js, jQuery et des listes du CMS vides. Servez-vous-en pour relever les espacements exacts, les points de rupture et la structure des classes. 5. **Modélisez le contenu dans Astro.** Transformez chaque Collection en [content collection](https://docs.astro.build/en/guides/content-collections/) Astro ou en modèle de CMS headless, en gardant les références comme références, puis reconstruisez chaque gabarit en composants Astro et déplacez les images vers [astro:assets](https://docs.astro.build/en/guides/images/). 6. **Recréez les interactions qui portent du sens.** La plupart des Webflow Interactions deviennent des transitions CSS, des keyframes ou quelques lignes de JavaScript. Pour des animations plus lourdes, GSAP est gratuit pour un usage commercial depuis avril 2025, à l'initiative de Webflow ([Webflow](https://webflow.com/blog/gsap-becomes-free)). Dans tous les cas, respectez prefers-reduced-motion. 7. **Remplacez formulaires, recherche et pages protégées.** Donnez à chaque formulaire une vraie destination (un Cloudflare Worker, un service de formulaires ou votre CRM), ajoutez un index de recherche statique comme [Pagefind](https://pagefind.app/) si le site a besoin d'une recherche, et déplacez toute protection par mot de passe chez votre hébergeur ou dans votre application. 8. **Reconstruisez correctement les pages localisées.** Seule la langue principale sort dans l'export de code : construisez donc chaque langue avec le [routage i18n d'Astro](https://docs.astro.build/en/guides/internationalization/), une URL par langue, avec des balises hreflang entre elles. 9. **Reprenez le même format d'URL.** Webflow sert les pages sans slash final et redirige /pricing/ vers /pricing. Réglez trailingSlash et build.format dans Astro pour que le nouveau site produise les mêmes adresses ([référence de configuration d'Astro](https://docs.astro.build/en/reference/configuration-reference/)) ; chaque différence est une redirection dont vous auriez pu vous passer. 10. **Redirigez côté serveur, puis mettez en ligne et surveillez.** Un build Astro statique sans adaptateur transforme les redirections configurées en pages meta refresh : configurez donc des redirections 301 une à une là où le site est hébergé, par exemple dans un fichier \_redirects de Cloudflare. Basculez le DNS, gardez le projet Webflow jusqu'à ce que le nouveau site soit vérifié et suivez les rapports d'indexation de Search Console pendant les semaines suivantes. Notre [checklist SEO de migration de site web](https://dardo.studio/fr/blog/checklist-seo-migration-site-web/) couvre le jour du lancement et les 90 jours qui suivent. ## Ce qui change après la migration | Aspect | Sur Webflow | Sur Astro | | ------------ | ----------------------------------------- | ------------------------------------------------------------------------ | | Édition | Designer visuel et éditeur du CMS Webflow | Champs d'un CMS ou code, selon votre choix | | Hébergement | Hébergement Webflow, facturé par site | N'importe quel hébergement statique ou plateforme edge, comme Cloudflare | | CMS | Collections Webflow | Content collections ou CMS headless | | Formulaires | Gestion des formulaires par Webflow | Votre propre récepteur et votre propre stockage | | Recherche | Recherche du site Webflow (Premium) | Un index statique ou un service de recherche | | Localisation | Option Webflow Localize | Routage i18n d'Astro, une URL par langue | | Animations | Webflow Interactions et GSAP | CSS et JavaScript qui vous appartiennent et que vous pouvez mesurer | ## Préserver le référencement Les consignes de Google sur les [déménagements de site avec changement d'URL](https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes) s'appliquent ici : associez chaque ancienne URL à son équivalent le plus proche, utilisez des redirections permanentes côté serveur et gardez-les au moins un an. Si les URL restent identiques, ce qu'une reconstruction soignée permet souvent avec Webflow, il suffit pour l'essentiel de vérifier que titres, descriptions, balises canoniques, données structurées et images Open Graph ont bien été repris. Les pièges propres à Webflow, ce sont les restes : une image Open Graph ou un PDF encore servi depuis website-files.com, une adresse de préproduction en webflow.io encore indexée, ou une page du CMS dont le slug a changé pendant la migration. Vérifiez ces trois points avant de fermer le projet Webflow. ## Comment Dardo mène une migration depuis Webflow Nous menons les migrations depuis Webflow dans le cadre de notre service de [migration de site web](https://dardo.studio/fr/services/migration-de-site-web/) : inventaire des URL et du contenu, export du CMS, une page représentative reconstruite en premier et validée aux largeurs convenues, puis le reste des gabarits, des formulaires et des redirections. La construction relève du [développement web](https://dardo.studio/fr/services/developpement-web/) en Astro, et les animations du [développement créatif](https://dardo.studio/fr/services/developpement-creatif/). Ce site, dardo.studio, tourne sur Astro avec Cloudflare Workers et son contenu vit dans un CMS headless ; c'est à travers ce CMS que nous rédigeons et publions ce blog. Si vous envisagez une migration, [envoyez-nous le site et ce que vous voulez changer](https://dardo.studio/fr/contact/?service=website-migration). Nous vous dirons si quitter Webflow en vaut la peine avant de vous faire un devis. ## Questions fréquentes **Peut-on exporter un site Webflow en HTML ?** Oui, avec un plan Workspace payant : Webflow exporte le HTML, le CSS, le JavaScript et les images, et vous pouvez les héberger où vous voulez sans obligation de mentionner Webflow. Un plan de site seul n'inclut pas l'export de code, et l'export laisse de côté le contenu du CMS, le traitement des formulaires, la recherche du site, la protection par mot de passe et les langues secondaires. **L'export de code de Webflow inclut-il le contenu du CMS ?** Non. Les Collection lists affichent leur état vide et les pages de Collection perdent le contenu lié à leurs champs. Exportez chaque Collection en CSV depuis le panneau CMS, ou lisez-la via l'API Data de Webflow, qui garde ensemble les champs et les langues. **Vais-je perdre mon référencement Google en passant de Webflow à Astro ?** Non, si chaque URL qui génère du trafic continue de fonctionner. Gardez les mêmes chemins, y compris le format sans slash final de Webflow, ajoutez des redirections 301 permanentes pour tout ce qui change, reprenez titres, descriptions et données structurées, et surveillez Search Console pendant quelques semaines après la mise en ligne. **Les interactions Webflow fonctionnent-elles dans Astro ?** Pas telles quelles. Elles reposent sur le JavaScript de Webflow : chaque interaction que vous gardez doit être recréée en CSS ou avec un petit script. Pour des animations plus lourdes, GSAP est gratuit pour un usage commercial depuis avril 2025. **Que deviennent les formulaires Webflow après la migration ?** Les formulaires exportés n'envoient leurs données nulle part, car Webflow traite les envois sur son propre hébergement. Reliez chaque formulaire à votre propre récepteur, par exemple un Cloudflare Worker, un service de formulaires ou votre CRM, testez la livraison avant la mise en ligne et exportez séparément les anciens envois depuis Webflow. **Mon équipe pourra-t-elle encore modifier le site sans coder après avoir quitté Webflow ?** Oui, si le site Astro utilise un CMS headless. Les rédacteurs travaillent dans une interface web et le site est reconstruit à partir de ce contenu. C'est ainsi que fonctionne dardo.studio. ## Sources et lectures complémentaires Les sources de cette page, avec des précisions complémentaires de la part des éditeurs d'origine. - [Webflow Help : comment exporter le code de son site Webflow ? (en anglais)](https://help.webflow.com/hc/en-us/articles/33961386739347-How-do-I-export-my-Webflow-site-code) · help.webflow.com - [Webflow Help : importer et exporter le contenu des Collections du CMS (en anglais)](https://help.webflow.com/hc/en-us/articles/33961290794771-How-do-I-import-content-into-the-Webflow-CMS) · help.webflow.com - [Webflow Help : importer et exporter des redirections 301 (en anglais)](https://help.webflow.com/hc/en-us/articles/33961211526291-Import-export-301-redirects) · help.webflow.com - [Webflow Help : créer un sitemap dans Webflow (en anglais)](https://help.webflow.com/hc/en-us/articles/33961355371667-Create-a-sitemap-in-Webflow) · help.webflow.com - [Tarifs de Webflow](https://webflow.com/pricing) · webflow.com - [API Data de Webflow : lister les éléments d'une Collection (en anglais)](https://developers.webflow.com/data/reference/cms/collection-items) · developers.webflow.com - [Webflow : Webflow rend GSAP 100 % gratuit (en anglais)](https://webflow.com/blog/gsap-becomes-free) · webflow.com - [Documentation Astro : content collections](https://docs.astro.build/en/guides/content-collections/) · docs.astro.build - [Documentation Astro : images](https://docs.astro.build/en/guides/images/) · docs.astro.build - [Documentation Astro : routage pour l'internationalisation (i18n)](https://docs.astro.build/en/guides/internationalization/) · docs.astro.build - [Documentation Astro : référence de configuration](https://docs.astro.build/en/reference/configuration-reference/) · docs.astro.build - [Pagefind : recherche statique (en anglais)](https://pagefind.app/) · pagefind.app - [Google Search Central : déplacer un site en modifiant les URL](https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes) · developers.google.com [Nicolás Cerón](https://dardo.studio/fr/studio/) Nicolás Cerón est le fondateur de Dardo, un studio de branding, de design et de développement web basé à Bogotá, en Colombie. ## Articles connexes - [**Migrer de Framer vers Astro : changer de plateforme sans perdre le design ni le référencement**Framer n'exporte pas en HTML : passer à Astro, c'est reconstruire. Ce qu'il faut capturer d'abord, ce qui casse et comment garder design, URL et positions.](https://dardo.studio/fr/blog/migrer-framer-vers-astro/) - [**Checklist SEO de migration de site web : changer de plateforme ou de domaine sans perdre ses positions**Les positions chutent rarement à cause de la nouvelle plateforme, mais parce que des URL qui généraient du trafic ne répondent plus. Une checklist, de l'inventaire des URL au 90e jour.](https://dardo.studio/fr/blog/checklist-seo-migration-site-web/) - [**Migrer de WordPress vers Astro : en headless ou entièrement, sans perdre son référencement**Migrer de WordPress vers Astro : deux approches, quoi exporter, comment garder titres Yoast, permaliens et médias, et les URL WordPress souvent oubliées.](https://dardo.studio/fr/blog/migrer-wordpress-vers-astro/) - [**WordPress ou site sur mesure ? Comment choisir, et quand chaque option est rentable**WordPress ou site sur mesure : quand choisir l'un ou l'autre, et la voie du WordPress headless, comparés sur le coût, la vitesse, l'entretien et la propriété.](https://dardo.studio/fr/blog/wordpress-ou-site-sur-mesure/) ## Continuez à explorer. - [Service · **Migration de site web sans perdre votre référencement SEO**](https://dardo.studio/fr/services/migration-de-site-web/) - [Votre projet · **Lançons la conversation**](https://dardo.studio/fr/contact/)