仕事別にAIの向き不向きを比べる

OpenAI 逆引きマニュアル仕事のやりたいことから探す、ChatGPT・Codexの使い方

← 一覧にもどる

お店や活動を紹介するWebサイトを作る

🍳 作り方レシピ · 内容確認 2026-09-05

最初は『誰に、何を伝え、次に何をしてほしいか』を1つずつ決めます。写真と原稿を揃えると、修正が具体的になります。

できあがりを見る読書会の紹介サイト →1ページの完成品。スマホ幅でそのまま読めます

用意するもの

  • 名称、紹介文、連絡先、使用できる写真
  • で作るか、でソースを作るかの希望

1. 載せるものを絞る

見出し、活動紹介、写真、よくある質問、連絡先の5か所を書き出します。未確定の住所や営業時間は空欄にします。

2. 初版を作る

で『websiteを作りたい』と伝えるとSitesの制作につなげられます。既存プロジェクトを使うならCodexで対象フォルダを開きます。

3. スマホで触る

文字の大きさ、横にはみ出す箇所、リンク先を確認します。『見出しを短く』『写真を先に』のように位置と変更内容を伝えます。

4. 公開する

確認用の版を見てから公開先を決めます。Sitesの公開URLは本番になるため、下書き段階では『保存だけ』と明記します。

コピーして使える依頼文

地域の読書会の紹介サイトを1ページで作って。対象は初参加の人。紹介・次回日程・参加方法・FAQを載せ、スマホで読みやすくして。未確定の日程は仮と表示。まず公開せず確認用の版を作って。
この依頼文だと、こう返ってきます
1ページの構成をこうしました。確認用の版として作り、公開はしていません。 - 見出し:まちの夜の読書会 + 一文の紹介 - どんな会か(雰囲気・人数・所要時間) - 次回の日程(日時・場所・参加費・持ちもの) - 参加のしかた(3ステップ + 申し込みボタン) - よくある質問(4件) - 連絡先 会場が未確定とのことでしたので、その行に「仮」のラベルを付けています。確定したらラベルを消すだけで済みます。 申し込みボタンは今のところ見た目だけです。実際に受け取るには送信先(メールアドレスかフォーム)が必要なので、決まったら教えてください。 スマホ幅(375px)で横にはみ出さないことを確認しました。

実際の返答はそのときの資料や状況で変わります。形の目安として載せています。

完成チェック

  • スマホで横スクロールしない
  • 連絡先と日付が正しい
  • 全リンクが目的の場所へ進む
この内容で自分用の手順書を作る →予算・経験・使える時間に合わせる

公式情報で確認する

sites ↗codex/cli ↗

手順例と依頼文は、このマニュアル用の作例です。

Claude版で関連する記事成果物を1枚のページにする(Artifacts) ↗
Antigravity版で関連する記事Antigravity版マニュアルには、これに当たる記事がありません。

このページについて聞く

記事をもとに回答します。Geminiは必要に応じてWeb検索も使います。
質問は選択したAIへ送信します。GeminiはGoogleのGemini API、GPTはGoogle Cloud経由で利用します。このサイトでは質問・回答の本文をデータベースに保存せず、利用回数を記録します。 送信と保存について

回答するAIGPTはこのサイトではWeb検索を使いません。