昨今、AIの進化によって、ウェブサイトや簡単なSaaSを外部に発注せず、自社で開発するという選択肢がかなり現実的になってきました。

特に中小企業や個人事業主の方にとって、ウェブサイト制作に何十万円、何百万円とかけるのは簡単な判断ではありません。

「独自性のある凝ったサイトでなくてもいい」
「最低限、古く見えないサイトがほしい」
「会社概要、サービス内容、問い合わせ先が載っていればまずは十分」
「できれば自分たちで更新できる形にしたい」

このように考える方も多いのではないでしょうか。

実際、ChatGPT、Claude、Gemini、Claude Code、Codex、Replit、Gensparkなどを使えば、以前よりもはるかに簡単にウェブサイトを作れるようになりました。いわゆる「バイブコーディング」によって、コードを書けない人でも、ある程度見た目の整ったページを作れる時代になっています。

ただし、ここで注意したいのは、ウェブサイトは作って公開したら終わりではないということです。むしろ本当に大事なのは、公開した後です。

『AIで作る』と『ビジネスで使える』は別。見た目ができても、成果につながる状態とは限らない

この記事では、AIを使ってウェブサイトを作った後に、最低限やっておきたいことについて整理します。

まず、どのようにAIで開発しているか

AIでWebサイトを作る主なパターン：Claude Code/Codex、ChatGPT/Claude/Gemini、Replit/Genspark、STUDIO/AIサイトビルダー

AIを使ったウェブサイト制作といっても、実際にはいくつかパターンがあります。たとえば、次のような形です。

  • Claude CodeやCodexなどを使い、GitHubのリポジトリも整理しながら開発している
  • ChatGPT、Claude、Geminiのアーティファクト機能で、見た目だけ作成している
  • GensparkやReplitなどで、フロントエンドからバックエンドまでまとめて作成している
  • STUDIOなどノーコードツールやAIサイトビルダーで、テンプレートをもとに作成している

この中でも、特に注意が必要なのは、アーティファクト機能などで見た目だけ作った場合です。画面上ではそれっぽく見えていても、実際に公開するには次のようなことを考える必要があります。

  • どこにホスティングするのか
  • 独自ドメインをどう設定するのか
  • 問い合わせフォームは動くのか
  • スマホ表示は崩れていないか
  • 検索エンジンに認識されるのか
  • アクセス解析はできるのか
  • 更新しやすい構成になっているのか

つまり、AIで「作る」ことと、ビジネスで使える状態に「運用する」ことは別物です。

おすすめは Hono + Cloudflare Pages

私のおすすめとしては、シンプルな会社サイトやサービス紹介サイトであれば、Hono + Cloudflare Pages の構成がかなり扱いやすいと思っています。

Claude CodeやCodexを使う場合は、最初に「このような構成で作りたい」と相談すれば、プロジェクト構成も含めて整理しながら開発できます。Gensparkの場合は、最初からCloudflare Pagesにデプロイしやすい構成で作成することが可能です。

もちろん、Next.jsが悪いわけではありません。大規模なサービスや複雑なWebアプリケーションであれば、Next.jsが向いているケースもあります。

ただ、この記事を読んでいる方の多くは、まずは次のような目的ではないかと思います。

  • 会社サイトを新しくしたい
  • サービス紹介ページを作りたい
  • LPを作りたい
  • 問い合わせにつなげたい
  • 古いホームページを最低限きれいにしたい
  • 自分で修正できる状態にしたい

このような用途であれば、最初から重い構成にする必要はありません。データベースが必要な場合でも、Cloudflare D1で十分なことも多いです。問い合わせフォーム、簡単な予約、資料請求、簡易的な管理画面程度であれば、最初から大掛かりな構成にしなくても始められます。

大切なのは、最初から完璧なシステムを作ることではなく、公開後に改善できる状態にしておくことです。

AIで作ったサイトにありがちな落とし穴

『AIで作る』と『ビジネスで使える』は別。SEO・検索登録・アクセス解析・フォーム確認・スマホ確認・改善まで考える必要がある

AIでウェブサイトを作ると、見た目はそれなりに整いやすいです。しかし、公開後に見落とされがちな点も多くあります。たとえば、次のようなものです。

1. SEOの基本設定が抜けている

AIで作ったページは、HTMLとして表示されていても、SEOの基本設定が不足していることがあります。最低限、次のような項目は確認したいところです。

  • titleタグ
  • meta description
  • h1、h2などの見出し構造
  • OGP画像
  • canonical設定
  • sitemap.xml
  • robots.txt
  • 404ページ
  • ページ表示速度
  • スマホ対応

特に会社サイトやサービスサイトでは、いきなり大規模なSEO対策をする必要はありません。ただし、最低限の設定が抜けていると、検索エンジンに正しく認識されにくくなります。

2. 公開したのに検索に出てこない

ウェブサイトを公開しただけでは、すぐにGoogle検索やBing検索に表示されるとは限りません。検索エンジンに認識されるまで時間がかかることもあります。

そのため、公開後にはGoogle Search ConsoleやBing Webmaster Toolsに登録し、サイトマップを送信しておくことが大切です。これはざっくり言えば、検索エンジンに対して「新しいサイトを公開したので、見に来てください」と伝える作業です。

特にBingは忘れられがちですが、現在はMicrosoft EdgeやAI検索周りとの関係もあるため、登録しておいて損はありません。

3. アクセス解析が入っていない

せっかくウェブサイトを公開しても、アクセス解析が入っていなければ、どれくらい見られているのか分かりません。最低限、Google Analytics 4、いわゆるGA4は入れておきたいところです。さらに、Google Tag Managerを使っておくと、後から広告タグや計測タグを追加しやすくなります。

最初から高度な分析をする必要はありません。まずは次のようなことが分かれば十分です。

  • どれくらいアクセスがあるか
  • どのページが見られているか
  • どこから流入しているか
  • スマホとPCのどちらが多いか
  • 問い合わせページまで見られているか

その後、必要に応じて次のような設定を追加していけばよいと思います。

  • 自社アクセスの除外
  • 問い合わせ完了のコンバージョン設定
  • 電話ボタンのクリック計測
  • 資料ダウンロードの計測
  • 広告配信用のタグ設定
  • Meta広告やGoogle広告との連携

最初から完璧を目指す必要はありませんが、何も計測していない状態で放置するのはもったいないです。

デプロイ後に最低限やること：Search Console / Bing Webmaster Tools / GA4 / GTM / 問い合わせフォーム確認 / デスクトップ・スマホ表示確認

デプロイ後に最低限やっておきたいこと

ここからが本題です。AIを使ってウェブサイトを作り、インターネット上に公開した後、最低限やっておきたいことを整理します。

1. Google Search Consoleに登録する

まずはGoogle Search Consoleに登録します。Google Search Consoleでは、主に次のようなことができます。

  • Googleにサイトの存在を伝える
  • sitemap.xmlを送信する
  • どの検索キーワードで表示されているか確認する
  • インデックス登録状況を確認する
  • ページにエラーがないか確認する
  • 検索結果でのクリック数や表示回数を見る

特に公開直後は、URL検査ツールを使って主要ページのインデックス登録をリクエストしておくとよいです。会社サイトであれば、最低限次のページは確認しておきたいです。

  • トップページ
  • 会社概要
  • サービス紹介
  • 実績・事例
  • お問い合わせ
  • ブログやお知らせの一覧ページ

2. Bing Webmaster Toolsに登録する

次にBing Webmaster Toolsにも登録します。Google Search Consoleだけで終わらせる方も多いですが、Bing側にも登録しておくのがおすすめです。

BingはGoogleほど意識されないことも多いですが、Microsoft Edge、Windows、Copilot周りとの関係もあるため、今後の検索体験を考えると無視しにくくなっています。また、Bing Webmaster Toolsでは、Google Search Consoleから設定をインポートできる場合もあるため、そこまで大きな手間ではありません。

3. Google Analytics 4を設定する

次にGA4を設定します。GA4を入れることで、ウェブサイトにどれくらいアクセスがあるのかを確認できるようになります。

ただし、GA4は設定項目が多く、最初から細かく作り込もうとすると難しく感じるかもしれません。最初は、次の程度で十分です。

  • アクセス数が見られる
  • ページごとの閲覧数が見られる
  • 流入元が見られる
  • 問い合わせページへの遷移が見られる

アクセス数が少ない段階では、細かい分析をしても判断材料が足りません。まずは計測できる状態にしておき、アクセスが増えてきたら改善していく形で問題ありません。

4. Google Tag Managerを設定する

Google Tag Managerは、Google Analyticsや広告タグなどを一元管理するためのツールです。最初から必須ではありませんが、後々のことを考えると、最初に入れておくと便利です。

たとえば、後から次のようなことをしたくなる可能性があります。

  • Google広告を出したい
  • Meta広告を出したい
  • X広告を出したい
  • 問い合わせボタンのクリックを計測したい
  • 資料請求フォームの完了を計測したい
  • ヒートマップツールを入れたい

そのたびにコードを直接編集するのは面倒です。Google Tag Managerを入れておくと、管理画面側でタグを追加・変更しやすくなります。AIで作ったサイトであっても、こうした運用面を考えると、最初からGTMを入れておく価値はあります。

5. 問い合わせフォームが本当に動くか確認する

意外と見落とされがちなのが、問い合わせフォームです。見た目上はフォームが存在していても、実際には送信できない、メールが届かない、迷惑メールに入る、送信後の画面が分かりにくい、ということがあります。

フォームが動かなければ、問い合わせは届かない。送信できる/通知メールが届く/自動返信メールが届く/迷惑メールに入らない/送信後画面/スマホで入力しやすいかを確認

公開後には、必ず自分でテスト送信しましょう。確認すべき項目は次の通りです。

  • フォーム送信ができるか
  • 管理者に通知メールが届くか
  • ユーザーに自動返信メールが届くか
  • 迷惑メールに入っていないか
  • 送信後に完了画面が表示されるか
  • 入力エラー時の表示が分かりやすいか
  • スマホでも入力しやすいか

ウェブサイトの目的が問い合わせ獲得であれば、ここはかなり重要です。サイトがきれいでも、問い合わせが届かなければビジネス上の成果につながりません。

フォームのみ外部サービスを利用している企業も多いです。例えば、弊社が運営するフォーム特化のサービス RepOan もそのひとつです。

6. デスクトップ表示、スマホ表示を確認する

デスクトップ中心に生活しているとスマホが疎かに、スマホ中心で生活しているとデスクトップが疎かになってしまいますが、ユーザーはどちらからも閲覧します。

AIで作ったサイトは、PC画面ではきれいに見えても、スマホで見ると崩れていることがあるので、必ず自分で確認しましょう。最低限、次の点は確認したいです。

  • 文字が小さすぎないか
  • ボタンが押しやすいか
  • 画像がはみ出していないか
  • 横スクロールが発生していないか
  • 問い合わせボタンが見つけやすいか
  • メニューが開閉できるか
  • 表示速度が極端に遅くないか

公開前だけでなく、公開後に実機でも確認するのがおすすめです。

どこまで自分でやり、どこから専門家に頼むべきか

AIによって、自分でできる範囲はかなり広がりました。ただし、すべてを自分でやるべきという話ではありません。

内製か外注かではなく、役割分担で考える。AIでたたき台を作り、必要な部分だけ専門家に相談するハイブリッド運用

たとえば、次のような場合は専門家に相談した方がよいです。

  • 広告運用を本格的に始めたい
  • SEOで継続的に集客したい
  • 予約・決済・会員機能を入れたい
  • 個人情報を多く扱う
  • 複数人で更新・管理する
  • 問い合わせや売上に直結するサイトにしたい
  • 既存システムと連携したい
  • セキュリティ面が不安

一方で、次のような段階であれば、AIを使って自社で進めるのも十分現実的です。

  • まずは会社サイトを公開したい
  • 古いサイトを最低限きれいにしたい
  • サービス紹介ページを作りたい
  • LPを試しに作りたい
  • ブログやお知らせを整えたい
  • 小さく検証したい

重要なのは、内製か外注かを二択で考えないことです。

AIを使って自社でたたき台を作り、必要な部分だけ専門家に相談する。あるいは、最初の公開までは自社で行い、広告やSEO、計測環境の整備だけ外部に頼む。このようなハイブリッドな進め方が、今後はかなり現実的になっていくと思います。

ただ、受託会社によっては、バイブコーディング後のものを渡されるよりも最初から自分たちに任せてもらったほうが良い、むしろ安く済むという場合もあるので、その点については自分たちで作ったものを捨てる覚悟で相談したほうが良いかもしれません。

公開後の最低限チェックリスト

AIで作ったWebサイト 公開後チェックリスト：検索エンジン / アクセス解析 / サイト品質 / ビジネス導線

最後に、AIでウェブサイトを作った後に確認したい項目をまとめます。

検索エンジン関連

  • Google Search Consoleに登録したか
  • Bing Webmaster Toolsに登録したか
  • sitemap.xmlを送信したか
  • robots.txtを確認したか
  • 主要ページがインデックスされているか

アクセス解析関連

  • Google Analytics 4を設定したか
  • Google Tag Managerを設定したか
  • 自分のアクセスが混ざりすぎていないか
  • 問い合わせ完了を計測できるか
  • 広告を出す場合のタグ設計を考えているか

サイト品質関連

  • スマホ表示が崩れていないか
  • ページ表示速度が遅すぎないか
  • 404ページがあるか
  • リンク切れがないか

ビジネス導線関連

  • 問い合わせボタンが正常に動くか
  • フォームが正常に動くか
  • 自動返信メールが届くか

最後に

バイブコーディングによって、多くの人がウェブサイトや簡単なプロダクトを自分で作れるようになりました。これまでであれば、制作会社やエンジニアに依頼しなければ難しかったことでも、AIを活用すれば、自社で試せる範囲が大きく広がっています。

一方で、ウェブサイトやプロダクトは、開発して終わりではありません。検索エンジンへの登録、アクセス解析、問い合わせ導線、スマホ対応、SEOの基本設定など、ビジネスで使うためには細かな運用が必要です。

ただし、最初からすべてを完璧にする必要はありません。

  1. まずは公開する
  2. 最低限の計測と検索エンジン登録をする
  3. 問い合わせが正しく届く状態にする
  4. その後、アクセスや反応を見ながら改善していく

この順番で十分だと思います。

もし法人の方で、自社でこのようなDXの内製化やAI活用を進めるチーム作りについて相談したい方がいれば、法人向けAI研修・伴走サービスまでお問い合わせください。

また、個人事業主の方や小規模事業者の方で、AIを使ったウェブサイト制作、業務改善、発信、サービス設計などを相談したい場合は、個人向けマンツーマンAIメンタリングも実施しています。

さらに、Google Tag Manager、Google Analytics、Google Ads、Meta Adsなどの設定を一元管理・設定できるツールも開発しています。

「自分で作ったサイトに計測環境を入れたい」
「広告やアクセス解析の設定をまとめて整えたい」
「AIで作ったサイトを、ビジネスで使える状態にしたい」

という方は、こちらの開発状況もあわせてご覧ください。