Serviços Blog Cases Glossário Soluções Ferramentas Contato Consultoria Gratuita

Tecnologia & CMS

Como migrar de Webflow para Framer: o guia em 8 etapas

19/09/2026 10 min de leitura Por Equipe M&C

Webflow e Framer resolvem o mesmo problema: sites de marketing profissionais sem código: com filosofias distintas: hierarquia de classes herdadas de um lado, componentes, variantes e variáveis do outro. A boa notícia para quem migra: as estruturas se mapeiam quase uma a uma, e o conteúdo sai do Webflow em CSV limpo. A má: quem copia as classes sem consolidar os padrões carrega a bagunça para a casa nova. Este guia cobre as 8 etapas com esse cuidado.

O motivo mais comum da troca não é preço nem velocidade: é manutenção. Projetos Webflow grandes acumulam combinações de classes, overrides e padrões únicos que ninguém mais entende; editar um card vira arqueologia. A migração para o Framer é a oportunidade de consolidar: o que era classe espalhada vira componente com variantes, o que era símbolo vira componente compartilhado, e o que nunca foi usado simplesmente não atravessa.

Etapa 1: Inventário total (páginas, coleções, assets, estilos)

Antes de tocar no Framer, documente o site inteiro: cada página estática, rota de CMS, página de utilidade (404, senha), campanha e versão localizada com sua URL atual: e a decisão por página: manter, reconstruir, mesclar, redirecionar ou remover. Copie os redirects já configurados no Webflow (perdê-los cria cadeias de redirecionamento na migração). Para o CMS: liste cada coleção com seus campos, slugs, referências e multi-referências, e exporte todas em CSV. Baixe os originais de imagens, SVGs, vídeos, fontes e arquivos para download: não confie nos URLs do CDN do Webflow para sempre. E documente o sistema atual: escala tipográfica, cores, espaçamentos, grids e breakpoints.

Etapa 2: O dicionário de conceitos (a tabela que evita retrabalho)

Os dois sistemas se traduzem assim: Site vira Projeto; Página vira Página; Classe vira Estilo, componente ou variável; Símbolo vira Componente; Coleção vira Coleção de CMS (item a item); campo de referência vira campo de referência; Interação vira Efeito, variante de componente ou código; Breakpoint vira Breakpoint. O ponto de virada mental: no Webflow você compõe classes; no Framer você define estilos e componentes e reusa. Quem migra mantendo a mentalidade de classes recria a bagunça com outro nome.

Etapa 3: Projeto Framer: estilos, variáveis e componentes primeiro

Crie as páginas preservando os caminhos importantes e as rotas localizadas: os slugs que você decidir manter não podem mudar de endereço. Construa primeiro os estilos de texto e cor, as variáveis e os componentes centrais (navegação, rodapé, cards, CTAs): escolhendo uma página representativa para estabelecer o sistema antes de replicar. Comece pelo desktop e valide no tablet e no celular conforme constrói, em vez de presumir que o desktop traduz sozinho. Crie as coleções de CMS e seus campos antes de importar: e para relações, importe primeiro a coleção referenciada.

Etapa 4: CMS: uma coleção por vez, com teste pequeno

A importação de CSV é o caminho mais direto para a maioria das coleções do Webflow. O método: abra a coleção correspondente, importe o CSV, mapeie cada coluna ao campo correto e confira slugs, datas, texto rico, imagens, arquivos, opções e referências: depois abra as páginas de lista e de detalhe com conteúdo real para validar. Comece por um conjunto pequeno e representativo; uma coleção por vez. Alternativas: os Agentes do Framer para importações assistidas repetíveis e a API de servidor para migrações programáticas avançadas.

Etapa 5: A página-modelo que define o padrão

Reconstrua primeiro uma página que contenha tudo: navegação, seções repetidas, conteúdo de CMS, formulário e padrões responsivos. Converta seções repetidas em componentes, conecte os campos do CMS e teste valores longos, curtos e ausentes: o detalhe que separa uma migração madura de uma demonstração. Recrie as interações com efeitos nativos, variantes ou código; revise os três breakpoints antes de seguir para as demais páginas.

Etapa 6: Formulários, integrações e privacidade

Recrie os formulários e reconecte os destinos: campos obrigatórios, validação, mensagens de sucesso, texto de consentimento, notificações e rastreamento. Recoloque analytics, gerenciador de tags, consentimento de cookies (relevante para LGPD no Brasil), CRM, chat e embeds: e verifique cada um no domínio de produção, não só no staging, respeitando os requisitos de privacidade.

Etapa 7: Redirects: só o que mudou (sem cadeias)

Regra simples que o guia oficial reforça: só o endereço alterado ou removido precisa de redirect: slugs mantidos continuam funcionando. Cada URL antiga aponta direto para a página mais relevante (nunca tudo para a home, que o Google trata como soft 404) e sem cadeias: A→B→C dilui autoridade e vira A→C. O Framer aceita redirects exatos, com curinga, grupos de captura e parâmetros nomeados, além de importação em lote via CSV com colunas de origem e destino. Se o domínio também mudar, o redirecionamento de domínio fica no host antigo.

Etapa 8: Teste completo, DNS e pós-lançamento

A lista de pré-lançamento: rotas importantes abertas, navegação e links internos (inclusive dentro do texto rico), formulários, analytics, consentimento, código personalizado, títulos/descrições/canonicals/dados estruturados, redirects, página 404, sitemap.xml, robots.txt e páginas representativas nos três breakpoints: com aprovação de conteúdo, design, SEO e técnica. No corte, conecte o domínio, aguarde verificação e SSL e mantenha o projeto Webflow no ar até o novo site e os redirects estarem verificados em produção. Depois do lançamento: erros de rastreamento, tráfego, conversões: e o monitoramento de SEO pelas semanas seguintes.

Quando a migração faz sentido (e quando não faz)

Faz sentido para sites de marketing que querem edição mais rápida, design system consolidado e menos dependência de especialista. Não faz para quem depende de recursos específicos do Webflow sem equivalente no fluxo atual: e nesse caso a resposta honesta é avaliar antes de migrar. A decisão certa é por projeto: o comparativo Framer × Webflow separa o que é generalidade de marketing do que vale para o seu caso.

Com o método certo, a migração Webflow → Framer é das mais previsíveis que existem: as estruturas se correspondem e o conteúdo exporta limpo. Para quem prefere delegar, a M&C executa o processo completo com mapa de URLs na primeira semana; e para entender o destino da categoria (por que times deixam o Webflow), o artigo de motivações reúne os relatos.

Perguntas frequentes

Dúvidas rápidas

Quanto tempo leva migrar de Webflow para Framer?
Depende do volume de páginas e coleções. Sites de marketing típicos (10–40 páginas, algumas coleções) ficam prontos em 2 a 4 semanas; sites com muitas coleções relacionadas, rotas localizadas e integrações levam mais. O inventário da primeira etapa define o cronograma real.
Minhas coleções do Webflow migram para o CMS do Framer?
Sim: cada coleção é exportada como CSV do Webflow e importada no CMS do Framer, uma coleção por vez, mapeando coluna a campo. Referências e multi-referências são preservadas importando primeiro a coleção referenciada. O texto formatado, imagens e datas merecem verificação pós-importação.
As classes do Webflow têm equivalente no Framer?
Não como classes: e essa é a oportunidade. Classes combinadas e overrides viram estilos de texto/cor, variáveis e componentes com variantes no Framer. Migrar copiando a lógica de classes recria a complexidade que motivou a troca; o ideal é consolidar os padrões durante a migração.
Preciso redirecionar todas as URLs na migração?
Não: apenas as que mudam de endereço ou saem do ar. Slugs de CMS e caminhos mantidos continuam respondendo normalmente. Redirects desnecessários desperdiçam orçamento de rastreamento; o que não pode faltar é o redirect para toda URL alterada, apontando à página mais relevante e sem cadeias.
O site fica fora do ar durante a migração?
Não. O projeto Framer é construído e validado no domínio de staging enquanto o Webflow segue no ar. A troca de DNS acontece só depois dos testes, e o projeto antigo permanece ativo até o novo site e os redirects estarem verificados em produção: sem downtime visível.

Migração Webflow → Framer executada por quem faz os dois

A M&C migra seu site preservando coleções, slugs e rankings. Veja o serviço de Migração Framer.

Continue lendo

Leia também

Fale conosco no WhatsApp