ChatGPTでホームページを作る方法:できること・できないことと公開までの手順

ChatGPTでホームページを作るとき、ChatGPTに任せられるのはサイトの「中身」です。ページの構成(何ページに何を載せるか)、各ページの文章、HTMLとCSS(ページを表示するためのコード)、挿絵などの画像は作れます。書かせたHTMLは、ChatGPTの画面の中で「プレビュー」を押して見た目を確かめられます(2026年10月時点のOpenAIのヘルプによる。使える操作は、プランや機能の提供状況によって変わります)。

一方、会社のホームページとして使い続けるのに要る次のものは、ふだんの会話だけでは用意できません。独自ドメイン(〜.co.jp のようなサイトの住所)の取得、公開するためのサーバー、問い合わせフォームの受け取り、公開後の更新の管理、アクセスの計測と検索への登録です。

ただし2026年10月時点では、有料のPlus・Proと、会社向けのワークスペースで、ChatGPTの中でサイトを作って公開まで行える「ChatGPT Sites」がパブリックベータ版(試験提供)として提供されています。FreeとGoのプランでは使えません。独自ドメインを使う場合も、ドメインは自分で持っていて、DNS(ドメインの設定)を自分で変えられる必要があります。

会社のサイトで当社がすすめるのは、「構成と文章はChatGPT、公開と更新はWordPressやホームページ作成サービス」という分け方です。以下、できること・できないことの一覧、公開までの三つの道筋と手順、入力の前に確かめる設定を書きます。料金は変わるので、この記事では金額を書きません。各社の公式サイトで確かめてください。

ChatGPTでできること・できないこと(2026年10月時点)

作業ChatGPTで補足
サイトの構成(ページの一覧)できる業種と目的を伝えると案が出る。決めるのは事業者
各ページの文章できる料金・所在地・資格などの事実は自分で照らす
HTML・CSSのコードできるコードの欄の「プレビュー」で見た目を確かめられる
画像できる画像の作成はすべてのプランで提供(ヘルプ)
ドメインの取得できないChatGPT Sites もドメインの登録は代行しない
サーバーと公開ふだんの会話ではできない有料プランの ChatGPT Sites(ベータ)なら公開まで行える
問い合わせの受け取りコードだけでは受け取れない受け取る仕組みが別に要る
公開後の更新頼めば書き直すコードの場合、差し替えて置き直すのは自分
計測と検索への登録できないGA4・Search Console は自分で設定する

表の「プレビュー」は、ChatGPTのヘルプで、コードの欄(コードブロック)に用意された操作として説明されているものです。プレビューできるものとして、HTMLのページなどが挙がっています。ヘルプには、すべての会話ですべての操作が出るとは限らず、「プレビュー」が出ないコードの欄はプレビューに対応していない、とも書かれています。ただ、画面の中で表示できたページは、まだ会社の住所で公開されたホームページではありません。

AIでホームページを作る方法は、ChatGPTのほかにも、作成サービスに組み込まれたAIや、WordPressにAIをつなぐ方法があります。三つの違いはAIでホームページを作る方法で比べています。この記事はChatGPTを使う場合に絞って書きます。

公開までの三つの道筋と、向いている会社

ChatGPTで作った中身を公開するには、次の三つの道筋があります。

道筋ChatGPTの役目公開と更新を担うもの向く場合
A 作成サービスやWordPressと併用構成、文章、画像作成サービスやWordPress社内で画面から直したい。ページや記事を増やしたい
B ChatGPTのコードを自分のサーバーへ文章とHTML・CSS自分で契約したサーバーHTMLを読める人がいて、ページも変更も少ない
C ChatGPT Sites作るところから公開までChatGPT Sites(ベータ)有料プランで、まず試しに公開してみたい

当社が会社のサイトにすすめるのはAです。メニューや会社情報の欄は作成サービスのテンプレートやWordPressのテーマが全ページ共通で持つので、電話番号一つ変えるのに全ページを直す必要がありません。社内の人が画面から文章を直せ、ページや記事も足していけます。

道筋A:作成サービスやWordPressと併用する手順

  1. 載せる事実を、先に自分で書き出します。会社名、所在地、電話番号、業務の内容、料金、営業時間、対応する地域、電話でよく聞かれる質問。これがないと、ChatGPTはもっともらしい文章で空白を埋めます。
  2. ChatGPTに、業種、お客様、サイトの目的と、1で書き出した事実を渡し、「ページの一覧と、各ページの見出しの案」を頼みます。
  3. 案を見てページを自分で決め、1ページずつ文章を頼みます。「事実は渡した一覧の中だけで書き、足りないところは【要確認】と書いて残して」と添えると、ChatGPTが補った箇所が分かります。
  4. 出てきた文章の数字と固有名詞を、手元の書類と一つずつ照らします。
  5. 作成サービスやWordPressの編集画面に文章を貼ります。見た目はテンプレートやテーマに任せます。
  6. 問い合わせフォームは、作成サービスやWordPressのフォームの機能で作ります。テスト送信して、届いたメールを誰が見るかを決めます。
  7. 独自ドメインをつないで公開し、Search ConsoleとGA4を設定します(サーチコンソールの設定方法)。

ChatGPTへの頼み方の例文はAIでホームページを作るときの指示の書き方に、業種別にまとめています。フォームに置く項目は問い合わせフォームの項目と作り方が参考になります。なお当社は、ChatGPTではなくClaudeをWordPressにつないで、下書きの保存まで任せています。その形はClaudeでWordPressのホームページを作る方法に書きました。

道筋B:ChatGPTが書いたコードで公開する手順

  1. ページの一覧と、全ページ共通の部分(上のメニュー、下の会社情報の欄)を先に決めます。
  2. 最初に「全ページで使う共通のCSSファイルを一つ」と「トップページのHTML」を頼みます。ページごとに見た目の指定を書かせると、あとで色一つ変えるにも全ページを直すことになります。
  3. 2ページ目からは、トップのHTMLを貼って「上のメニューと下の会社情報はこのまま同じにして、本文だけ料金のページにして」のように頼みます。
  4. コードの欄の「プレビュー」で見た目を確かめ、直したい点を「どこを、どう」で伝えます。直させるときは「ファイル全体を出し直して」と頼むと、部分の貼り間違いが減ります。
  5. パソコンのテキストエディタに貼り、index.html、style.css のような名前で、文字コードを UTF-8 にして保存します。ブラウザで開き、スマートフォンの幅でも崩れないかを確かめます。
  6. レンタルサーバーを契約し、独自ドメインを取り、SSL(https で表示するための設定)を有効にします。
  7. サーバーの管理画面のファイル管理か、FTPソフト(ファイルをサーバーに送る道具)でファイルを置きます。置いた時点で公開されます。
  8. 問い合わせフォームを用意します。HTMLを書いただけのフォームは、送られた内容を受け取れません。サーバー側で動く仕組みか、フォームを提供するサービスが要ります。
  9. Search ConsoleとGA4を設定します。

この道筋は、作ったあとが手間です。文章を一か所直すたびにChatGPTに頼み、ファイルを置き直します。どの版をいつ置いたかを自分で残しておかないと、前の状態に戻せません。共通部分をページごとに持つ作りが、あとの手直しをどう増やすかは制作会社しか直せないのは、ページごとに作られているからに書いています。HTMLを読める人が社内にいない場合は、AかCを選ぶほうが無理がありません。

道筋C:ChatGPT Sites で公開する前に確かめること

OpenAIのヘルプ(2026年10月8日に当社が読んだ範囲)では、ChatGPT Sites は次のように説明されています。

  • 何ができるか:対話しながら、ウェブサイトや簡単なアプリを作り、プレビューし、公開し、共有できる。
  • 使える人:ワークスペース、Plus、Pro向けのパブリックベータ版。FreeとGoでは使えない。
  • 始め方:ウェブ版では「Work」を選び、作りたいウェブサイトを文章で伝える。依頼の文に「website」という語を入れるか、「@Sites」と書くと Sites で作られる。
  • 見られる範囲:新しいサイトは、アクセスの設定を変えるまで、所有者(とワークスペースの管理者)しか見られない。インターネット上の誰でも見られるようにする選択肢は、一般公開が有効な場合のみ。
  • 独自ドメイン:使える場合でも、Sites がドメインの登録を代行することはない。ドメインを自分で持ち、示されたDNSレコードをドメインの会社の画面で追加する。
  • 制限:医療に関する情報やカード番号のような機微な情報を扱ってはいけない(支払いは外部の決済サービスを通す)。削除したサイトは元に戻せない。

一方で、ヘルプには、問い合わせの内容を誰がどう受け取るか(メールで届くかなど)と、Googleなどの検索への登録や表示については、当社が読んだ範囲では説明が見当たりませんでした。会社の本体のサイトとして使う前に、次の四つを確かめることをすすめます。

  1. 独自ドメインがつながるか。自社のプランで独自ドメインが使えるかを、画面とヘルプで確かめます。
  2. 問い合わせが確実に届くか。テスト送信をして、届いた内容を誰が見るかまで決めます。
  3. Search Consoleに登録できるか。独自ドメインをつなぎ、そのドメインのDNSを自分で変えられるなら、「ドメイン」のプロパティをDNSの方法で確認できるはずです。
  4. ほかへ移せるか。将来、別のサービスやWordPressに移るとき、ページの文章や画像を持ち出せるかを見ておきます。

ベータ版のうちは、提供の内容が変わることがあります。当社の見立てでは、まずは期間限定の案内ページなど、なくなっても困らないページで試すのが無難です。

ChatGPTに入力する前に確かめる設定と、入れないもの

OpenAIのヘルプによると、個人向けのプランでは、設定の「データコントロール」にある「すべての人のためにモデルを改善する」をオフにすると、新しい会話はOpenAIのモデルの学習に使われません。「一時チャット」も、モデルの学習には使われません。会社向けのBusinessやEnterpriseは、初めから学習に使わない扱いです。

設定にかかわらず、次のものは入力しません。

  • サーバー、FTP、WordPressのパスワード
  • お客様の名前が入った問い合わせのメールや相談の記録
  • 公開前の取引や価格の情報

入れてはいけない情報の考え方と、個人情報保護委員会の注意喚起はAIで作ったホームページの注意点にまとめています。

出てきた文章・コード・画像の扱い

OpenAIの利用規約(2026年1月1日発効)では、法律が許す範囲で、出力(Output)は利用者のものになると定められています。同時に、出力は唯一のものとは限らず、ほかの利用者にも似た出力が返ることがあること、出力を事実の唯一の情報源として頼ってはいけないことも書かれています。

ホームページに置き換えると、次の三つです。

  • 同業他社とよく似た文章になることがある。自社にしか書けない事実(料金の内訳、手順、対応地域、よく聞かれる質問)を足して、区別がつく中身にする。
  • 書かれた事実は、公開前に自分で確かめる。とくに制度、補助金、資格の説明は古い情報や取り違えが混ざりやすい。
  • 画像で作った人物を「スタッフ」や「お客様」として載せない。実在しないものを実在するように見せる表示になる。

他人の作品に似てしまったときの著作権の考え方、広告の決まり、Googleの検索での扱いはAIで作ったホームページの注意点に、記事をAIで書くときの分担はAIで会社のブログ記事を作成するにはに書いています。

当社の見方:会社のサイトで、どの道筋を選ぶか

迷ったら、次の三つを順に考えてください。

  1. 公開したあと、直すのは誰か。料金や営業時間が変わったときに、社内の人が画面から直せるならA。ChatGPTに頼み直してファイルを置き直せる人がいるならB。
  2. 問い合わせを確実に受け取れるか。テスト送信で届くことを確かめられない作りは、会社の本体のサイトには使いません。
  3. 引っ越しできるか。いまの作り方をやめたくなったとき、文章と画像とドメインを持ち出せるか。

どの道筋でも、ChatGPTが速くしてくれるのは「作る」手間です。何を載せるか、どの数字を出すかを決める仕事は事業者の側に残ります。

当社は、ホームページの運営に加わり、問い合わせが来るまでを引き受けています。当社自身もAIで下書きし、人が確かめてから公開する形でサイトを運営しているので、ChatGPTで作りかけたサイトや、作ったものの問い合わせが来ないサイトも、作り直しを前提にせず、いまの状態から見ることができます。相談するから、サイトのアドレスと困っていることをお知らせください。

参考にした公式の説明

※ChatGPTの機能と画面の名前は、2026年10月8日にOpenAIのヘルプで確かめたものです。ChatGPT Sites はベータ版で、機能や対象のプランは変わることがあります。