AIでウェブサイトを移行・リデザインする方法(SEOを失わずに)

AIツールでウェブサイトを再構築するためのステップバイステップガイド。どのツールを使うべきか、新しいサイトの構築方法、SEOトラフィックを失わずにデプロイする方法を解説します。

AIでウェブサイトを移行・リデザインする方法(SEOを失わずに)
公開日: 2026年3月31日Ben Shumaker

はじめに

何百万もの企業が古いウェブサイトを抱えていますが、再構築のコストを正当化できずにいます。

主な課題は、ウェブサイトの移行にはほぼ必ず再構築が必要になることです。古いコンテンツを移すだけでも膨大な作業量です。そのため、多くの企業が何年もウェブサイトを更新せずに過ごしています。

AIツールのおかげで、コードを書くことはかつてないほど簡単になっています。また、既存のウェブサイトを読み取って再現することにも優れています。多くの企業にとって、わずか数分でAIを使ってサイトを再構築することが可能になりました。

このガイドでは、その方法を説明します。

ステップ1: リデザインを計画する

AIでウェブサイトをリデザインする前に、どのページとコンテンツを残すか計画する

数千ページのサイトでない限り、正式な計画は必要ありません。ただし、いくつかのことを明確にしておくと役立ちます。

なぜサイトを再構築するのか?

これは最初に問うべき質問です。よくある回答には以下があります。

  • スタイルが気に入らない
  • 自分で更新できない
  • 費用が高すぎる
  • 読み込みが遅い
  • スマートフォンで見た目が悪い
  • コンテンツが古い
  • プラットフォームの制約が大きい
  • そもそもそのプラットフォームが好きではない

目標を明確にすることは、何に取り組まなくて良いかがわかるという点で有益です。スタイル、画像、テキスト、ページ、予約システムなど、すべてをゼロからやり直すには膨大な時間がかかります。「壊れていないものは直さない」という考え方で多くの時間を節約できます。

どんな機能が必要か?

機能とは、オンライン注文、予約システム、寄付ポータルなどのことです。どのウェブサイトビルダーでもシンプルなページは作れますが、ShopifyのようなeCommerceの在庫管理システムを持つものはほとんどありません。

高度な機能については、その機能が組み込まれたウェブサイトビルダーを見つけるか、サードパーティのツールを接続できます。サードパーティのツールはリンクと埋め込みだけで済むため、基本的にどのウェブサイトビルダーでも追加できます。

サードパーティのツールはコストが高く見た目も標準的ですが、ほとんどのウェブサイトビルダーにはない高度な機能を提供するため、非常に人気があります。多くの小規模事業者は、マーケティング用のウェブサイトとビジネス運営用の追加サービスを組み合わせて使っています。

コンテンツはどう扱うか?

どのコンテンツを残し、再編成し、削除するかの大まかな計画を立てるべきです。残りはAIツールに任せられます。明示的に指示しないと、AIは手を抜いてすべてをインポートしないことがあります。

どのページが存在するかは、firecrawl.devにアクセスしてURLを入力し、mapを選択することで確認できます。これにより現在のウェブサイトのページ一覧が得られるので、それをAIに渡し、何を残し何を削除するかのメモを添えてください。

ステップ2: ツールを選ぶ

ウェブサイトリデザインのためのAIウェブサイトビルダーとコーディングエージェントの比較

AIを使って既存のウェブサイトを再現する方法はいくつかあります。

  1. エンドツーエンドのAIウェブサイトビルダーを使う(Repaint、Lovable、Replit、Bolt)
  2. AIコーディングエージェントを使う(Claude Code、Codex、Cursor)
  3. AIチャットボットでコードを作成する(ChatGPT、Claude)

エンドツーエンドのビルダーを使うか、すでにプログラミングができる場合はAIコーディングエージェントを使うことをお勧めします。

ChatGPTとClaudeは最も人気があり、アクセスしやすいAIアプリです。そしてコードを書く能力は十分にあります。問題は、ウェブサイトを実行するためのインフラを提供していないことです。ウェブサイトを作ってもらった後、コードをエクスポートして自分でクラウドホスティングサービスにホストする必要があります。そして更新したいときは、毎回コードを編集しなければなりません。

自分でコードを管理するのであれば、AIコーディングエージェントを使う方が理にかなっていると思います。完全なコードベースを直接作成するために作られているので、エクスポートの必要がありません。ただし、ホスティングを見つける必要はあります。

しかし、コードの実行、編集、管理を学ぶことを避けたい人にとっては、最もシンプルな選択肢はエンドツーエンドのAIウェブサイトビルダーです。

再構築で重要なこと

AIツールで確認すべき主なポイントは以下です。

  • 賢いAIチャットボットとやり取りしている(AIが後付けされた古いウェブサイトビルダーではない)
  • AIがウェブサイトからコンテンツを読み取れる
  • AIがウェブサイト上の他のページを見つけられる

上記に挙げたすべてのツールがこれを行えます。AIがあなたのウェブサイトを読み取れれば、そのコンテンツを新しいサイトに数分で書き直せます。

AIチャットボットがこれを行えるかテストするには、URLを渡して「このページには何が書いてありますか?」と聞いてみてください。ウェブサイトを読み取れるなら、そのページのコンテンツを復唱できるはずです。また、サイト上の他のページも教えてくれるはずです。

Repaintのおすすめポイント

エンドツーエンドのAIウェブサイトビルダーを使うなら、Repaintから始めるべきだと思います。

私のおすすめには偏りがあることをお伝えしておきます。私はRepaintの制作者の一人です。しかし、マーケティングウェブサイトの再構築において、これらの中でRepaintが最良のAIツールだと心から信じています。Lovable、Replit、Boltが高度なソフトウェアに焦点を当てているのに対し、Repaintはウェブサイト専用に設計されています。Repaintの優位点は以下です。

  • Repaintは複数のページを同時に構築できます。他のアプリがホームページを1つ作る時間で、10のブログページをインポートできます。
  • Repaintはウェブサイトの探索とスクレイピングがはるかに高速で、促さなくても実行します。
  • Repaintは古いサイトから画像を自動的にダウンロードします。
  • Repaintにはビジュアルインスピレーション用のスタイルライブラリが組み込まれています。
  • Repaintは構築前にインタビューを行うため、最初のドラフトがよりカスタマイズされたものになります。
  • RepaintはChatGPTのように定額制サブスクリプションで、従量制ではありません。料金が予測しやすく、Repaintでウェブサイトを作るコストは半額以下になることも多いです。

ステップ3: ビジュアルスタイルを決める

AIウェブサイトリデザインのためのフォント、カラー、レイアウトの決定

私はたくさんのウェブサイトを作ってきました。すべてを構築する前にスタイルを計画しておくと、常にスムーズに進みます。すでに20ページある状態でスタイルを変更するのは大変です。リスタイルして確認すべきものが多すぎるからです。

最善のアプローチは、小さな部分を先に作り、スタイルを仕上げてから、残りを構築することです。

ビジュアルスタイルとは?

ウェブサイトのビジュアルスタイルは以下の組み合わせです。

  • フォント
  • カラー
  • レイアウト構造
  • 画像、グラフィック、動画
  • アニメーション
  • その他の細部(シャドウ、角丸など)

ビジュアルスタイルの作成とは、これらの中から見た目の良い組み合わせを見つけることです。

ビジュアルスタイルの作り方

優れたデザインを作る方法は基本的に2つしかありません。試行錯誤と、参考にすることです。デザイナーでない限り、他のサイトをインスピレーションとして使うことを強くお勧めします。

最近のAIモデル、Opus 4.6とGPT-5.4は、画像分析に優れた最初の世代です。すべてのツールがこれらのモデルを使用しているわけではありません。Claude Code、Codex、Lovable、Repaintは使用していることを確認しています。これらのモデルは画像からスタイルやレイアウトを再現できます。チャットにスクリーンショットやその他の画像を貼り付ければ、かなりの精度で再現できるはずです。

そこからの調整はおそらく必要です。正確な色やフォントの抽出に苦労することが多いです。しかし、続けてAIにカラーのhexコードとGoogle Fontsのフォント名を教えれば、すぐに修正されるはずです。

インスピレーションが必要なら、AwwwardsGodlyのようなサイトで優れたデザインの例を見つけられます。ただし、これらの多くは派手すぎたり再現が難しかったりします。Pinterestを閲覧したり、Google画像検索で「Xウェブサイトデザイン」と検索するだけでも十分成功しています。

AIの汎用スタイルを避ける方法

すべてのAIモデルにはデフォルトスタイルがあります。それを止めさせるのは見かけ以上に難しいです。

言葉でスタイルを説明する方法を何百通りも試しました。うまくいったことはありません。スタイルを伝えるのに言葉は効果的ではありません。AIが空白を埋める必要があるたびに、汎用スタイルを使います。私の経験では、最善の対策は例を与えることです。画像でもコードでも、その両方でも構いません。

もう一つの主な手法は、カスタム画像を用意することです。AIウェブサイトにはカスタム画像がありません。汎用AIサイトが似て見える大きな理由の一つです。チャットに10枚の画像をアップロードすれば、AIがサイト全体にインテリジェントに配置してくれるはずです。

AIデザインの限界

AIモデルはまだアニメーションや動画を見ることができません。そのため、クールなアニメーションのある参考ウェブサイトを提供しても、アニメーションを忠実にコピーすることはおそらくできません。どのように動作すべきかを説明することで修正を試みることはできます。また、利用可能であれば、求めるアニメーションのソースコードを共有してください。

AIモデルは、それ自体が優れたデザイナーでもありません。サイトが気に入らず、どう改善すればいいかもわからない場合、新しい参考資料なしにAIモデルが修正してくれることはおそらくありません。「とにかく良くして」と入力することはできますが、あまり期待しない方がいいでしょう。

ステップ4: コンテンツをインポートする

AIを使って古いウェブサイトからページやブログ記事をインポートする

スタイルが決まったら、サイトの残りの部分を構築する段階です。ここがAIの真価を発揮するところです。

「このウェブサイトのページを再現してください: https://mywebsite.com」と言うだけで、取り込んでくれます。AIはすでにスタイルを把握しているため、同じスタイルで新しいページを作成します。

AIに一度に数十ページをインポートさせることができます。しかし、まとめて行うことをお勧めします。一度にたくさんやらせるほど、更新が失敗する可能性が高くなります。どのツールにも100ページを一度に処理するよう指示すると、コードが壊れたり、すべてを正しくインポートし忘れたりして失敗する可能性が高いです。

きれいにインポートされるもの

AIツールがウェブサイトを読み取ると、メインコンテンツだけに簡略化されたバージョンを取得します。テキストと画像リンクを読み取れます。ブログ記事のようなテキストコンテンツのインポートは完全に自動化できるはずです。AIにそのままインポートさせることも、改善のために言い換えさせることもできます。

ブログのような大量のコンテンツをインポートする場合、最初の記事を先に作って見た目を確認すべきです。AIはその最初の記事をベースに大量のページを追加します。100件のブログ記事を追加した後に構造を変更する必要が生じると、はるかに時間がかかります。

従量課金制のツールで大量のコンテンツをインポートしようとすると、多くのトークンを消費することがあります。Repaintは上記で挙げた他のツールよりもはるかに速く安くコンテンツをインポートできます。

きれいにインポートされないもの

正確なスタイルを取得するのは難しいです。アナリティクスのトラッキングスクリプトのような高度なロジックの取得はほぼ不可能です。そういったものは再作成するか再追加する必要があります。それぞれ1回のプロンプトで追加できるはずです。AIエージェントはスクリプトや埋め込みの追加が得意です。

埋め込みの動画やマップはインポート時に通常失われますが、URLで簡単に再追加できます。

画像の品質が落ちることもあります。古いサイトが最適化された小さな画像を配信していた場合、AIがそれをスクレイピングすると小さいバージョンの画像しか取得できません。元の高解像度ファイルを再アップロードすることで修正できます。

また、Claude Codeのようなコーディングエージェントが画像をダウンロードせずにURLをコピーすることがあります。古いサイトを停止して画像が壊れるまでは機能します。Repaintは画像を自動的にダウンロードしますが、他のツールでは確認すべきです。

サイトをレビューする

すべてのインポートが完了したら、次に進む前に時間をかけて確認しましょう。

  • すべてのページを読み通す。AIがテキストをでっち上げたり、コンテンツを落としたりすることがあります。
  • モバイルでのページの見た目を確認する。
  • すべてのリンクが機能することを確認する。
  • トラッキングスクリプトを再追加する(Google Analytics、Meta Pixelなど)。
  • 引き継がれなかった埋め込みを再追加する(動画、マップ、予約ウィジェット)。
  • 必要に応じて高品質の画像をアップロードする。

ステップ5: SEOを守る

ウェブサイト移行時のSEOランキングとURLの保護

多くの人がリデザイン中にGoogleのランキングを失うことを恐れています。良いニュースは、それを避けるのはそれほど複雑ではないということです。

Googleはウェブサイトをページ単位で考えています。サイト上の各URLには独自のランキングがあります。Googleはサイトの見た目、どのプラットフォームにあるか、コードがどうなっているかは気にしません。URLとそのコンテンツを気にしています。

そのため、SEOを引き継ぎたいなら、移行前後でGoogleが同じページを見られるようにする必要があります。具体的には以下を意味します。

  • 新しいサイトは古いサイトと同じURLを持つべきです。古いサイトに/aboutがあったなら、新しいサイトにも/aboutが必要です。
  • 各ページは同じtitleタグ、meta description、H1を維持すべきです。
  • URLを変更または削除する場合は、古いURLから新しいURLへの301リダイレクトを設定してください。これにより、Googleに「このページはなくなりました」ではなく「このページはここに移動しました」と伝えられます。
  • 同じドメインを使用してください。古いサイトがyourbusiness.comだったなら、新しいサイトもyourbusiness.comにすべきです。

301リダイレクトの仕組みや特定のプラットフォームでの設定方法など、何か不明な点があれば、AIツールに聞いてください。ステップごとに案内してくれます。

基本的にはそれだけです。同じURLで同じコンテンツを維持すれば、Googleは何かが変わったことにほとんど気づきません。

Google Search Console

まだGoogle Search Consoleを設定していない場合は、移行前に設定してください。無料で、Googleがサイトの問題を通知してくれる手段です。新しいサイトを公開した後、Googleがすべてのページを見つけていること、何も壊れていないことを確認するために使用できます。

また、どのページに現在トラフィックがあるかも表示されるため、計画に役立ちます。トラフィックがゼロのページについては、そのURLの保持を心配する必要はありません。

AIはSEOが得意(依頼すれば)

AIツールはテクニカルSEOに優れています。サイト全体をレビューし、すべてのページに適切なmetaタイトル、description、H1タグ、正しいURL構造があるか確認できます。301リダイレクトの設定もできます。サイトマップの生成もできます。これらはすべて、以前は面倒な手作業か、エージェンシーに依頼して費用がかかるものでした。

注意点は、AIツールはこれをデフォルトでは行わないことです。サイトを構築しているとき、AIは見た目を整えることに集中しており、SEOメタデータには注意を払いません。明示的に依頼する必要があります。

サイトが構築された後、AIに次のように伝えてください。「サイトのSEOをレビューしてください。すべてのページにユニークなmetaタイトル、meta description、H1タグがあり、URLが古いサイトと一致していることを確認してください。」数分ですべてを監査して修正できるはずです。

公開後

新しいサイトが公開されたら、基本事項を確認しましょう。

  • すべてのページにアクセスして読み込まれることを確認する。
  • 数日間、Google Search Consoleでクロールエラーがないか確認する。
  • Googleで自分のビジネスを検索し、ページがまだ表示されていることを確認する。

同じURLとドメインを維持していれば、ランキングの大きな変動は見られないはずです。

ステップ6: ドメインを切り替える

リデザインされた新しいウェブサイトにドメインを切り替える

これは最も怖がられる部分ですが、実は最もシンプルなステップです。

ドメイン(yourbusiness.comのようなもの)はウェブサイトとは別のものです。サイトがホストされている場所を指し示しているだけです。公開する準備ができたら、その指し先を変更します。それがプロセスのすべてです。

良いところは、両方のサイトを同時に稼働させておけることです。新しいサイトを一時的なURLで構築している間、古いサイトはドメインで稼働し続けます。好きなだけ時間をかけられます。新しいサイトに満足したら、ドメインを切り替えます。

切り替え後、DNS伝播と呼ばれる短い遅延があります。変更が完全に反映されるまで、通常数分から数時間かかります。その間、古いサイトを見る人もいれば、新しいサイトを見る人もいるかもしれません。慌てないでください。自然に解決します。

ドメインの指し先を変更する方法がわからない場合は、AIツールが案内してくれます。プロセスはドメインの登録先(GoDaddy、Namecheap、Google Domainsなど)によって若干異なりますが、通常は1つか2つの設定を変更するだけです。

まとめ

AIが3,000ページの企業サイトを魔法のように移行したり、複雑なeCommerceバックエンドを置き換えたりすることはできません。そのような状況であれば、おそらくまだエージェンシーが必要です。

しかしほとんどの小規模ビジネスのウェブサイトにおいて、リスクとリターンのバランスは議論の余地がありません。最悪のケースは午後を費やして出来上がりが気に入らないこと。最良のケースは夕食までに、より速くモダンなサイトが手に入ること。このガイドで紹介したほとんどのツールは無料で始められるので、失うものはほとんどありません。

何年もリデザインを先延ばしにしてきたなら、今がやめどきです。

よくある質問

AIはゼロからやり直さずにウェブサイトをリデザインできますか?

ある意味ではできます。AIツールは既存のウェブサイトを読み取り、すべてのテキストと画像を抽出し、新しいコードベースで再構築できます。白紙からのスタートではありません。ただし、既存のサイトを編集するのではなく、古いコンテンツで新しいサイトを構築しています。結果は再構築されたサイトであり、元のサイトにパッチを当てたものではありません。

ウェブサイト移行に最適なAIツールは何ですか?

マーケティングウェブサイトにはRepaintをお勧めします。このワークフロー専用に設計されており、他のAIツールよりも速く安くサイトをスクレイピング、インポート、再構築できます。すでにプログラミングができる場合は、Claude CodeやCursorも優れた選択肢です。バックエンドロジックを持つ複雑なアプリには、Lovable、Replit、Boltの方が適しています。

Wix、Squarespace、WordPressからAIで移行できますか?

はい。AIツールは古いプラットフォームのエクスポート機能に依存しません。人間と同じようにライブウェブサイトを読み取り、ページからコンテンツを抽出します。Wix、Squarespace、WordPress、GoDaddy、Framer、その他何であっても関係ありません。

AIでウェブサイトをリデザインするのにどのくらい時間がかかりますか?

数ページのシンプルなサイトなら、約10分で公開可能な最初のドラフトが完成します。ほとんどの人はその後、数日かけてスタイルの調整、細部の修正、コンテンツの確認に数時間を費やします。小規模ビジネスのサイトの完全なリデザインは、現実的に一午後で完了できます。

ウェブサイトをリデザインするとSEOを失いますか?

同じドメイン、同じURL、各ページで同じコンテンツを維持していれば失いません。Googleは個々のURLをランク付けしており、ビジュアルデザインではありません。ページが同じアドレスに同じコンテンツで存在し続ける限り、ランキングは引き継がれるはずです。URLが変更される場合は、301リダイレクトを設定してください。

AIで古いサイトからブログ記事をインポートできますか?

はい。AIツールはブログ記事を自動的に読み取ってインポートできます。コンテンツをそのまま取り込むことも、言い換えることもできます。大規模なブログの場合、一度にすべてではなく、まとめてインポートすることをお勧めします。更新が大きくなるほどエラーの可能性が高まるためです。

AIウェブサイトビルダーと通常のウェブサイトビルダーの違いは何ですか?

WixやSquarespaceのような通常のウェブサイトビルダーは、すべてを手動で配置するドラッグアンドドロップエディタを使用します。Repaint、Lovable、BoltのようなAIウェブサイトビルダーはチャットを中心に構築されています。求めるものを説明すれば、AIが構築します。編集体験は根本的に異なります。より詳しい比較については、2026年のベストAIウェブサイトビルダーに関する記事をご覧ください。

AIでウェブサイトをリデザインするのにいくらかかりますか?

無料から約20〜50ドルの範囲です。ほとんどのAIツールには、支払い前にサイトを構築して気に入るか確認できる無料プランがあります。Repaintは定額サブスクリプションで月額20ドルです。Lovable、Replit、Boltは従量課金制で、大きなサイトを構築するとコストが急速に膨らむ可能性があります。比較として、エージェンシーへの依頼は通常3,000〜10,000ドル以上かかります。

プログラミングの知識は必要ですか?

Repaint、Lovable、Replit、Boltのようなエンドツーエンドのウェブサイトビルダーを使う場合は不要です。コードは彼らが処理します。Claude CodeやCursorのようなコーディングエージェントを使う場合、コードを書く必要はありませんが、コードベースの操作とホスティングの設定に慣れている必要があります。

AIが作ったものが気に入らない場合は?

これはAIリデザインが失敗する最も一般的な理由です。AIに好みのスタイルを出させようとして行き詰まり、進展しないまま諦めてしまうのです。これを避ける最善の方法は、言葉で説明しようとするのではなく、AIに強力なビジュアル参考資料を与えることです。数回試しても満足できない場合は、AIデザインがまだ求めるレベルに達していない可能性があり、デザイナーへの依頼を検討すべきかもしれません。

何か問題が起きた場合、古いサイトに戻れますか?

はい。新しいサイトを構築している間、古いサイトはずっと稼働し続けます。最後にドメインを切り替えるまで、古いサイトには触れません。公開後に何か問題が起きた場合は、ドメインを元に戻せます。

リデザイン後、サイトをどう最新に保ちますか?

構築した時と同じ方法です。AIウェブサイトビルダーでは、AIとチャットするだけで変更できます。コーディングエージェントでは、求めるものを説明すればコードを更新してくれます。AIツールの最大の利点の一つは、継続的な更新が簡単なことです。エディタを学んだり、小さな変更のために誰かを雇ったりする必要はありません。

AIリデザインが失敗する最も一般的な理由は何ですか?

スタイルが気に入らないことです。コンテンツのインポートやページの構築の技術はうまく機能します。しかし、AIが満足のいくビジュアルデザインを作れない場合、際限なく微調整を続けて進展しない状態に陥ります。ビジュアル参考資料、カスタム画像、組み込みのスタイルライブラリを使用すれば成功率は大幅に向上しますが、それでも人々が諦める主な理由です。