Loading
ノートパソコンでChatGPTとの対話画面とホームページのデザイン案を確認している様子

ChatGPT(GPT-6 Astra)のみでLPを制作してみた

結論から言うと、ChatGPTはホームページを「作る」ことはできますが、「公開して育てる」ところまでは今のところ人の知識が必要でした。今回、自社の新サービス「BAMBOO AI WEB」のLPそのものを、ChatGPT(GPT-6 Astra)だけでどこまで作れるか検証しました。実際につまずいたポイントと、AI時代のWeb制作で今後求められるスキルを、率直にまとめます。

公開日

最初の成果物は「動かないホームページ」だった

結論:何も指示せずにChatGPTへ「LPを作って」と依頼すると、Vinext/React/Cloudflare Workers/D1という構成で返ってきました。技術者には魅力的な選択肢ですが、一般的なレンタルサーバーに慣れた方には扱えません。

  • Node.jsのビルド環境、データベース(D1)、サーバーレス実行環境(Cloudflare Workers)が前提の構成だった
  • 「とりあえずFTPでアップロードすれば動く」という多くの中小企業の運用形態とは根本的に噛み合わない
  • 結果として、そのままでは「公開できない成果物」ができあがってしまう

「レンタルサーバーで動くHTML」は明示的に指示しないといけない

結論:ChatGPTに具体的な技術要件(HTML・CSS・JavaScriptのみ、ビルド不要、フォームだけPHP)を明示して初めて、一般的なレンタルサーバーで動く成果物になりました。

  • 「Node.js・npm・ビルド・データベース・APIキーは不要」と明記して再生成を依頼した
  • 問い合わせフォームだけはPHP(mail()関数)で実装し、静的ファイルと明確に分離した
  • 「初心者でも公開できる形」を得るには、技術要件を人間側が翻訳して伝える必要があった

見た目は整っていても、Web制作の基礎知識がないと「張りぼて」になる

結論:ChatGPTが出力したHTMLは見た目こそ整っていますが、正規URL(canonical)の設定、構造化データの整合性、既存サイトとの表記統一など、基本的なホームページ構成の知識がないと正しく設定できない箇所が複数ありました。

  • 正規URL(canonical)の設定漏れ・重複
  • 既存サイトのrobots.txtやサイトマップとの整合性確認(上書きしてはいけない)
  • フォームのCSRF対策・bot対策・送信制限など、セキュリティ面の妥当性を判断できるかどうか

SEO・AEO/GEO・AIO・LLMO対策は「指示しないと入らない」

結論:構造化データ(JSON-LD)やAI検索対策は、ChatGPTが自発的に組み込んでくれるものではなく、こちらから明確にプロンプトで指示しない限り最小限の実装にとどまりました。

  • Organization/Service/WebPageなどのJSON-LDは、指示して初めて出力された
  • AEO(Answer Engine Optimization)やLLMO観点でのFAQ構成、内部リンク設計は別途の指示が必要だった
  • 「AIが自動でSEOをやってくれる」という期待と、実際の出力にはギャップがあった

ChatGPTの成果物に対して、人間とClaudeで修正を行った

結論:ChatGPTが出力したLPは、そのままでは公開しませんでした。人間による方針判断と、Claude(AIアシスタント)によるコードレベルの点検・修正を経て、初めて公開できる状態になりました。

実際に行った修正
項目 修正内容
構造化データの整合性 会社名の表記ゆれ(スペインの有無)、telephone・foundingDateの欠落、パンくずリストの未実装をサイト全体の規約に合わせて修正
画像の最適化 2.0MBのPNGヒーロー画像を144KBのWebPへ変換(約93%削減)。表示速度への影響を是正
内部リンクの追加 独立ページとして孤立していたLPに、パンくずリストと関連ページへのリンクを追加し、サイト内回遊を確保
法令面のリスク指摘 価格表示に税込・税別の明記がない点をClaudeが検出。金額の確定は人間が判断

この一覧からも分かる通り、「コードとして動くかどうか」と「公開して問題ないかどうか」は別の基準です。表記の統一、法令リスクの判断、サイト全体との整合性確認は、現時点のAIが自発的に担える範囲を超えています。

さらに、社内エンジニアによるコードレビューでも複数の改善点が見つかりました。以下は現在対応を進めている項目です。

  • ①ボット対策用の隠し項目(ハニーポット)の項目名が、ブラウザの自動入力機能と衝突しやすい名称になっていたため、衝突しにくい名称へ変更
  • ②メール送信に失敗した場合でも送信済み扱いとなり、60秒間の再送信ブロックがかかっていた不具合を修正し、送信が成功した場合のみロックする仕様に変更
  • ③フォーム送信はページ遷移を伴わないため、従来のページ遷移型の計測では成果を捕捉できない。GA4のカスタムイベントとして送信完了を計測できるよう設計
  • ④同一プロンプトでも生成コードが毎回同じになるとは限らないため、案件ごとに不具合対応が属人化するリスクがある。フォームのバリデーション・送信処理を共通プログラム化し、案件ごとの入力項目はJSON設定ファイルで定義するスキーマを設計中

AIが生成したコードを人が確認して終わりではなく、社内のエンジニアリング体制で継続的にレビュー・改善していくことが、AIを活用したWeb制作を安定して提供するために欠かせないと考えています。

公開後の解析設定はAI任せにできない

結論:ChatGPTは「作る」ことはできても、公開後に必要な計測・解析基盤の設定までは代行してくれません。今回も以下は人の手で別途対応が必要でした。

  • Google Analytics(GA4)
  • Google Search Console
  • Microsoft Clarity
  • Bing Webmaster Tools(AI Performance含む)

「作成」はできても「解析」はまだ難しい——ただしAIエージェントの可能性はある

結論:現時点のChatGPT単体では、公開後のアクセス解析・改善提案までを自律的に行うのは難しいというのが実感です。ただし、今後AIエージェントが解析ツールと連携し、レポーティングや改善提案まで担う可能性は十分にあると考えています。

ChatGPTは強力な「制作ツール」ですが、公開・運用・解析までを含めた「Web戦略のパートナー」にはまだなりきれません。バンブーハウスが提供する「BAMBOO AI WEB」は、今回の検証で見えたギャップ——技術要件の翻訳、SEO/AEO対策の指示、法令リスクの判断、公開後の解析設定——を人とClaudeがカバーすることで、AIの速さと人の知見を両立したサービスです。
少しでも「AIだけで作ったサイトを公開して大丈夫だろうか」と感じた場合は、27年のWeb制作・運用経験を持つバンブーハウスへご相談ください。

よくあるご質問(FAQ)

Q1. ChatGPTだけでホームページは作れますか?

見た目のあるページを生成すること自体は可能です。ただし、一般的なレンタルサーバーで動く形式にすること、SEO・AI検索対策を組み込むこと、法令面のリスクを判断することは、明確な指示と人による確認が必要です。

Q2. なぜ最初の成果物はレンタルサーバーで使えなかったのですか?

指示なしで依頼すると、Vinext/React/Cloudflare Workers/D1という、ビルドやデータベースを前提とした構成で出力されたためです。一般的な共用レンタルサーバーでは、そのままでは動作しません。

Q3. SEOやAI検索対策はChatGPTが自動でやってくれないのですか?

自動では最小限の実装にとどまりました。構造化データ、FAQ構成、内部リンク設計などのAEO/GEO/AIO/LLMO対策は、こちらから明確にプロンプトで指示して初めて反映されました。

Q4. 公開後に必要な作業は何ですか?

Google Analytics(GA4)、Google Search Console、Microsoft Clarity、Bing Webmaster Toolsなどの計測・解析基盤の設定が別途必要です。これらはChatGPTが代行してくれるものではありません。

Q5. 今後、AIエージェントに解析まで任せられるようになりますか?

可能性は十分にあります。
現時点では公開後のアクセス解析・改善提案までを自律的に行うのは難しい状況ですが、AIエージェントが解析ツールと連携し、レポーティングや改善提案まで担う未来は視野に入っています。バンブーハウスも継続して検証していきます。

WEB制作をご検討の皆様へ
AI時代を見据えた、安心のWEB制作をご提案します

AIに正しく理解される設計が出発点。人にも、AIにも伝わるWebサイトを|これからのWeb制作・リニューアル
人にも、AIにも伝わるWebサイトを
今のセキュリティで本当に安全ですか?【東京】ガバメントクラウド・ISMAP準拠対応のセキュアサーバー構築
【東京都】セキュリティ診断
  • 公開日
  • 監修 Webプロデューサー 竹内勇人
公益社団法人日本マーケティング協会×バンブーハウスの対談バナー。トロフィーと審査管理画面(チェックリスト・グラフ・セキュリティ)で日本マーケティング大賞の選考システム開発を象徴
東京タワー×バンブーハウスの対談バナー。ライトアップされた東京タワーと東京の夜景を背景に、WEB運営25年を示す数字「25」をあしらったデザイン
お問い合わせ