The Complete Webflow Migration Checklist for 2026

Why You Need a Migration Checklist

Webflow migrations fail for one reason more than any other: missed steps. Not bad code, not wrong technology choices — forgotten tasks. A form that nobody tested. A redirect that wasn't mapped. An analytics snippet that got dropped. Each one seems minor in isolation, but stack three or four together and you've got a launch that damages SEO rankings, breaks lead generation, and erodes stakeholder trust.

We've managed over 50 Webflow migrations ranging from 20-page marketing sites to 1,300-page content platforms. This checklist distills every lesson learned into a single, actionable document. Print it, share it with your team, and check off every item before you flip the DNS switch.

A typical Webflow-to-Next.js migration takes 2-6 weeks depending on site complexity. Sites with heavy CMS usage, custom interactions, and third-party integrations land at the longer end. Simple marketing sites with static pages can be done in under two weeks. Either way, this checklist applies — the difference is how many items are relevant to your specific migration.

Phase 1: Pre-Migration Audit

Before writing a single line of code, you need a complete inventory of what you're working with. Webflow sites accumulate complexity over time — collections you forgot about, interactions that only fire on specific pages, third-party scripts injected in project settings. This audit surfaces all of it.

Content Inventory

• Total page count: Export your sitemap from Webflow (Project Settings > SEO > Sitemap) and count every URL. Compare this to what you see in the Webflow Designer — orphaned pages and utility pages sometimes hide in the page list.
• CMS collections: Document every CMS collection, its fields, field types, and item count. A typical business site has 3-8 collections (blog posts, team members, case studies, testimonials, FAQ, job listings). Export each collection to CSV as a backup.
• Static pages: List every non-CMS page. Include utility pages like 404, search results, password-protected pages, and any pages used as symbols or templates.
• Dynamic page templates: For each CMS collection, document the template page layout. Note which fields are used where, any conditional visibility rules, and collection list filters.
• Content embedded in design: Webflow sites often have significant content baked into the visual design — text inside hero sections, stats blocks, feature grids. This content needs to be extracted and managed separately in the new CMS.

Forms and Lead Generation

• Native Webflow forms: List every form, its fields, and where submissions go (Webflow inbox, Zapier, webhook). Document any conditional fields or multi-step forms.
• Third-party form tools: Check for Typeform, JotForm, HubSpot forms, or Calendly embeds. Note the embed method (iframe, script tag, or native integration).
• Form submission destinations: Map where each form sends data. Common destinations include email, CRM (HubSpot, Salesforce), Slack, Google Sheets, or custom webhooks via Zapier/Make.
• Conversion tracking: Document which forms trigger conversion events in Google Analytics, Meta Pixel, LinkedIn Insight, or other tracking pixels.

Integrations and Custom Code

• Project-level custom code: Check Project Settings > Custom Code for head and body scripts. Common finds: Google Analytics, Google Tag Manager, Meta Pixel, Hotjar, Intercom, Drift, and custom CSS overrides.
• Page-level custom code: Some pages have their own custom code blocks. Check every page's settings panel — this is the most commonly missed item in Webflow migrations.
• Webflow integrations: Document active integrations in Project Settings > Integrations: Google Analytics, Facebook Pixel, Google Optimize, Mailchimp, and any connected apps.
• Third-party scripts: Identify scripts loaded via embed blocks within pages: chat widgets, review platforms (Trustpilot, G2), video players (Wistia, Vidyard), and booking tools.
• API connections: If your Webflow site uses the Webflow API (for headless CMS or external data), document every API consumer and its purpose.

Analytics Baseline

• Current traffic data: Export 90 days of Google Analytics data — pageviews, sessions, bounce rate, and conversion rates by page. This is your benchmark for post-migration comparison.
• Google Search Console data: Export all queries, pages, clicks, impressions, and positions. You need this to verify that search visibility is maintained after migration.
• Core Web Vitals: Run Lighthouse or PageSpeed Insights on your top 10 pages. Record LCP, FID/INP, and CLS scores. These are your performance targets to beat.
• Top landing pages: Identify the 20 pages that drive the most organic traffic. These need the most careful migration and should be your first QA targets.

Phase 2: Technical Preparation

With a complete inventory in hand, you can plan the technical migration. These decisions are hard to change later, so get them right upfront.

Domain and DNS

• DNS provider access: Confirm you have login credentials and admin access to your domain registrar (Namecheap, Cloudflare, GoDaddy, Google Domains). If the domain is managed through Webflow, you'll need to transfer DNS management.
• Current DNS records: Export all DNS records before making changes. Pay special attention to MX records (email), TXT records (SPF, DKIM, domain verification), and any CNAME records pointing to third-party services.
• SSL certificate: Your new hosting platform (Vercel, Netlify, Cloudflare) will provision SSL automatically, but verify the process. If you use a custom SSL cert, plan the transfer.
• TTL reduction: 48 hours before migration, reduce DNS TTL to 300 seconds (5 minutes). This ensures the DNS switch propagates quickly on launch day.

URL Structure and Redirects

• URL mapping spreadsheet: Create a complete mapping of every old URL to its new URL. Include query parameters and hash fragments if used. For a 100-page site, this spreadsheet typically has 120-150 rows (pages + images + documents).
• URL structure decision: Decide whether to keep Webflow's URL structure or restructure. Webflow defaults to /collection-name/item-slug for CMS pages. You might prefer /blog/slug or /resources/slug in the new site.
• Trailing slash policy: Webflow uses trailing slashes. Decide if your new site will too — then ensure consistency. Mixed trailing slash behavior causes duplicate content issues.
• 301 redirect implementation: Plan how redirects will be implemented. Next.js supports redirects in next.config.js (for simple mappings) and middleware (for complex pattern matching). For 500+ redirects, use a database-driven approach.

Hosting Selection

• Platform choice: Vercel (best Next.js integration, generous free tier), Netlify (good alternative), Cloudflare Pages (best for global performance), or self-hosted (Docker on any VPS). Each has trade-offs for cost, performance, and deployment experience.
• Environment setup: Create staging and production environments. You'll deploy to staging throughout development and only cut over to production on launch day.
• CI/CD pipeline: Connect your Git repository to auto-deploy on push. Vercel and Netlify do this out of the box. For self-hosted, set up GitHub Actions or similar.

Phase 3: Design and Development

This is the build phase. How long it takes depends on whether you're doing a faithful recreation or a redesign. A faithful migration of a 50-page Webflow site typically takes 1-2 weeks of development time. A redesign adds another 1-3 weeks.

Component Inventory

• Webflow components and symbols: List every reusable symbol in your Webflow project. Each one maps to a React component in your new codebase. Document props (content that changes per instance) vs. static content.
• Responsive breakpoints: Webflow uses 5 breakpoints: 1920px, 1440px, 992px, 768px, 480px. Document which components change layout at which breakpoints. Your CSS (Tailwind, CSS modules, etc.) needs to match.
• Interactions and animations: Catalog every Webflow interaction — scroll animations, hover effects, page load animations, click triggers. Decide which to recreate (CSS transitions, Framer Motion) and which to simplify or drop.
• Custom fonts: Document all fonts used, their weights, and whether they're Google Fonts, Adobe Fonts, or custom uploads. Next.js's next/font optimizes font loading and eliminates layout shift — but you need to know exactly which fonts to load.
• Color and spacing system: Extract Webflow's global swatches and spacing values. Map these to CSS variables or Tailwind config values for consistency.

Third-Party Script Migration

• Analytics: Implement Google Analytics 4 and/or Google Tag Manager. Use next/script with strategy="afterInteractive" for non-critical scripts to avoid blocking page load.
• Marketing pixels: Migrate Meta Pixel, LinkedIn Insight Tag, Twitter Pixel, and any other tracking scripts. Verify conversion events fire correctly on form submissions and key interactions.
• Chat and support: Intercom, Drift, Crisp, or Zendesk widgets need to be reinstalled. Most provide React components or script tags.
• Embedded content: Migrate any embedded videos (YouTube, Vimeo, Wistia), maps (Google Maps), calendars (Calendly), or other iframes.

Phase 4: Content Migration

Content migration is where most time is spent — and where most mistakes happen. Webflow's CMS is structured, which actually makes extraction easier than platforms like WordPress, but you still need to handle rich text, images, and relationships carefully.

CMS Content Export

• CSV export per collection: Export every CMS collection from the Webflow Editor. Verify field completeness — Webflow CSV exports sometimes truncate long rich text fields.
• Webflow API extraction: For sites with 100+ CMS items, use the Webflow CMS API for a cleaner extraction. The API returns structured JSON with proper rich text formatting and image references.
• Rich text content: Webflow rich text fields contain HTML. You'll need to parse this and convert to your new CMS format (Lexical, ProseMirror, Markdown, or blocks). Pay attention to embedded images, videos, and custom embeds within rich text.
• Reference fields: If CMS collections reference each other (e.g., blog posts reference an author collection), map these relationships in your new CMS. Export reference IDs and create a lookup table.

Media Files

• Image download: Download all images from Webflow's CDN (uploads.webflow.com). Use the sitemap or CMS export to build a complete URL list. Webflow serves images from their CDN, so you need to download and re-host them.
• Image optimization: Re-optimize all images for modern formats. Convert to WebP/AVIF, set appropriate quality levels (80% for photos, higher for graphics), and generate responsive sizes. next/image handles this automatically at request time, but pre-optimization reduces cold-start delays.
• File assets: Don't forget PDFs, downloadable documents, and other non-image files hosted on Webflow. These need to be migrated to your new hosting.

SEO Metadata

• Title tags: Export and preserve every page's custom title tag. Webflow stores these in page settings — don't rely on the page name, which might differ from the SEO title.
• Meta descriptions: Export all meta descriptions. Pages without custom descriptions often rely on Webflow's auto-generated ones — decide whether to keep these or write better ones during migration.
• Canonical URLs: Check for custom canonical URLs in Webflow page settings. These need to be preserved or updated to reflect the new domain/URL structure.
• Open Graph data: Export OG titles, descriptions, and images for every page. Social sharing previews will break if this data isn't migrated.
• Structured data: If your Webflow site has custom structured data (JSON-LD) in page code, extract and recreate it in the new site. Common types: Organization, Article, FAQ, LocalBusiness, BreadcrumbList.
• Alt text: Export alt text for every image. Webflow stores alt text per image instance (not globally), so the same image might have different alt text on different pages.

Phase 5: Testing

Testing is not optional, and 'it looks fine on my laptop' is not testing. You need systematic verification across browsers, devices, and functionality. Budget at least 2-3 days for testing on a typical migration.

Functional Testing

• Form submissions: Submit every form on the site. Verify data reaches its destination (email, CRM, database). Test validation — empty required fields, invalid emails, long inputs.
• Redirect verification: Test every redirect in your mapping spreadsheet. Use a tool like httpstatus.io or a custom script to batch-check. Every old URL should return a 301 to the correct new URL.
• Internal link audit: Crawl the new site with Screaming Frog or a similar tool. Look for broken links, links still pointing to the old Webflow domain, and incorrect relative paths.
• CMS content rendering: Spot-check 10-20% of migrated CMS items. Verify rich text renders correctly, images display, and metadata is present. Pay extra attention to items with special characters, long content, or embedded media.

Cross-Browser and Device Testing

• Desktop browsers: Test on Chrome, Firefox, Safari, and Edge. Webflow's generated CSS sometimes relies on webkit-specific properties that need adjustment.
• Mobile testing: Test on real iOS and Android devices (not just browser DevTools). Check touch targets, scrolling behavior, and viewport-specific layouts.
• Tablet testing: Webflow has a specific tablet breakpoint (768px). Verify your responsive implementation matches the original design at this breakpoint.

Performance Benchmarks

• Lighthouse audit: Run Lighthouse on the same 10 pages you benchmarked in Phase 1. Compare scores. Your new site should match or exceed the original on every metric — if it doesn't, investigate before launching.
• Core Web Vitals: Verify LCP under 2.5 seconds, INP under 200ms, and CLS under 0.1 on all key pages. These directly impact search rankings.
• Page weight comparison: Compare total transfer size (HTML + CSS + JS + images) between old and new sites. A well-built Next.js site should be 30-60% lighter than the Webflow original.

SEO Verification

• Sitemap generation: Verify your new site generates a complete sitemap.xml. Compare URL count with the old Webflow sitemap — the numbers should match (excluding intentionally removed pages).
• Robots.txt: Verify robots.txt allows crawling of all intended pages and blocks staging environments.
• Meta tag audit: Spot-check 20 pages for correct title tags, meta descriptions, canonical URLs, and OG data. Use a tool like SEO Meta Inspector browser extension.
• Structured data validation: Test structured data with Google's Rich Results Test. Verify no errors or warnings on key page types.

Phase 6: Launch Day

Launch day should be boring. If you've done phases 1-5 thoroughly, this is just flipping switches and monitoring. Schedule launches for Tuesday or Wednesday morning — never on a Friday, and never before a holiday. You want the full work week ahead to catch issues.

DNS Cutover Sequence

1. Final staging review: Do one last pass through staging. Verify the build is identical to what you tested.
1. Deploy to production: Push the production build. Wait for deployment to complete and verify it's serving correctly on the platform domain (e.g., your-site.vercel.app).
1. Update DNS records: Point your domain's A record or CNAME to your new hosting platform. If using Cloudflare, this propagates almost instantly. Other registrars may take up to 5 minutes (since you reduced TTL earlier).
1. SSL verification: Confirm HTTPS works correctly. Check for mixed content warnings (HTTP resources loaded on an HTTPS page).
1. Redirect activation: Verify all 301 redirects are live. Test the 10 most critical ones manually.

Immediate Post-Launch Checks

• Google Search Console: Submit your new sitemap. Use the URL Inspection tool on your top 10 pages to request re-indexing.
• Analytics verification: Confirm real-time data is flowing in Google Analytics. Check that pageview counts are reasonable and conversion tracking fires on form submissions.
• Form testing: Submit a test entry on every form from a real device (not your development machine). Verify delivery to all destinations.
• Monitor error logs: Watch your hosting platform's logs for 404s, 500s, and other errors. The first hour after launch reveals most issues.

Phase 7: Post-Launch Monitoring (Days 1-30)

The migration isn't done when the site goes live. The next 30 days are critical for catching issues that only surface with real traffic and search engine crawling.

Week 1: Daily Monitoring

• 404 monitoring: Check your hosting platform and Google Search Console for 404 errors daily. Each one represents a missed redirect or broken link. Fix immediately — every 404 is a lost visitor and a negative signal to Google.
• Search Console coverage: Monitor the Coverage report for increases in "Excluded" or "Error" pages. New crawl errors typically appear 2-5 days after launch.
• Organic traffic comparison: Compare daily organic sessions to your pre-migration baseline. A 10-15% dip in the first week is normal as Google re-crawls. A 30%+ drop indicates a redirect or indexing problem.
• Core Web Vitals field data: Once enough real-user data accumulates (usually 3-7 days), check CrUX data in Search Console for any regressions.

Weeks 2-4: Weekly Reviews

• Indexed page count: Compare the number of indexed pages in Search Console to your pre-migration count. They should converge within 2-3 weeks.
• Ranking recovery: Track your top 20 keywords in Search Console. Rankings may fluctuate for 2-4 weeks after migration. If a key page drops more than 10 positions, investigate.
• Conversion rate monitoring: Compare form submission rates and conversion rates to pre-migration baselines. A significant drop (>20%) suggests a UX issue or broken tracking.
• Performance monitoring: Run Lighthouse monthly and compare to your baseline. Watch for regression — new content, features, or third-party scripts can degrade performance over time.

Backup Plan

• Keep Webflow project active: Do not delete or downgrade your Webflow project for at least 30 days after launch. If something goes catastrophically wrong, you can revert DNS and be back online in minutes.
• Webflow export backup: Export your Webflow site code (Site Settings > Backups) before migration. This gives you a static HTML backup independent of your Webflow subscription.
• Database backup: If you migrated CMS content to a database, keep a backup of the initial import. You may need to re-import specific items if issues are found.