Webflow — нормальний інструмент. Ми відвантажували маркетингові сайти на ньому. Ми рекомендували його клієнтам, чий проєкт не потребував іншого. Він швидший у налаштуванні за кастомний білд, візуальний редактор справжній, хостинг — один клік.
Це також інструмент, який можна перерости. Коли переростаєш, міграція — це реальна робота, і час її важливіший за саму міграцію.
Цей пост про обоє: про сигнали, що настав час, і про прохід міграції, яку ми нещодавно зробили.
Коли Webflow — правильна відповідь
Перед тим, як говорити про відхід, варто бути чесними щодо лишання. Webflow — правильна відповідь, коли:
- Сайт — переважно маркетингові сторінки (10–25 сторінок), оновлюються час від часу дизайнером чи маркетологом.
- Не потрібне складне моделювання контенту. Сторінки мають передбачувану структуру.
- Редакторам комфортно у візуальному редакторі і некомфортно у CMS типу Sanity або Contentful.
- Продуктивність на рівні сторінки — нормальна, не виняткова, і це прийнятно.
- Ви не будуєте нічого схожого на веб-застосунок поруч із маркетинговим сайтом.
Якщо все це правда, кастомний білд — це передоз. Webflow відвантажить за коротший час, коштуватиме менше у підтримці, і редактори лишаться продуктивними.
П'ять сигналів, що ви його переросли
Webflow починає боліти, коли правда одне з цього:
1. CMS — це пляшкова шийка.
CMS Webflow працює для простого контенту (блог-пости, кейси, члени команди). Бореться, коли моделі контенту стають вкладеними або реляційними. Якщо ваші редактори вставляють структуровані дані у rich-text поля, бо схема цього не підтримує, ви переросли CMS, не візуальний редактор.
2. Сайту потрібен справжній застосунок поруч.
Логін клієнтів? Дашборди? Серверна логіка? Webflow цього не вміє. Можна латати third-party інструментами і add-on-ами на кшталт Memberstack, але кожна латка — це річ, яку треба підтримувати. Маркетинговий сайт, що виростає в продукт, потребує рантайму, не «статичний експорт плюс add-on-и».
3. Продуктивність плато, і ви вперлись у стелю ваги сторінки.
Webflow надсилає кожну анімаційну бібліотеку, кожен скрипт інтеракцій, кожну залежність на кожній сторінці. Дещо можна підкрутити вручну. Не можна отримати тип продуктивності, який дає кастомний білд з code splitting на рівні маршруту. Якщо ваш Lighthouse застряг на 70 і ви оптимізували все, що могли — платформа і є підлогою.
4. SEO-контролю недостатньо.
Для більшості маркетингових сайтів SEO-контролів Webflow вистачає. Коли не вистачає (кастомний JSON-LD під тип сторінки, динамічні правила сайтмапа, hreflang для десяти локалей, валідація структурованих даних на білд-тайм), ви переростаєте інструмент. Escape hatch-и, які пропонує Webflow (блоки Embed для кастомного коду), реальні, але крихкі. Зрештою ви підтримуєте паралельну кастомну систему всередині Webflow — це гірше з обох світів.
5. Команда тепер технічна, і ціна Webflow за редактора жалить.
Ціна Webflow масштабується за seat редактора. Коли ваша команда — переважно інженери, які воліли б редагувати контент у коді або у Studio поруч із кодовою базою, ціна за seat перестає мати сенс. Економія на хостингу часто окуповує міграцію за рік.
На що мігрувати
Для більшості сайтів, які йдуть з Webflow, стек, який ми рекомендуємо:
- Next.js (App Router) як фреймворк. Серверні компоненти для маркетингових сторінок, клієнтські — для тих частин, які потребують інтерактивності.
- Sanity як headless CMS. Краще моделювання контенту за Webflow CMS на порядок, з вбудованою Studio, яка редакторам реально подобається.
- Tailwind для стилів, Framer Motion для анімацій.
- Vercel для хостингу. Або Cloudflare Pages, або ваша інфраструктура.
Це не єдиний стек. Astro — хороший для контент-важких маркетингових сайтів. Remix — нормально. Звичайні генератори статичних сайтів (Hugo, Eleventy) — чудові, якщо редактори щасливі в markdown. Але Next.js + Sanity — це дефолт, до якого ми тягнемось, бо масштабується від «маркетингового сайту» до «маркетингового сайту плюс кастомерський дашборд» без переплатформування вдруге.
Міграція, що йшла три тижні
Кілька місяців тому ми мігрували 22-сторінковий маркетинговий сайт з Webflow. Клієнт — B2B SaaS-компанія; їхня команда виросла з двох до п'ятнадцяти, і маркетинговий сайт тепер блокував продуктовий roadmap (вони хотіли додати авторизований кастомерський дашборд, який Webflow не міг хостити).
Тиждень один: аудит і екстракція контенту.
Ми почали з експорту Webflow. HTML/CSS-експорт справжній, але брудний. Ми не намагались зберегти розмітку. Ми зберегли контент.
CMS-контент (блог-пости, кейси, команду) ми експортували через API Webflow у JSON, потім трансформували у Sanity-сумісні документи. Близько 80 документів. Зайняло пів дня Node-скриптом. Ми чекнули результуючі Sanity-документи у Studio, і команда їх валідувала.
Статичні сторінки (головна, послуги, про, контакт тощо) ми трактували як перепис контенту. Старі версії Webflow накопичили рішення з копірайту трьох різних авторів за чотири роки. Ми скористались шансом почистити повідомлення під час міграції, а не після.
Тиждень два: перебудовуємо маркетингову поверхню.
Команда задизайнила нові сторінки у Figma. Ми побудували їх у Next.js. Два інженери, паралельна робота. До кінця тижня ми мали головну, чотири сервісні сторінки, про, контакт і індекс блогу на staging URL.
Темп був свідомо швидшим за проєкт з нуля, бо ми не передвідкривали IA. IA вже була вирішена. Ми перевпроваджували її на кращому фундаменті.
Тиждень три: SEO-міграція і cutover.
Це та частина, де більшість міграцій помиляється. Старий сайт мав чотири роки накопичених беклінків, що вказували на конкретні URL. Якщо будь-який з тих URL змінювався без редиректу, SEO-ранкінг впав би.
Ми змапили кожен старий URL на новий еквівалент. Близько 30 з них змінили структуру («/blog/2022/post-slug» стало «/blog/post-slug», бо дата у шляху більше не мала сенсу). Для кожного ми написали правило 301-редиректу.
Потім налаштували:
- Динамічний sitemap (регенерується при зміні контенту через вебхук Sanity)
- JSON-LD під тип сторінки (Organization, Service, BlogPosting, FAQPage)
- Метадані на сторінку через утиліту
createPageMetadata(), з канонічними URL і мовними альтернативами - Tag-based revalidation у Next.js, тож редагування контенту у Sanity йшли у прод за секунди, без ребілду
Cutover у середу зранку. Старий сайт ліг у 9:00, новий піднявся у 9:00:30. Ми моніторили ранкінг наступні два тижні. Три URL втратили пару позицій у першому тижні і відновились до кінця другого. Більше нічого не зрушило. Міграція успішна.
Що змінюється
- Редакторсько: редактори користуються Sanity Studio замість редактора Webflow. Після 30-хвилинного walkthrough команда віддала перевагу. Моделювання контенту Sanity означає, що структуровані дані йдуть у структуровані поля, не вставляються у rich-text.
- Інженерно: сайт у git-репозиторії, деплоїться через Vercel з
main. Pull request-и для змін контенту — варіант (якщо хочете). Більшість правок лишаються у Sanity. - Продуктивність: Lighthouse Performance виросла з 68 до 96. Вага сторінки приблизно вдвічі менша. Зображення-герой — єдина річ, що вантажиться над фолдом; решта — code split і lazy load.
- Ціна: хостинг впав з ціни Webflow за seat на usage-pricing Vercel. Для 22-сторінкового сайту з помірним трафіком — це економія у нижніх чотирьох цифрах щорічно.
Що не змінюється
- Сайт усе ще виглядає так само для відвідувачів. Ми перебудували дизайн піксель у піксель там, де він був хорошим, і покращили там, де ні. Бренд не зрушив.
- SEO-ранкінг. З уважним мапуванням URL і редиректами міграція була невидима для Google.
- Якість контенту. Ми переписали частину копірайту під час міграції, але це був вибір, не вимушений наслідок зміни платформи.
Коли лишитись на Webflow
Міграції не безкоштовні. Якщо ваша ситуація:
- Сайт — переважно маркетингові сторінки і невеликий CMS
- Редактори нетехнічні
- Продуктивність прийнятна
- У вас немає продукту, що виростає поруч
Тоді Webflow усе ще — правильна відповідь. Біль міграції окуповується тільки коли у вас є причина піти.
Якщо хоч один із п'яти сигналів вище — правда для вашого сайту, вікно міграції — зараз, не пізніше. З кожним роком очікування мапа редиректів стає довшою, а контент — застарілішим. Міграція — це проєкт. Ціна її невиконання — повільний податок на кожне майбутнє продуктове рішення.
Якщо дивитесь на сигнали і хочете другу думку, почніть розмову. Чесно скажемо, мігрувати чи лишитись, і якщо відповідь — мігрувати, квотнемо реально.