Webflowを卒業する:スケーリング企業の次のステップ
Webflowを超えて: スケーリングするビジネスの次のステップ
Webflowを使用している成長中のすべてのビジネスに訪れる瞬間があります。通常は何か小さいことから始まります。おそらく10,000を超えるCMSアイテムが必要になったり、マーケティングチームがサーバーサイドのパーソナライゼーションを望んだり、開発者が今四半期3回目のカスタムコード10,000文字制限に対抗していたりします。サードパーティツールでそれをパッチします。そしてもう一つ。そしてもう一つ。ある日、スタックを見て、ウェブサイトビルダーの周りにルーブゴールドバーグ機械を構築したことに気付きます。そのビルダーは、あなたが求めていることのために設計されたことがありません。
私は何十ものチームをこの正確な移行を通じて手助けしてきました。Webflowから成長したクライアントを持つエージェンシーもありました。その他は、初期段階でWebflowで立ち上げたシリーズB スタートアップの社内チームでしたが、現在は実際にスケールできるものが必要でした。会話は常に同じ方法で始まります：「Webflowの見た目は好きですが、常に壁に当たります。」
あなたが今その場所にいるなら、この記事はあなたのためです。Webflowが故障する場所、2025年のリアルな代替手段がどのように見えるか、そしてあなたのSEOまたはあなたの正気をトーチで設定しない移行を計画する方法について具体的に説明します。
目次
- 移行を強制する実際のWebflow制限
- あなたのビジネスがWebflowから成長したことを示すサイン
- Webflow後の次のステップ：リアルなオプション
- ヘッドレスCMS + モダンフレームワーク：最も一般的なパス
- Post-Webflowチームのフレームワーク比較
- あなたのSEOを殺すことなく移行を計画する
- エージェンシーの視点：Webflowから移動する時期
- 実際のコスト内訳：Webflow vs カスタムスタック
- FAQ
移行を強制する実際のWebflow制限
何か明確にしましょう：Webflowは特定のユースケースに対して本当に素晴らしいです。マーケティングサイト、ランディングページ、ポートフォリオサイト、小～中規模のコンテンツサイト -- これらすべてを美しく処理します。ビジュアルビルダーはクラス最高です。デザイナーの学習曲線は、コードベースのあらゆる代替手段よりも大幅に低いです。私はここでWebflowを叩くためにいるのではありません。
しかし、ハードな上限があり、それらは理論的ではありません。それらは私がチームが繰り返し衝突するものです。
CMS アイテム制限
Webflowのビジネスプランでは、10,000 CMS項目の上限があり、アドオンで20,000に拡張可能です。エンタープライズプランはこれを50,000～100,000+に押し上げることができますが、交渉に応じて約$800～$1,000+/月から始まるカスタムエンタープライズ価格を見ています。
200ブログポストと50ケーススタディを持つB2B SaaSカンパニーの場合？問題ありません。ディレクトリサイト、マーケットプレイス、メディア出版、または数千のSKUを持つeコマースカタログの場合？この壁に素早く当たります。
サーバーサイドロジックなし
Webflowはホスティングを処理します -- 素晴らしいですが、サーバーで何かをする必要があるまでは素晴らしいです。基本的な301を超えたカスタムリダイレクトはありません（そして、その場合でもそれらは制限があります）。ミドルウェアなし。動的データを使用したサーバーサイドレンダリングなし。エッジ関数なし。APIルートなし。
ユーザーの場所に基づいて異なるコンテンツを表示したいですか？ページを表示する前にユーザーを認証したいですか？レイアウトシフトがないようにサーバーサイドA/Bテストを実行したいですか？あなたは外部サービスを取り付けるか、あなたは立ち往生しています。
カスタムコード文字制限
Webflowはページあたり10,000文字とサイト全体のhead/footerで10,000文字にカスタムコード埋め込みをキャップしています。Google Tag Manager、顧客サポートウィジェット、分析スクリプト、パーソナライゼーションツール、およびマーケティングオートメーションピクセルを埋め込むまで、それはたくさんのように聞こえます。突然、あなたはすべてを積極的に縮小し、どのツールがどのページに存在するかについてのトレードオフを行っています。
エンタープライズ対応ではないeコマース
Webflow E-commerceは長年にわたって改善されていますが、2025年現在でもチェックアウト時のマルチ通貨サポート、サブスクリプション請求、複雑な製品バリアント、複数の倉庫の在庫管理、および成長中のDTCブランドが必要とするほとんどのものがまだ不足しています。主要なeコマース更新の欠如により、多くのエージェンシーはShopify Hydrogen、Medusa、またはSaleorと組み合わせたWebflowまたはカスタムフロントエンドなどのヘッドレスコマースソリューションを検討するよう促しています。
ホスティングロックイン
WebflowからHTML、CSS、および画像をエクスポートできます。エクスポートできないもの：別のシステムにきれいにマップされる構造化された形式でのCMSコンテンツ、インタラクションおよびアニメーション、フォーム送信、ロジック属性、またはWebflowの所有機能に関連するもの。エクスポートは静的ファイル -- スナップショット、生きているサイトではなく -- を提供します。これにより移行はそれがされるべきであるより難しくなります。
スケールでの統合制限
Webflowはいくつかのツールでうまく機能します：Google Analytics、Mailchimp、Zapier、基本的なウェブフック。しかし、Salesforce、HubSpotの完全なスイート、Segment、Braze、またはほとんどのCDPとマーケティングオートメーションプラットフォームとのネイティブ統合はありません。あなたはZapierまたはカスタムスクリプトを通じて脆弱な接続を構築し、Webflowが何かを更新するときに壊れます。
あなたのビジネスがWebflowから成長したことを示すサイン
すべての不満が移行を意味するわけではありません。いくつかの問題はWebflowに留まり、ターゲット統合を追加することで解決するのが良いです。しかし、プラットフォーム自体がボトルネックになったことを示すクリアな信号があります：
- あなたは実際の開発より回避策にもっと時間を費やしています。 開発者がWebflowの制限と戦うために40%の時間を費やしている場合、機能を構築するのではなく、数学は機能しなくなります。
- あなたのサードパーティツールコストはあなたのWebflow購読を超えています。 Memberstack、Jetboost、Finsweet属性、Outseta、および3つのZapier接続を基本的な機能を取得するためだけに支払っている場合、あなたは制約されたプラットフォームのためのカスタム開発価格を支払っています。
- 認証されたユーザーエクスペリエンスが必要です。 ゲートされたコンテンツ、ユーザーダッシュボード、パーソナライズされたビュー、ロールベースのアクセス -- これらのすべてはWebflowで取り付けられたソリューションを必要とし、目的で構築されたイミメンテーションと比較してジャンキーに感じます。
- あなたのコンテンツチームはCMS制限によってブロックされています。 マルチリファレンスフィールド制限、20フィールドあたりのキャップ（増加しましたがまだ複雑なコンテンツモデルに対して制限）、およびCMS項目の上限はすべてコンテンツが多い操作の摩擦を作成します。
- パフォーマンス要件はサーバーサイドコントロールを要求します。 ISR（増分静的再生成）、動的コンテンツのサーバーサイドレンダリング、カスタムロジック付きのエッジキャッシング、またはバックエンド処理の任意の形式が必要な場合、Webflowはそれをすることはできません。
- 技術的制限により取引を失っています。 エージェンシーの場合、これは最も明確な信号です。見込み客がWebflowで提供できない機能を要求するたびに、そしてあなたが継続的にビジネスを他の場所に紹介しているたびに、あなたのスタックを拡張する時間です。
Webflow後の次のステップ：リアルなオプション
単一の「post-Webflow」答えはありません。正しいパスはあなたのチームの技術能力、あなたのコンテンツワークフロー、あなたの予算、および何が特に壊れているかによって異なります。
オプション1：マーケティング用にWebflowに留まり、アプリを別に構築する
正直に言うと？これは多くのチームにとって正しい答えです。あなたのマーケティングサイトがWebflowで素晴らしく機能しているが、アプリ機能が必要な場合、マーケティングサイトを移行しないでください。app.yourdomain.comをカスタムスタックで実行し、www.yourdomain.comをWebflowに保ちます。あなたのマーケティングチームはブロック解除されたままであり、あなたのエンジニアリングチームは彼らが必要とするツールを取得します。
オプション2：ヘッドレスCMS + モダンフレームワーク
これはWebflowから本当に成長したチームのための最も一般的な移行パスです。ヘッドレスCMS（Sanity、Contentful、Storyblok、Payload、Strapi）をコンテンツ管理の中から選んで、モダンフレームワーク（Next.js、Astro、Remix、Nuxt）とペアにします。Social Animalでこの多くの作業を行います -- あなたはあなたのheadless CMS開発とNext.js開発ページで私たちのアプローチを見ることができます。
オプション3：ヘッドレスコマーススタック
Webflowのストア機能から成長しているeコマースビジネスの場合、プレイは通常ShopifyのストアフロントAPI（またはMedusa/Saleorなどの代替）とカスタムフロントエンドです。チェックアウトと在庫管理をまとめたShopifyを取得しますが、フロントエンドの完全な設計の自由があります。
オプション4：完全なカスタムアプリケーション
時々あなたは「ウェブサイト」をもう構築していません -- あなたは製品を構築しています。SaaSダッシュボード、マーケットプレイス、プラットフォーム。これらの場合、フルスタックフレームワーク、リアルバックエンド、リアルデータベース、およびリアルデプロイメントパイプラインが必要です。これはウェブサイト移行ではありません；これは製品構築です。
ヘッドレスCMS + モダンフレームワーク：最も一般的なパス
これはWebflowチームが最終的に採用するルートなので、これが実際にどのように見えるかに掘り込みましょう。
ヘッドレスCMSを選ぶ
CMSの決定はほとんどのチームが実現するより重要です。なぜなら、それはあなたのコンテンツチームの日常の経験を決定するからです。ここに私が働いているのを見たものがあります：
| CMS | 最適用途 | 価格（2025） | CMS項目 | 学習曲線 |
|---|---|---|---|---|
| Sanity | 複雑なコンテンツモデル、リアルタイム協力 | フリーティア、その後$15/user/mo（成長） | すべてのプランで無制限 | 中 |
| Contentful | エンタープライズチーム、強いAPI生態系 | フリーティア、その後$300/mo（チーム） | プラン別（1M+エントリまで） | 低～中 |
| Storyblok | ビジュアル編集、コンポーネントベースのコンテンツ | フリーティア、その後€106/mo（ビジネス） | すべての有料プランで無制限 | 低 |
| Payload | 自社ホスト、完全コントロール、TypeScript-native | 無料（オープンソース）、クラウド$35/moから | 無制限（あなたのデータベース） | 中～高 |
| Strapi | 自社ホスト、柔軟、大規模コミュニティ | 無料（オープンソース）、クラウド$29/moから | 無制限（あなたのデータベース） | 中 |
Webflowからのチームの場合、ビジュアルエディタのため、Storyblokはしばしば最も親しみやすいように感じます。Sanityは複雑なプロジェクトのための個人的な好みです。なぜなら、GROQクエリ言語とリアルタイム協力機能は本当に優れているからです。Payloadは2025年でインフラを所有したいチーム向けの深刻なトラクションを得ています。
フロントエンドフレームワークを選ぶ
これはあなたの開発者の好みが重要な場所ですが、選択を影響する実際の技術的な違いがあります。
パフォーマンスが最優先である、コンテンツが多いサイト（ブログ、ドキュメント、マーケティングサイト）の場合、Astroは撃つのが難しいです。デフォルトでは0 JavaScript を搭送し、「islands architecture」と呼ばれる概念である対話的コンポーネントのみハイドレーションします。私たちはLighthouse スコアが70年代の中盤から一貫した95+Astro構築に跳ぶのを見てきました。
動的機能が必要なサイト -- ユーザー認証、リアルタイムデータ、複雑な相互作用-- Next.jsは最も戦闘テストされたオプションのままです。App Router（Next.js 13以降安定、2025年のNext.js 15までに成熟）は、Webflowが触れることができないユースケースを処理するサーバーコンポーネント、ストリーミング、ミドルウェアを提供します。
Next.jsより単純だが、Astroより動的なものを望むチームの場合、RemixまたはSvelteKitは評価する価値があります。しかし、実際には、ほとんどのチームはNext.jsまたはAstroに着地します。
Post-Webflowチームのフレームワーク比較
| 基準 | Next.js 15 | Astro 5 | Remix | Webflow（参照用） |
|---|---|---|---|---|
| 静的サイト生成 | ✅ 優秀 | ✅ クラス最高 | ⚠️ 制限 | ✅ ビルトイン |
| サーバーサイドレンダリング | ✅ フルサポート | ✅ アダプタ付き | ✅ フルサポート | ❌ なし |
| API ルート | ✅ ビルトイン | ✅ アダプタ付き | ✅ ローダー/アクション | ❌ なし |
| ビジュアル編集 | ⚠️ CMSプラグイン経由 | ⚠️ CMSプラグイン経由 | ⚠️ CMSプラグイン経由 | ✅ ネイティブ |
| ビルド時間（1000ページ） | ~45s（ISR利用可能） | ~30s | N/A（オンデマンド） | N/A（管理） |
| ホスティングコスト（標準） | $20-100/mo（Vercel） | $0-20/mo（Netlify/Cloudflare） | $20-50/mo | $39-212/mo |
| デザイナーの学習曲線 | 高 | 中 | 高 | 低 |
| CMS項目制限 | なし | なし | なし | 10,000-20,000 |
あなたのSEOを殺すことなく移行を計画する
これは私がチームが高価な間違いを犯すのを見る場所です。計画が不十分な移行は数ヶ月間有機トラフィックを沈める可能性があります。ここに私たちが従うプロセスがあります：
1. 何かに触れる前にすべてを監査する
Screaming Frogまたはsitebulbを使用して既存のWebflowサイトをクロールします。すべてのURL、そのステータスコード、正規タグ、メタデータ、および内部リンクをドキュメント化します。Webflow CMS コンテンツをAPI経由（ビジュアルエクスポートではなくREST API）でエクスポートします。Webflowダッシュボードで設定したすべてのリダイレクトをマップします。
2. URL構造を正確に一致させる
あなたのWebflowブログが/blog/post-slugにある場合、あなたの新しいサイトは/blog/post-slugを使うべきです。/posts/post-slugではありません。/blog/post-slug/ではありません。変更された各URLは301リダイレクトが必要であり、リダイレクトでさえ、あなたはいくつかのリンク衡平を失うでしょう。あなたが必要とするリダイレクトが少なければ少ないほど、それは良いです。
// next.config.js - リダイレクトマッピングの例
module.exports = {
async redirects() {
return [
// 変更する必要があるURLの場合のみ
{
source: '/old-webflow-path/:slug',
destination: '/new-path/:slug',
permanent: true,
},
];
},
};
3. コンテンツをプログラムで移行する
コンテンツを手動でコピーペーストしないでください。Webflow CMS APIを使用して構造化されたデータをエクスポートしてから、それを新しいCMSにインポートする移行スクリプトを記述します。ここに粗いパターンがあります：
// 例：Webflow CMSアイテムをSanityに移行する
import { createClient } from '@sanity/client';
const sanity = createClient({
projectId: 'your-project',
dataset: 'production',
token: process.env.SANITY_TOKEN,
apiVersion: '2025-01-01',
useCdn: false,
});
async function migrateWebflowToSanity(webflowItems: WebflowItem[]) {
for (const item of webflowItems) {
await sanity.create({
_type: 'blogPost',
title: item.name,
slug: { current: item.slug },
body: convertRichTextToPortableText(item['post-body']),
publishedAt: item['published-on'],
excerpt: item['post-summary'],
});
}
}
4. 初日から適切なテクニカルSEOを実装する
Webflowが自動的に処理し、カスタムスタックで手動で実装する必要があるもの：
- XMLサイトマップ（Next.jsの
next-sitemapまたはAstroの@astrojs/sitemapを使用） - 正規タグ
- Open GraphおよびTwitterカードメタタグ
- 構造化データ（JSON-LD）
- Robots.txt
- 画像最適化（Next.js Image コンポーネントまたはAstroの組み込み画像最適化）
5. 両方のサイトを並列で実行する
切り替える前に、ステージングURLに新しいサイトをデプロイし、比較クロール実行します。すべてのURLが正しいステータスコードを返すこと、メタデータが一致すること、パフォーマンスメトリックスが少なくともWebflowと同じくらい良いことを確認します。Google Search ConsoleのURL検査ツールを使用してレンダリングを確認します。
エージェンシーの視点：Webflowから移動する時期
あなたがエージェンシーの場合、クライアントをWebflowから移動する決定は負荷がかかっています。Webflowプロジェクトは予測可能なタイムライン、デザイナーが構築の多くを独立して処理できる、およびメンテナンスは直線的です。カスタムスタックに移動することは、より多くの開発時間、より複雑なデプロイメント、そして長期的にはあなたからより多くのものを必要とするクライアントを意味します。
その最後のポイントは実際に上側です。クライアントがWebflowから成長する場合、移行を導くことができるエージェンシー -- むしろ彼らをdev shop に紹介するのではなく -- 関係を深め、進行中の開発、最適化、およびサポートを通じて繰り返しの収益を開きます。
推奨のための私のフレームワークはここです：
Webflowに留まる場合：
- クライアントの不満は1～2つのサードパーティツールで解決できます
- サイトは月100,000未満のビジターを取得します
- コンテンツ量は5,000項目以下で、ゆっくり成長します
- 認証済みエクスペリエンスまたはカスタムバックエンドロジックが必要ありません
- クライアントはカスタム開発の予算を持っていません（よく実行された移行のために$30,000+）
移行する場合：
- サードパーティツールコストはWebflowの上で$200/月を超えます
- チームは回避策に大量の時間を費やしています
- ビジネス要件にはWebflowが根本的にサポートできない機能が含まれています
- パフォーマンスニーズはWebflowのホスティングが提供できるものを超えています
- クライアントには開発チーム（または1つのための予算）があり、カスタムスタックを維持します
あなたが設計上のこのパスをクライアントに提供したいエージェンシーですが、Next.jsまたはAstro構築のための社内開発チームを持たない場合、それは正確にはあなたがパートナーにした種類の作業です。capabilitiesまたはget in touchをチェックしてください -- 私たちは定期的にエージェンシーとして開発パートナーとして機能します。
実際のコスト内訳：Webflow vs カスタムスタック
本物の数字について話しましょう。これらは2024～2025年に配信したプロジェクトに基づいています。
| コストカテゴリ | Webflow（ビジネスプラン） | カスタムスタック（Next.js + Sanity） | カスタムスタック（Astro + Payload） |
|---|---|---|---|
| プラットフォーム/CMS | $49/mo（$588/yr） | $15/user/mo（Sanity成長） | $0-35/mo（Payload Cloud） |
| ホスティング | 含む | $20-100/mo（Vercel） | $0-20/mo（Cloudflare Pages） |
| 初期ビルド | $5,000-15,000 | $25,000-60,000 | $20,000-50,000 |
| サードパーティツール | $100-400/mo（標準） | ほぼビルトイン | ほぼビルトイン |
| 年間メンテナンス | $2,000-5,000 | $6,000-15,000 | $5,000-12,000 |
| 初年度合計 | $9,000-22,000 | $33,000-77,000 | $26,000-63,000 |
| 2年目以降合計 | $4,000-10,000/yr | $8,000-18,000/yr | $6,000-15,000/yr |
カスタムスタックは初年度は3～4倍高いです。砂糖を塗ってない。しかし、2年目までに、ギャップは大幅に狭まり、Webflowが文字通り提供できない機能を取得しています。これらの機能がビジネスに直接変わる機能 -- より良いコンバージョン率、より速いページロード、パーソナライズされたエクスペリエンス、複雑なeコマース -- ROI数学は出ます。
あなたの特定の状況に合わせた、より詳細な内訳については、あなたのpricing pageは典型的なプロジェクト範囲の感覚をあなたに与えます。
FAQ
成長するビジネスのためのWebflowの最大の制限は何ですか？
最も影響のある制限は、CMSアイテムキャップ（ビジネスプランで10,000～20,000項目）、サーバーサイドロジックまたはAPIルートなし、カスタムコード文字制限（埋め込みあたり10,000文字）、限定されたエクスポート機能を使用したホスティングロックイン、およびマルチ通貨、サブスクリプション、複雑な在庫管理が不足しているeコマース機能です。ほとんどのマーケティングサイトの場合、これらは問題ではありませんが、ビジネスがスケールするとき、彼らは取引ブレーカーになります。
Webflowサイトをエクスポートして他の場所でホストできますか？
静的HTML、CSS、および画像をエクスポートできますが、CMS コンテンツ構造、Webflow Interactions、フォーム機能、およびWebflowのプラットフォームに関連するロジックはすべて失われます。エクスポートは本質的にある時点でのあなたのサイトの凍ったスナップショットです。継続開発のための実行可能なパスではありません -- それは最後の手段のバックアップ以上です。
コンテンツが多いサイトのWebflowの最良の代替は何ですか？
コンテンツが多いサイトの場合、AstroまたはNext.jsとSanityまたはPayloadなどのヘッドレスCMSの組み合わせは、無制限のコンテンツアイテム、完全なコンテンツモデルのコントロール、および大幅に優れたパフォーマンスを提供します。Astroは特にここで強いです。最小限のJavaScriptを搭出し、数千の静的ページを素早く生成できるため。
Webflow to Next.js移行にはどのくらい時間がかかりますか？
50～100ページのサイトでCMSコンテンツを持つ標準的な移行は8～14週間かかります。これには、新しいCMSでのコンテンツモデリング、フロントエンド開発、コンテンツ移行スクリプティング、SEO監査と301 リダイレクトマッピング、QA、および段階的な展開が含まれます。より大きなサイト、または複雑なカスタム機能を持つものは16～20+週間かかることができます。
Webflowから移行するとSEOが傷つきますか？
不十分に行われた場合、それができます。鍵となるのは、URL構造を保つ（またはカスタムURLを変更するための包括的な301リダイレクトを設定する）、すべてのメタデータが正しく転送されることを確認する、内部リンク構造を保つ、および移行直後に更新されたサイトマップを送信することです。適切に行われると、ほとんどのサイトは2～4週間の有機トラフィックで10～15%の一時的な低下を見ますが、その後回復し、多くの場合、より優れたCore Web Vitalsスコアのために改善します。
Webflowはeコマースに十分ですか？
シンプルな製品（500 SKU未満、単一通貨、購読なし）を持つ小さなショップの場合、Webflow E-commerceは正常に機能します。それを超えて、あなたは専用のeコマースバックエンドが必要になります。最も一般的なアプローチはShopifyのStorefront API（またはMedusa/Saleorなどの代替）をNext.jsで構築されたカスタムフロントエンドとペアリングすることです -- あなたはShopifyの完全に機能するチェックアウトと在庫システムを取得しますが、完全な設計制御があります。
Webflow移行のコストはいくらですか？
複雑さに応じて初期ビルドに$20,000～$60,000の予算。進行中のメンテナンスは月$500～$1,500です。これはWebflowビルドよりもかなり多いですが、機能に上限のないカスタムプラットフォームを取得しています。投資はWebflowの制限があなたに直接収益を費やしているとき、またはサードパーティの回避策が月$200+SaaS コストを追加しているときに意味があります。
エージェンシーはNext.jsを学ぶべきか、開発チームとパートナーを組むべきか？
両方のパスは機能します。あなたのエージェンシーがすべてを社内で処理したい場合、Next.jsまたはAstro専門知識への投資は、本当の習熟を構築するために6～12ヶ月かかります。あなたがデザインと戦略に焦点を保つことを好む場合、headless開発エージェンシーとのパートナーシップにより、Webflowから成長したクライアントにカスタムソリューションを提供でき、開発チームを構築するオーバーヘッドなし。多くの成功したエージェンシーは、デザインとコンテンツ戦略を処理しながら、技術実装でパートナーシップを行うハイブリッドアプローチを使用しています。