ウェブサイト基本

情報この章の要点

会社の顔になる1〜数ページのサイトを、早くきれいに公開するのが本章です。フォーム処理や独自データベースを持つ業務ツールのように「育てていく」ものはアプリ（バイブコーディング）の領域です。

AIで、どこまで作れるか

AIに指示をするだけで、構成案・文章のたたき台・デザイン・コードまで、公開できる水準のものが一式そろいます。かつて制作会社に数十万円で頼んでいた内容の6〜8割は、AIとの対話だけで形になります。

しかも、始めるのにお金はほとんどかかりません。チャットAIの無料枠でもコードは書けますし、AIビルダーや国内ビルダーには無料プランがあり、公開用のサーバーも無料のホスティングサービスで足ります。まず無料で1ページ作ってみて、手応えがあれば独自ドメインや有料プランに進む——失敗しても失うのは数時間だけという気軽さが、外注時代との一番の違いです。

ただし、AIが作れないものが2つあります。

あなたの事業の中身：強み・実績の数字・お客様の声・写真。ここを渡さないと、AIはどこにでもある一般論でページを埋めます
公開後の運用：誰がどう更新していくか。作って終わりのサイトは、数か月で「触れない古いページ」になります。具体的に何を確認すればいいかは公開後に確認すべき4点にまとめています（サイトも同じ考え方が使えます）

言い換えると、AIに任せるのは「組み立て」で、材料と目的は人間の仕事です。この分担さえ守れば、ウェブサイトはAIでつくるジャンルの中でも費用対効果が高い部類に入ります。

どのツールから始めるか

ホームページやLPの制作は「誰が・何を目的に・その後どう更新するか」で選ぶツールがまったく変わります。まず以下の表で自分の状況を確認しましょう。

こういうときは	おすすめツール
Claudeで構成からデザインまで一気通貫にしたい、または自由度重視でコードを直接書きたい	1. ChatGPT／Claude／Gemini 直書き（Claude Designも含む）
とにかく早く形にしたい（プロトタイプ・提案資料の仮サイト等）	2. AIビルダー（v0・bolt.new・Lovable）
中小企業の会社サイトを自分で更新したい（非エンジニアが自走更新）	3. AI搭載ウェブサイトビルダー（ペライチ・Wix・ジンドゥー）
ブログ・お知らせを継続的に足していきたい（拡張性・保守込みで自走）	4. WordPress＋AI

リサーチから一気通貫でサイト化まで任せたい場合は、Genspark・ManusのようなAIワークスペース／エージェント経由でも同じことができます。

迷ったら、テンプレートの範囲内で手離れよく更新したいなら3、拡張性も欲しいなら4、まず形を見たいだけなら1、と覚えておけば大きく外しません。各ツールの具体的な使い方とプロンプト例はツール紹介にまとめています。

「サーバー」への向き合い方も、ツールによって大きく違います。ペライチ・Wix・ジンドゥーはサーバーごとツールに含まれているので、公開のために別途何かを用意する必要はありません。v0・bolt.new・Lovableは生成したその場でワンクリック公開まで面倒を見てくれます。一方、ClaudeやChatGPTに直接コードを書かせた場合は、Netlify・Vercel・GitHub Pagesのような無料ホスティングサービスへ自分でアップロードする一手間が入ります。WordPressだけは毛色が違い、レンタルサーバーの契約（またはWordPress.comのようなホスティング込みプランの利用）が前提になります。

公開までの最短ルート

どのツールを選んでも、進め方は同じ5手順です。

目的と相手を1行で書く：「誰に・何をしてもらうページか」。これが全指示の土台になります
材料を書き出す：事業内容・強み・実績の数字・お客様の声・使いたい写真。箇条書きの雑なメモで構いません
AIに構成案から作らせる：いきなり完成品を求めず、まずセクション構成を提案させて、順番と過不足を自分で判断します
文章を自分の言葉に差し替える：AIの文言はたたき台です。とくにキャッチコピーと実績は、必ず自分の言葉と実数に置き換えます
公開前チェックをして出す：独自ドメイン・SSL・タイトルタグの3点確認

このうち、AIが手を動かして作るのは3だけです。1・2・4は人間の仕事ですが、AIが無関係というわけではありません。材料の整理や言葉の言い換えの壁打ち相手として、補佐的に使うことはできます。ただし最終的な判断（何を目的にするか、何を材料として渡すか、AIの文言をどう自分の言葉に直すか）は必ず自分で下してください。1・2・4に時間をかけるほど、仕上がりは良くなります。

全体の心構え

「1ページ・1目的」から始める
- 複数の目的（採用・商品紹介・お問い合わせ・ブログ）を1つのサイトに全部詰め込もうとすると、AIへの指示も構成もぼやけます。まずは「このページで何をしてもらいたいか」を1つに絞り、そこから広げましょう。
公開前に独自ドメイン・SSL・SEOの基本を確認する
- どのツールを使っても、「ツールのサブドメインのまま公開していないか」「https://になっているか（多くのツールは自動対応ですが、独自ドメインの紐付けは手動作業が必要な場合があります）」「タイトルタグ・メタディスクリプションが空欄のままになっていないか」の3点は公開前に必ず確認してください。ここを飛ばすと、せっかく作ったサイトが検索にもSNSシェアにも弱いまま公開されてしまいます。
「誰が更新するか」を制作前に決めておく
- AIビルダーで作った凝ったサイトを、事業者本人が日常的に更新できるとは限りません。制作段階で「今後の更新は誰が・どのツールで行うか」を決めておくと、公開後に「触れないサイト」になる事態を防げます。特に支援先に提案する場合は、この観点を先に伝えることが信頼につながります。

実践｜最初の一歩

例コピペで試す：材料整理から構成案まで

「1ページのWebサイト（LP）を作る準備を手伝ってください。私の事業は［業種・サービス内容］、ページの目的は［問い合わせ獲得など］、相手は［ターゲット］です。まず、①このページに載せるべき材料のリスト（私が用意するもの）と、②セクション構成のたたき台を出してください。制作はまだ始めないでください。」

材料リストが出たら、埋められるところを埋めて次の対話に進む。それだけで、事例集のどのツールに持ち込んでも通用する「指示の土台」ができあがります。

具体的なツール別の作り方はツール紹介へ。