Migrar de Webflow para Astro: como mudar um site sem perder conteúdo, design nem posições no Google

A resposta curta

Sair do Webflow é mais fácil do que sair do Framer, que não tem nenhuma exportação em HTML, mas só até certo ponto. Nos planos pagos de Workspace, você pode exportar o HTML, o CSS, o JavaScript e as imagens do site e hospedá-los onde quiser. A central de ajuda do Webflow é igualmente clara sobre o que fica para trás: conteúdo do CMS, processamento de formulários, busca interna do site, proteção por senha, páginas localizadas e code components não entram na exportação, e as Collection lists aparecem no estado vazio (Webflow Help).

Por isso, migrar de Webflow para Astro é em parte exportação e em parte reconstrução. Você exporta o que o Webflow oferece, tira o CMS em CSV ou pela API, reconstrói cada template como componentes Astro, substitui formulários e busca, recria as interações que quer manter e dá a cada URL que muda um redirecionamento permanente. Feito nessa ordem, o novo site mantém o design, o conteúdo e as posições no Google.

Por que as equipes trocam o Webflow pelo Astro

O Webflow é um ótimo construtor visual, e muitas equipes de marketing deveriam continuar nele. Os motivos para sair costumam ter a ver com propriedade e custo, não com design:

• O site passa a ser da equipe de engenharia. Quando são os desenvolvedores que fazem a maioria das mudanças, uma base de código no seu próprio repositório é mais rápida de trabalhar do que um canvas visual, e pode ficar ao lado do seu produto, do seu backend e dos seus testes.
• Custo do plano por site. Na página de preços do Webflow, consultada em 13 de outubro de 2026, o plano de site Basic custa USD 15 por mês e o Premium, o plano com o CMS do Webflow, USD 25 por mês, ambos com cobrança anual. A localização é um complemento a partir de USD 9 por mês.
• Recursos que precisam de um backend de verdade: formulários que gravam no seu CRM, conteúdo restrito, busca em mais de um site ou qualquer coisa que tenha de rodar na sua própria infraestrutura.
• Exportar não basta para sair. A exportação de código exige um plano pago de Workspace, não só um plano de site, e deixa o CMS de fora. Uma saída limpa exige planejamento de qualquer forma.

Se a sua equipe de marketing publica páginas visualmente toda semana e o site cumpre o seu papel, continuar no Webflow é uma escolha razoável. Uma migração precisa trazer algo concreto.

O que a exportação de código do Webflow inclui e o que deixa de fora

Fonte: artigo da central de ajuda do Webflow sobre como exportar o código do site.

O que vimos ao analisar sites publicados no Webflow

Em 13 de outubro de 2026, baixamos as páginas iniciais de sete sites feitos no Webflow, incluindo o próprio webflow.com, e analisamos o que uma migração teria de levar junto:

• Os sete carregam jQuery e suas imagens dos servidores do Webflow. As imagens vêm de cdn.prod.website-files.com, e a própria central de ajuda do Webflow avisa que os campos de imagem e de arquivo exportados para CSV são links para a hospedagem do projeto original, que deixam de funcionar se esse projeto for excluído (Webflow Help). Cada arquivo precisa ser baixado e hospedado de novo.
• Os sete também servem pelo Webflow a imagem de compartilhamento nas redes sociais. A imagem Open Graph é fácil de esquecer, e as prévias de links no LinkedIn ou no WhatsApp ficam sem imagem quando o projeto antigo é encerrado.
• Os sete renderizam as listas do CMS diretamente no HTML publicado, de 3 a 19 Collection lists por página inicial. É uma boa notícia: ao contrário de um site no Framer, que, como mostra o nosso guia para migrar de Framer para Astro, é reconstruído por um runtime depois de carregar, uma página publicada no Webflow é uma referência completa de qual conteúdo vai onde, mesmo que a exportação de código deixe essas listas vazias.
• Cinco dos sete usam Webflow Interactions, identificadas por atributos data-w-id em até 109 elementos de uma única página inicial. Cada uma é um pequeno comportamento a recriar, ou uma decisão de descartá-lo.

De Webflow para Astro, passo a passo

1. Faça o inventário de todas as URLs. O Webflow gera o /sitemap.xml automaticamente quando essa opção está ativada (Webflow Help). Acrescente todas as páginas de Collection, exporte o relatório Páginas do Google Search Console com o maior período disponível e exporte em CSV os redirecionamentos 301 existentes em Site settings, Publishing (Webflow Help).
2. Exporte o conteúdo. Exporte cada Collection do CMS para CSV a partir do painel CMS, uma vez por idioma se você usa o Localize, e mantenha a coluna Item ID. O CSV achata os dados: campos de referência viram texto simples, multirreferências viram texto separado por vírgulas e rich text vira HTML. Para tudo o que tem referências, a Webflow Data API lista os itens com seus campos e idiomas, o que costuma ser mais limpo do que costurar os arquivos CSV de volta.
3. Baixe todos os arquivos. Imagens, PDFs, as fontes que a sua licença permite hospedar por conta própria, as imagens Open Graph e o favicon. Não encerre o projeto no Webflow enquanto o novo site ainda apontar para website-files.com.
4. Exporte o código como referência. Se você tem um plano pago de Workspace, exporte o HTML e o CSS. Não publique isso como o novo site: ele levaria junto o webflow.js, o jQuery e listas do CMS vazias. Use a exportação para ler com exatidão espaçamentos, breakpoints e a estrutura de classes.
5. Modele o conteúdo no Astro. Transforme cada Collection em uma content collection do Astro ou em um modelo de headless CMS, mantendo as referências como referências, depois reconstrua cada template como componentes Astro e leve as imagens para o astro:assets.
6. Recrie as interações que carregam significado. A maioria das Webflow Interactions vira transições CSS, keyframes ou algumas linhas de JavaScript. Para animações mais pesadas, o GSAP é gratuito para uso comercial desde abril de 2025, quando o Webflow o liberou (Webflow). Em qualquer caso, respeite o prefers-reduced-motion.
7. Substitua formulários, busca e páginas protegidas. Dê a cada formulário um endpoint real (um Cloudflare Worker, um serviço de formulários ou o seu CRM), adicione um índice de busca estático como o Pagefind se o site precisar de busca e leve qualquer proteção por senha para a hospedagem ou para o seu aplicativo.
8. Reconstrua direito as páginas localizadas. A exportação de código só traz o idioma principal, então construa cada idioma com o roteamento de i18n do Astro, uma URL por idioma, com hreflang entre elas.
9. Mantenha o formato das URLs. O Webflow serve as páginas sem barra no final e redireciona /pricing/ para /pricing. Configure trailingSlash e build.format no Astro para que o novo site gere os mesmos endereços (referência de configuração do Astro); cada diferença é um redirecionamento de que você não precisava.
10. Redirecione no servidor, depois lance e acompanhe. Um build estático do Astro sem adaptador transforma os redirecionamentos configurados em páginas de meta refresh, então configure redirecionamentos 301 de 1 para 1 onde o site estiver hospedado, por exemplo em um arquivo _redirects do Cloudflare. Troque o DNS, mantenha o projeto no Webflow até o novo site ser verificado e acompanhe os relatórios de indexação do Search Console nas semanas seguintes. Nosso checklist de SEO para migração de site cobre o dia do lançamento e os 90 dias seguintes.

O que muda depois da migração

Como manter o SEO intacto

As orientações do Google sobre mudanças de site com alteração de URLs valem aqui: associe cada URL antiga ao equivalente novo mais próximo, use redirecionamentos permanentes no servidor e mantenha-os por pelo menos um ano. Se as URLs continuarem idênticas, o que uma reconstrução cuidadosa muitas vezes consegue com o Webflow, o principal é verificar se títulos, descrições, tags canonical, dados estruturados e imagens Open Graph vieram junto.

As armadilhas específicas do Webflow são as sobras: uma imagem Open Graph ou um PDF ainda servido a partir de website-files.com, um endereço de staging webflow.io ainda indexado ou uma página do CMS cujo slug mudou na migração. Confira os três pontos antes de encerrar o projeto no Webflow.

Como a Dardo conduz uma migração do Webflow

Fazemos migrações do Webflow como parte do nosso serviço de migração de site: inventário de URLs e conteúdo, exportação do CMS, uma página representativa reconstruída primeiro e revisada nas larguras combinadas e, depois, o restante dos templates, formulários e redirecionamentos. A construção em si é desenvolvimento web em Astro, e o trabalho de animação é desenvolvimento criativo. Este site, o dardo.studio, roda em Astro no Cloudflare Workers, com o conteúdo em um headless CMS, e escrevemos e publicamos este blog por meio desse CMS.

Se você está avaliando uma migração, envie o site e o que você quer mudar. Vamos dizer se vale a pena sair do Webflow antes de fazer um orçamento.