Перенос сайта с Webflow на Astro: как сменить платформу и не потерять контент, дизайн и позиции

Коротко

Уйти с Webflow проще, чем с Framer, у которого экспорта в HTML нет вовсе, — но только отчасти. На платных тарифах Workspace можно экспортировать HTML, CSS, JavaScript и изображения сайта и разместить их на любом хостинге. При этом справочный центр Webflow так же прямо говорит о том, что остаётся за бортом: контент CMS, обработка форм, поиск по сайту, защита паролем, локализованные страницы и code components в экспорт не попадают, а списки коллекций (Collection lists) показывают пустое состояние (Справка Webflow).

Поэтому перенос сайта с Webflow на Astro — это отчасти экспорт, отчасти пересборка. Вы экспортируете то, что отдаёт Webflow, выгружаете CMS в CSV или через API, пересобираете каждый шаблон в виде компонентов Astro, заменяете формы и поиск, воссоздаёте взаимодействия, которые хотите сохранить, и настраиваете постоянный редирект для каждого URL, который меняется. Если делать всё в этом порядке, новый сайт сохранит дизайн, контент и позиции в поиске.

Почему команды переходят с Webflow на Astro

Webflow — сильный визуальный конструктор, и многим маркетинговым командам стоит на нём остаться. Причины уйти обычно связаны с владением и стоимостью, а не с дизайном:

• Сайт переходит в руки разработчиков. Когда большую часть изменений вносят разработчики, с кодом в собственном репозитории работать быстрее, чем с визуальным холстом, и этот код может жить рядом с вашим продуктом, бэкендом и тестами.
• Стоимость тарифа за каждый сайт. На странице тарифов Webflow, проверенной 13 октября 2026 года, тариф сайта Basic стоит 15 USD в месяц, а Premium — тариф с Webflow CMS — 25 USD в месяц, оба при оплате за год. Локализация — платное дополнение от 9 USD в месяц.
• Функции, которым нужен настоящий бэкенд: формы, которые записывают данные в вашу CRM, закрытый контент, поиск сразу по нескольким сайтам или всё, что должно работать на вашей собственной инфраструктуре.
• Сам по себе экспорт не освобождает от Webflow. Для экспорта кода нужен платный тариф Workspace, а не только тариф сайта, и CMS в экспорт не входит. Чистый переезд в любом случае требует планирования.

Если ваша маркетинговая команда каждую неделю визуально публикует страницы, а сайт справляется со своей задачей, остаться на Webflow — разумный выбор. Миграция должна дать что-то конкретное.

Что входит в экспорт кода Webflow, а что нет

Источник: справочная статья Webflow об экспорте кода сайта.

Что мы увидели, изучив опубликованные сайты на Webflow

13 октября 2026 года мы скачали главные страницы семи сайтов, сделанных на Webflow, включая сам webflow.com, и посмотрели, что пришлось бы переносить при миграции:

• Все семь загружают jQuery и изображения с серверов Webflow. Изображения отдаются с cdn.prod.website-files.com, а справочный центр Webflow сам предупреждает: поля изображений и файлов, экспортированные в CSV, — это ссылки на хостинг исходного проекта, и они перестанут работать, если этот проект удалить (Справка Webflow). Каждый ресурс придётся скачать и разместить заново.
• Все семь отдают с Webflow и изображение для превью в соцсетях. Про изображение Open Graph легко забыть, а превью ссылок в LinkedIn или WhatsApp останутся без картинки, как только старый проект закроют.
• Все семь выводят списки CMS прямо в опубликованном HTML, от 3 до 19 списков коллекций на главной странице. Это хорошая новость: в отличие от сайта на Framer, который, как показывает наше руководство по переносу с Framer на Astro, достраивается рантаймом уже после загрузки, опубликованная страница Webflow — полноценный эталон того, какой контент где находится, хотя экспорт кода и оставляет эти списки пустыми.
• Пять из семи используют Webflow Interactions: их выдают атрибуты data-w-id, которыми на одной главной странице помечено до 109 элементов. Каждое взаимодействие — это небольшой фрагмент поведения, который нужно воссоздать, или решение от него отказаться.

Перенос с Webflow на Astro: пошагово

1. Составьте список всех URL. Webflow автоматически генерирует /sitemap.xml, если эта опция включена (Справка Webflow). Добавьте все страницы коллекций, выгрузите отчёт «Страницы» из Google Search Console за максимально доступный период и экспортируйте уже настроенные редиректы 301 в CSV в разделе Site settings, Publishing (Справка Webflow).
2. Экспортируйте контент. Экспортируйте каждую коллекцию CMS в CSV из панели CMS — по одному разу на каждый язык, если используете Localize, — и сохраните столбец Item ID. CSV упрощает структуру: поля-ссылки (reference) выгружаются обычным текстом, множественные ссылки (multi-reference) — текстом через запятую, а форматированный текст (rich text) — в виде HTML. Для всего, где есть связи, Webflow Data API отдаёт элементы вместе с полями и языковыми версиями, и обычно это чище, чем склеивать CSV-файлы обратно.
3. Скачайте все ресурсы. Изображения, PDF, шрифты, лицензия которых позволяет размещать их на своём хостинге, изображения Open Graph и favicon. Не закрывайте проект Webflow, пока новый сайт не перестанет ссылаться на website-files.com.
4. Экспортируйте код как эталон. Если у вас платный тариф Workspace, экспортируйте HTML и CSS. Не публикуйте этот код как новый сайт: в нём останутся webflow.js, jQuery и пустые списки CMS. Используйте его, чтобы сверять точные отступы, брейкпоинты и структуру классов.
5. Смоделируйте контент в Astro. Превратите каждую коллекцию в коллекцию контента Astro или в модель headless CMS, сохранив связи между записями, затем пересоберите каждый шаблон в виде компонентов Astro и перенесите изображения в astro:assets.
6. Воссоздайте взаимодействия, которые несут смысл. Большинство Webflow Interactions превращаются в CSS-переходы, ключевые кадры (keyframes) или несколько строк JavaScript. Для более сложной анимации подойдёт GSAP: он бесплатен для коммерческого использования с апреля 2025 года, когда его таким сделал Webflow (Webflow). В любом случае учитывайте prefers-reduced-motion.
7. Замените формы, поиск и защищённые страницы. Дайте каждой форме настоящий обработчик (Cloudflare Worker, сервис форм или вашу CRM), добавьте статический поисковый индекс, например Pagefind, если сайту нужен поиск, и перенесите защиту паролем на уровень хостинга или приложения.
8. Правильно пересоберите локализованные страницы. В экспорт кода попадает только основной язык, поэтому соберите каждую языковую версию с i18n-маршрутизацией Astro: по одному URL на язык и hreflang между ними.
9. Сохраните формат URL. Webflow отдаёт страницы без завершающего слеша и перенаправляет /pricing/ на /pricing. Настройте trailingSlash и build.format в Astro так, чтобы новый сайт генерировал те же адреса (справочник по конфигурации Astro): каждое расхождение — это лишний редирект.
10. Делайте редиректы на сервере, затем запускайте сайт и наблюдайте. Статическая сборка Astro без адаптера превращает настроенные редиректы в страницы с meta refresh, поэтому настройте редиректы 301 один к одному там, где размещён сайт, например в файле _redirects на Cloudflare. Переключите DNS, сохраняйте проект Webflow, пока новый сайт не будет проверен, и следите за отчётами Search Console об индексировании в течение следующих нескольких недель. Наш SEO-чек-лист миграции сайта охватывает день запуска и 90 дней после него.

Что меняется после переезда

Как сохранить SEO

Здесь применимо руководство Google по переезду сайта со сменой URL: сопоставьте каждый старый URL с ближайшим новым аналогом, используйте постоянные серверные редиректы и сохраняйте их не менее года. Если URL остаются прежними, а при аккуратной пересборке с Webflow этого часто удаётся добиться, в основном нужно проверить, что title, description, canonical, структурированные данные и изображения Open Graph перенесены.

Ловушки, характерные именно для Webflow, — это остатки старого сайта: изображение Open Graph или PDF, которые всё ещё отдаются с website-files.com, тестовый адрес на webflow.io, который по-прежнему в индексе, или страница CMS, чей slug изменился при переезде. Проверьте все три пункта, прежде чем закрывать проект Webflow.

Как Dardo проводит миграцию с Webflow

Переезды с Webflow мы проводим в рамках услуги миграции сайта: инвентаризация URL и контента, экспорт CMS, сначала одна типовая страница, пересобранная и проверенная на согласованных значениях ширины, затем остальные шаблоны, формы и редиректы. Сама сборка — это веб-разработка на Astro, а анимация — креативная разработка. Этот сайт, dardo.studio, работает на Astro и Cloudflare Workers, его контент хранится в headless CMS, и этот блог мы пишем и публикуем через ту же CMS.

Если вы обдумываете переезд, пришлите нам сайт и расскажите, что хотите изменить. Ещё до того, как оценивать работу, мы скажем, стоит ли уходить с Webflow.