AIで作ったWebサイトが現場でゴミ化する3つの理由と対処法

「プロンプトを1行入れるだけで、おしゃれなホームページが秒速で完成！」「もう高額な制作会社なんて不要。これからはAIで内製化する時代！」

ここ最近、SNSやネットを開けばそんな景気のいい言葉ばかりが目につきます。「それなら自社でもやってみよう」と、生成AIやノーコードツールを使って意気揚々とWebサイトを立ち上げてみた経営者さんや担当者さんも多いのではないでしょうか。

……ですが、ちょっと胸に手を当てて思い出してみてください。その秒速で作ったWebサイト、いま現場で本当に役に立っていますか？

ちゃんと、検索流入キーワードを特定したり、PDCAサイクルを回せたりしていますか？

「作って公開したはいいけれど、アクセスが全くない」「問い合わせどころか、検索しても自社の名前すら出てこない」「文字サイズを少し直そうとしただけなのに、画面全体がグチャグチャに崩れて元に戻せない」

そんな冷や汗ものの状態のまま、誰にも見られずネットの海にそっと放置されている……。私たちはWeb工務店として日頃から様々な現場に伺っていますが、いまこうした「AIで作ったWebサイトのゴミ化（放置）問題」が急増しています。それはさながら、千鳥の相席食堂で「ちょっと待てぃ！」が鳴り響くシーンとなんら変わりありません。

見た目（デザイン）は一瞬で作れる時代になったのに、なぜ現場ではまったく機能しないのか。大工仕事でいう「見えない配管工事」の視点から、その3つの理由を解説します。

理由1：AIが主語のコンテンツになり、検索エンジンへの「翻訳」がゼロ（SEO・構造化データ・サチコ不在）

AIに「それっぽいホームページを作って」と指示を出せば、人間が見る分には綺麗なレイアウトとキャッチコピーが秒速で出来上がります。いまの生成AI（GeminiやChatGPTなど）は非常に賢いので、見出しや箇条書きもMarkdown形式で一見美しく整えてくれます。

しかし、「人間が見て綺麗に整っている」のと「Googleの検索エンジンが正しく評価できる」のは全くの別問題です。

表面的にはそれっぽく見えても、裏側のHTMLコードをプロの目線で目視確認してみると、検索順位で勝つための設計が抜け落ちているケースがほとんどです。

見出しタグ（h1〜h4）の論理階層がめちゃくちゃ AIはデザインのメリハリ感覚で勝手に見出しを配置しがちです。「1ページに1つだけ」が原則の<h1>がページ内に何個も乱立していたり、文字の見た目を大きくしたいという理由だけで<h2>を飛ばして<h4>を使っていたりします。人間にはただの太字に見えても、Googleのクローラーから見れば「論理構成が崩壊した意味不明な書類」として減点対象になります。
「構造化データ（JSON-LD）」の文脈チェックが抜けている 会社名、所在地、営業時間、電話番号、提供サービスなどをGoogleに直接伝える「構造化データ（Schema.org）」。AIにコードを書かせること自体はできても、「地域名と業種の紐付けが正確か」「自社の実在性を示す情報と完全に一致しているか」といった現実の商売との整合性は、知っている人間が手作業で検証してテストツールを通さないとエラーだらけになります。
タイトルタグやmeta descriptionが「ただの一般論」 AIが吐き出す要約文は綺麗ですが、「地域の検索ボリュームがあるキーワード」や「クリック率を高める現場の生々しい訴求」が抜けた、毒にも薬にもならない無難な文章になりがちです。ここを目視で調整しない限り、検索結果に並んでも誰もクリックしてくれません。

さらに致命的なのが、Googleサーチコンソール（サチコ）やアナリティクスによる計測設計の欠落です。

インデックス登録のリクエストすらしていない（Googleの検索台帳に載っていない）
どんなキーワードで何人が見に来て、どこで離脱したのかが分からない

これらはAIに「サイトを作って」と頼むだけでは絶対に自動化されません。メーターや速度計が一切ついていない車を運転しているようなもので、どこが悪いのか分からないから永遠に改善（PDCA）が回りません。

結果として、AIが作った「見かけ倒しの綺麗なマークダウン」は、検索エンジンの海に誰にも見つからないまま沈んでいくことになります。

理由2：スマホ実機で破綻するUIと「手打ち修正」の泥沼

これもWeb制作のプロが思わず「あ゛あ゛あ゛っ！！」と頭を抱える、現場の素人事故あるあるです。

PCの画面上でAIが作ったプレビューを見ているときは、「お、いい感じじゃん！」と満足しがちです。しかし、いざ自分のスマートフォンで実機確認してみると、地獄絵図が待っています。

文字サイズが米粒のように小さくて読めない（フォントサイズ指定がpx固定でレスポンシブを無視）
ボタン同士が近すぎて、親指でタップしようとすると隣のリンクを押してしまう（タップ領域が48px未満の失格デザイン）
行間が詰まりすぎていて、3行読んだだけで目が滑る
スマホの画面端からテキストや画像がはみ出して横スクロールが発生している（viewportやコンテナ幅の崩壊）

現代のWebサイトは、業種にもよりますがアクセスの7〜8割以上がスマートフォンからです。画面の向こうにいる生身の人間が、どんな指の太さで、どんな姿勢で片手操作するのか。そうした「人間の身体感覚（UI/UX）」を考慮しないAIの独りよがりなレイアウトは、訪問者に強烈なストレスを与えて秒で離脱されます。

さらに悲惨なのが、「ちょっとした手打ち修正」で自爆するパターンです。現場でよく見る「知らずにやってしまう禁じ手」のオンパレードで、サイトを完全に破壊してしまいます。

Windowsの「メモ帳」でコードを開いて上書き保存する大罪 「電話番号だけ変えたい」と、手軽にWindows標準の「メモ帳」でHTMLファイルを開いて保存してしまう。すると、勝手に「BOM（バイトオーダーマーク）」という目に見えないゴミ情報が付与されたり、文字コードがShift-JISに化けたりして、画面全体が「ｿ」みたいな謎の記号だらけの文字化け地獄に突入します。最低でもVS Codeなどの専用テキストエディタを使い、UTF-8（BOMなし）で保存するという基本ルールすら、AIは教えてくれません。
サーバー上の本番ファイルを「FTP直弄り」して即死 バックアップも取らず、サーバー管理画面のファイルマネージャーやFTPソフトで本番ファイルを直接開き、見よう見まねで書き換える。閉じタグ（</div>など）を1つ消してしまっただけで、サイトのレイアウトがガラガラと音を立てて崩壊。戻すための元ファイルもないため、その瞬間ゲームオーバーです。
全角スペース混入トラップ 日本語入力のままスペースキーを押してしまい、コード内に「目に見えない全角スペース」が紛れ込む。エラー箇所が目視では1ミリも分からないままCSSが一切効かなくなり、数時間頭を抱えて発狂することになります。
ブラウザキャッシュの罠で「直ってない！」と泥沼化 CSSを手打ちしてサーバーに上げたのに、スマホ実機の画面が変わらない。「あれ？間違えたかな？」とコードをさらに適当にいじり回して泥沼化。……ただ端末側のキャッシュが残っていただけなのに、余計な修正を重ねて自らトドメを刺すパターンです。

「この文字サイズを少し大きくしたい」「電話番号を最新に変えたい」。たったそれだけの軽微な修正のはずが、AIが書き殴った複雑怪奇なスパゲッティコードと、制作環境の無知が重なることで、二度と復旧できないゴミと化してしまうのです。

理由3：裏口全開の問い合わせフォームと「情報漏洩・踏み台リスク」

3つの中で最も危険であり、会社の息の根を止めかねないのが、セキュリティと個人情報の問題です。

「問い合わせフォームもAIにお願いして、PHPとデータベース（MySQL）でサクッと裏側まで作ってもらったぜ！」と鼻高々に公開しているケースを見かけますが……その送信ボタンの裏側（バックエンド）、本当に安全だと胸を張って言えますか？

AIは指示された通りに「とりあえず動くコード」を出力してくれますが、そこに伴うリスク管理やセキュリティ要件までは誰も責任を取ってくれません。プロのエンジニアが見れば、卒倒しそうな脆弱性が放置されているのが現実です。

SQLインジェクションの対策（サニタイズ）がガバガバ AIが書いた適当なデータベース処理コードのせいで、フォームの入力欄に悪意あるコマンドを打ち込まれただけで、蓄積された顧客データが丸ごと盗まれる「裏口全開」状態。
スパムボットの標的になり、自社のサーバーが「迷惑メールの送信拠点」に reCAPTCHAなどのボット対策をしていないため、海外のスパム業者に目をつけられ、1日に数千件の怪しいメールが殺到。最悪の場合、プログラムの脆弱性を突かれて自社サーバーのメール送信機能を乗っ取られます。
暗号化もされず、顧客の個人情報が平文でネット上を飛び交う 氏名、電話番号、メールアドレス、問い合わせ内容が、暗号化されないまま生データ（平文）で送信される設計。公衆Wi-Fiや通信経路で盗み見放題のザル警備です。

「知らない会社から怪しいスパムが届く」あの現象、実はあなたの会社が加害者になる話です

みなさんも一度は見かけたことがありませんか？「全然関係ない地方の中小企業や工務店のドメイン（@○○-koumuten.co.jpなど）から、怪しい投資勧誘やフィッシング詐欺のスパムメールが届く」という、あの不気味な現象です。

「なんでこの会社のアドレスからこんなメールが来るの？」と不思議に思ったかもしれませんが、あれこそがまさに「裏口全開の自作フォームや脆弱なサーバーが乗っ取られた末路」です。

因果関係はこうです。

AIで作ったセキュリティガバガバのフォームプログラムをサーバーに設置する
ネット上を徘徊している海外の自動巡回スパムボットに脆弱性を見つけられる
フォームの送信スクリプトを悪用され、「あなたの会社の正規ドメイン」を使って、世界中の何十万人に詐欺メールを一斉送信する踏み台（中継地点）にされる
世界中のプロバイダから「このドメインは悪質なスパム業者だ」と通報され、ドメインが世界共通のブラックリストに登録される
結果：会社のメールサーバーが強制凍結され、取引先への通常の業務メールすら「迷惑メール」に振り分けられて一切届かなくなる

本人は「AIで便利にフォームを作っただけ」のつもりでも、世間から見れば立派な「サイバー犯罪の片棒を担いだ加害者」です。

結論：素人が自前でバックエンドを作ってはいけない＆必ず添削を受けること

そもそも、中小企業や個人事業主が「自前で個人情報を抱え込むデータベースや送信プログラムをAIで手作りする」こと自体が、最大の悪手です。

電話番号やメールアドレスといった重要な個人情報が入る場所は、「フロントエンド（画面の見た目）までの作成」にとどめるのが鉄則。裏側のデータ管理や送信システムは、セキュリティ対策やサーバーの死活監視に何億円ものコストをかけている、長年実績のある老舗のメルマガ配信スタンドや、外部のセキュアなフォームサービス（FormrunやGoogleフォームなど）に丸投げして接続するのが、最も安く、最も安全な正解です。

自社の技術力で守り切れない個人情報を、AIで秒速で作ったハリボテのサーバーに溜め込むのは、自宅の庭に不発弾を埋めて放置しているのと同じこと。

一度でも顧客データが流出したり、スパム配信の踏み台になれば、「AIが書いたコードだから中身は知りませんでした」なんて言い訳は社会的に1ミリも通用しません。一発で信用失墜、損害賠償、取引先との契約解除という地獄のコンボが決まります。

仮に作って、実際に稼働したとしても、添削は必ず受けたほうがいいでしょう。

対処法：AIを「道具」として使い倒し、プロが「配管」を組む

ここまで散々ねちっこく現実をお伝えしてきましたが、私たちは決して「AIを使うな」と言いたいわけではありません。むしろ逆で、AIは業務効率を劇的に跳ね上げる最強の大工道具（電動工具）です。使わない手はありませんし、現場でもどんどん活用すべきです。

ただし、どんなに便利な最新の電動ノコギリであっても、刃の回転方向や安全装置の仕組み（構造と因果関係）を理解せずに適当に振り回せば、大怪我をするのは当たり前です。薬と同じで、「構造を理解した上で、正しい用法・用量を守る」からこそ、AIはその真価を発揮します。

AIのフルネームは、「Artificial Intelligence、つまり人工知能」ですが、使う時のマインドとしては「Allocated Intelligence、分担して一緒に考えてくれる相棒」つまり補助輪として前提知識のある分野を拡張してくれるもの、というスタンスで使うといいでしょう。

そのためには、明確な役割分担が必要です。

AIの担当領域（スピードと量）： 構成案のアイデア出し、文章の下書き、キャッチコピーの壁打ち、画像素材の生成
人間（プロ）の担当領域（安全性と商売の動線）： 検索エンジンに正しく評価される構造化データ設計、サチコ連携による計測、スマホ実機での緻密なUI調整、外部サービスを安全に繋ぐフォーム設計、そして「誰に何を伝えて購入・問い合わせに繋げるか」という泥臭い商売の動線設計

大工の仕事は、表面に綺麗な壁紙を貼ること（デザイン）だけではありません。目に見えない地盤を固め、柱を立て、水回りの配管を通し、地震に耐えられる基礎を作ることこそが本質です。

Webサイトも全く同じです。AIで壁紙を秒速で貼れたとしても、見えない基礎工事や配管工事をサボれば、現場で使い物になるはずがありません。

構造が分からないなら「実践つき」でプロに教わるのが一番早い

「じゃあ、その配管やセキュリティの構造ってどうやって学べばいいの？」「専門用語ばかりで、自社だけで安全に運用できる気がしない……」

もしそう思われたなら、本やYouTubeで独学して手探りで事故を起こす前に、現場を知っている第三者に教わるのが一番の近道です。それも、教科書的な座学セミナーではなく、「自社の実際のサイトや業務画面を一緒に動かしながら学ぶ実践形式」でなければ意味がありません。

車の運転と同じで、交通ルール（専門用語や構造）とブレーキの踏み方（リスク管理）を助手席の教官と一緒に身体で覚えて初めて、公道（本番環境）へ安全に出られるようになります。

実は私たちハチサポートでも、サイトの制作や保守だけでなく、こうした「企業向けのWeb・AI内製化研修」を行っています。

「自社で安全にAIを使ってWeb更新やコンテンツ作成ができるようになりたい」「でも、セキュリティの地雷や越えてはいけない一線（配管の触り方）はプロから叩き込んでほしい」

そんな現場の声にお応えして、机上の空論ではなく「貴社の現場の環境」に合わせた実践的な伴走サポートをしています。

「自分で簡単に更新できる仕組み」があり、「万が一のエラーや事故が起きてもすぐに相談できる体制」が整って、初めてWebサイトは会社の売上を生み出す「本物のインフラ」になります。

電動工具（AI）に使われて大怪我をする側になるのか、道具を正しく乗りこなして商売を加速させる側になるのか。まずは安全な「正しい使い方」を学ぶところから、現場の一歩を踏み出してみませんか？

まとめ：AIは「壁紙を貼る道具」。見えない基礎工事があってこそ商売の役に立つ

ここまで、AIで秒速で作ったWebサイトがなぜ現場でゴミ化してしまうのか、その裏側にある3つの落とし穴をお伝えしてきました。

理由1（SEOの不在）： 見た目は綺麗でも、構造化データや見出し階層が壊滅的で、Googleには「文字の羅列」にしか見えていない。サチコでの計測がないから改善もできない。
理由2（UIの崩壊と手打ちの罠）： スマホ実機で見ると文字が米粒で離脱率MAX。メモ帳での上書き保存やFTP直弄りによる文字化け・レイアウト崩壊で自爆する。
理由3（裏口全開のリスク）： バックエンドまでAIで作った結果、顧客データの漏洩やスパム配信の「踏み台」にされ、会社の社会的信用が一発で消し飛ぶ。

AIは、作業スピードを劇的に上げてくれる素晴らしい電動工具です。しかし、大工の仕事が「壁紙を貼るだけ」では成り立たないのと同じで、Webサイトも「見えない配管工事（セキュリティ・構造化・計測）」という土台が整っていなければ、現場の売上をつくるインフラにはなり得ません。

便利な道具だからこそ、構造と因果関係を理解し、正しい用法・用量を守って使うこと。そして、守るべき境界線（バックエンドや個人情報）は自前で抱え込まず、信頼できる外部サービスや専門の職人を頼ること。

この基本を押さえるだけで、AIに振り回されて自爆する側から、AIを乗りこなして商売を加速させる側へ回ることができます。