ChatGPTでサイト作成!プログラミング不要で自分好みのWebサイトを作る方法

配信日: 2026年10月28日(水)
テーマ:🖥️ChatGPT祭り!ChatGPTでサイトづくり

🌹赤髪が話した主な内容

  • ChatGPTのChatとWorkを使い、プロフィールやサービス紹介、会員サイトなどを作れる
  • 最初にサイトのイメージ画像をChatで作り、好みのデザインを選んでから制作指示文を作る
  • 制作指示文もChatGPTのChatで作り、選んだイメージ画像と一緒にWorkへ渡して制作を進める
  • 最初は少ない情報を載せたサンプルサイトから始め、必要な内容や機能を追加していく
  • 管理画面を用意すれば、掲載情報を自分で編集したり、複数人で運用したりできる
  • Googleドライブと連携し、保存している写真や資料をサイトづくりに活用できる
  • 音声入力を使えば、普段の話し言葉で希望や修正内容を簡単にChatGPTに伝えられる
  • サイトは発信や集客だけでなく、自分の学習や移動時間の活用にも役立つ

この記事では、毎朝7時からのインスタライブの内容をまとめた解説資料をそのまま公開しています。 配信を見逃した方や、テキストで読みたい方に、参考にしていただけるとうれしいです。

この記事は、2026年10月28日noteに投稿したものです。
最新情報をgetしたい方はnoteのフォローもよろしくお願いします♪
🔗noteはこちらから見れます。 

🌟結論:仕事用も学び用も。必要なサイトが簡単に作れる。

ChatGPTを活用することで、専門的なプログラミング知識がなくても、自分の目的に合ったサイトづくりに取り組める。プロフィールやサービスを紹介するサイトから、講座の会員サイト、学習用のクイズサイトまで、活用の幅は広い。

制作のポイントは、最初にChatでイメージ画像を作り、完成形の方向性を決めることである。好みのデザインを選んだら、必要な内容や機能を伝え、制作指示文もChatGPTに作ってもらう。最初から複雑なサイトを目指さず、簡易的なサンプルサイトを作って調整していけばよい。

また、サイトは人に見せる目的だけで作るものではない。知りたいテーマをまとめ、自分が学ぶために使うこともできる。「こんなサイトがあったら便利だ」と思ったときに、気軽に作って活用してみよう。

① ChatとWorkを使い分けてサイトを作る

ChatGPTのChatでデザインや制作指示を準備し、Workでサイトを作っていく。

例えば、次のようなサイトを作れる。

  • 食材を検索すると、詳しい作り方を確認できるレシピサイト
  • 講座の日程、録画、配布資料、お知らせをまとめた会員サイト
  • 活動写真を使った団体の紹介サイト
  • Instagramのアップデート情報をまとめたサイト
  • クイズに答えながらマーケティングを学べるゲームサイト
  • おからの知識やレシピをまとめた情報サイト
  • 小学生に向けて自分のことを伝えるプロフィールサイト

同じプロフィールサイトでも、誰に見てもらうかによって、説明の仕方やデザインは変わってくる。制作を依頼するときは、サイトのテーマに加え、対象となる人や、どのように使いたいかを伝えよう。

② 最初にイメージ画像を作ってデザインを決める

サイト制作は、まずイメージ画像を作るところから始める。完成時の見た目を確認し、好みの方向性を決めてから、具体的な制作指示へ進むのである。

日本の有名なジョギングコースを紹介するサイトを作るなら、「初心者向けに分かりやすくしたい」「画像を多く使いたい」といった希望を伝え、複数のデザイン案をChatGPTのChatで作ってもらう。

依頼内容を整理すると、次のようになる。

日本の有名なジョギングコースをまとめたサイトを作りたい。初心者向けに、画像をたくさん使って分かりやすくしたい。まずはサイトのイメージ画像を3パターン作って。

複数の案を見比べれば、色や雰囲気、情報の見せ方について、自分の希望を具体化しやすい。例えば、緑を基調とした公園ガイド風の案が理想に近ければ、その画像を選んで次の工程へ進もう。

③ 選んだイメージ画像をもとに制作指示文を作る

デザインが決まったら、サイトを作るための指示文をChatGPTのChatに作ってもらう。制作指示をすべて自分で考える必要はない。選んだデザイン案と、追加したい機能、最初に掲載する情報量を伝えて、ChatGPTのWorkで制作する前提の指示文を作ってもらおう。

ジョギングコースのサイトなら、デザイン画像を添付したのち、「デザインはこの方向で進めたい」「管理画面を付けたい」「最初はコースを3つ程度掲載したい」と伝えて、指示文を作ってもらう。

ここで大切なのは、最初から難しい機能や大量の情報を盛り込まないことである。まずはサンプルとして形にし、方向性を確認しながら内容を増やしていこう。

制作指示文ができたら、選んだイメージ画像と一緒にWorkへ渡し、サイト制作を進める。

④ 管理画面を用意して公開後も更新しやすくする

サイトは、作った後も情報を追加したり、古い内容を修正したりする必要がある。更新を自分で行いたい場合は、制作を依頼する際に「管理画面も作ってほしい」と伝えておこう。

例えば、赤髪が作成したレシピサイトの管理画面では、掲載内容を一文字単位で修正できる。おからの情報サイトには、コラムを新しく追加したり、過去の記事を編集できる機能がある。

更新作業は、ChatGPTへ直接依頼することもできる。「イチジクのレシピを追加して」「このレシピを消して」と伝えれば、管理画面で一件ずつ操作する手間も減らせる。

自分で細かく直したいときは管理画面を使い、追加や変更をまとめて依頼したいときはChatGPTに伝える。更新内容に応じて使い分けることで、運用を効率的に進められる。

⑤ 閲覧する人と管理する人を決めて運用できる

ChatGPTアカウントによるログインを使えば、会員限定の閲覧や複数人での管理にも対応できる。対象者の登録メールアドレスを指定するだけで、閲覧・管理権限の設定が可能だ。

この方法では、サイト専用のパスワードを新たに作る必要がない。会員サイトや共同運営のサイトを作るときは、「誰が見られるか」と「誰が編集できるか」を分けて整理し、運用できる。

⑥ Googleドライブの写真や資料をサイト制作に活用できる

ChatGPTとGoogleドライブを連携しておくと、保存している写真や資料をサイトづくりに活用してくれる。

団体の活動紹介サイトなら、「Googleドライブ内から活動写真を探し、それらを使ってサイトを作って」と依頼ができる。写真を一枚ずつアップロードしたり、使う画像を指定する手間を省ける。

例えば、エステサロンのプロフィールサイトなら、ドライブに保存している実績写真を使って制作するように伝えられる。仕事で蓄積してきた素材を、そのままサイトづくりにつなげられる点が便利である。

また、サイトに載せる画像を、ChatGPTで生成することもできる。手元にある写真と生成画像を活用してサイトを充実させられる。

⑦ 自分が学ぶためのサイトを気軽に作れる

サイトは、仕事の紹介や集客のためだけでなく、自分が知りたいことを学ぶためにも活用できる。

例えば、新幹線に乗る時間を使って哲学を学びたいなら、ニーチェについて詳しくまとめたサイトを作っておく。すると隙間時間に完成したサイトをスマートフォンで見ながら、自分のペースで学べる。

自分のために、使い捨てのサイトを作ってもよい時代になった。長期運営を前提にせず、そのときの関心や目的に合わせて気軽に作ろう。

まとめ|ChatGPTでサイトを作る7ステップ

  1. サイトの目的と使う人を伝える
    誰が、何のために使うサイトなのかを伝える。
  2. イメージ画像を2〜3パターン作ってもらう
    希望する雰囲気や見せ方を伝え、デザイン案を画像で確認する。
  3. 理想に近いデザインを選ぶ
    気に入った案を選び、変えたい部分があれば伝える。
  4. 掲載する情報と必要な機能を決める
    何を載せるか、どのように使いたいかを整理する。管理画面の有無もここで考える。
  5. Work用の制作指示文を作ってもらう
    選んだデザインと必要な機能をもとに、「ChatGPTのWorkで制作するための指示文を作って」と依頼する。
  6. 指示文と画像をWorkへ渡し、サイトを作る
    最初は掲載する情報を絞り、サンプルとなるサイトを作る。
  7. 画面を確認し、修正や情報追加を依頼する
    見た目や使いやすさを確認し、必要な調整を重ねる。

※今回紹介したサイト制作はPlusプラン〜で利用できます。(2026年10月28日時点の情報です)


配信者:赤髪

画像

SNS戦略家13年目。上場企業を含む1,500社以上のSNS運用を支援。現在は、NYにある美術館のSNS運用を統括。2022年に、SNSを活用した集客・ビジネス構築を学べる「SNS ACADEMY」設立。累計生徒数は826名。(2025年末にて新規生徒受け入れを終了)
2026年秋、SNS×AI×マーケティングのコミュニティ「GROWZ」開講予定。

要約:MARI / ライター

画像

元LINEの企業広報。広報歴15年。IT企業や通販企業で社外広報・社内広報・SDGs推進と幅広く広報業務に携わり、管理職も経験。現在はフリーランスとして、企業や個人事業主の広報支援およびライティング業務を行う。

🌹赤髪のInstagram LIVE🌹
☀️毎朝7時〜7時30分Instagram LIVEはこちらをクリック👈🏻
SNS運用に関する講義・最新アップデート情報・シリコンバレー直送NEWSをお届けしています。