AIガイド群 / 用途別ロングテール / 非公式ガイド

AIでWebサイトを作る時の読み順

AIを使ってWebサイトやページを作る時に、文章、素材、設計、実装、公開前確認を分けて進めるページです。

AIガイド群の親ハブへ戻るAIツール比較を見る

このページでできること

ChatGPTで文章を整え、Canvaで素材を作り、Figmaで構成を考え、CodexでHTML/CSS化し、GitHubで管理し、HALで安全確認する流れを整理できます。

Webサイト制作の役割分担

ChatGPTは文章、Canvaは画像、Figmaは設計、Codexは実装、GitHubは管理、HALは公開前の安全確認として見ると分かりやすくなります。

公開前に確認すること

title、description、canonical、robots、内部リンク、画像404、スマホ表示、公式誤認、Secrets混入を確認します。

決める順番を間違えると戻りにくい

決める順番後から変えると
1. 扱う範囲（何のサイトか）途中で広げると既存のページと主題がずれ、どれも中途半端になります。
2. URLの付け方変えると転送の設定が必要になり、リンクも張り直しになります。
3. ページの構成比較的直しやすい部分です。
4. 見た目いつでも変えられます。ここから始めると時間だけ使います。

時間をかけるべきは1と2ですが、多くの場合は4から始めてしまいます。見た目は最後で構いません。

公開した後に必ず起きること

  • すぐには読まれない：公開しても知られるまでには時間がかかります。数日で判断しないことです。
  • 直す作業が続く：作って終わりではなく、書き換えと確認が続きます。続けられる量で始めます。
  • ページが増えるほど散らかる：似た内容が増え、どこに何を書いたか分からなくなります。一覧を持っておきます。
  • 古くなる：価格や画面の説明は、書いた時点のものになります。直し続けられない情報は、最初から書かない方が安全です。

公開前の確認と、公開後に続く手入れは別の作業です。前者だけを整えても、後者を続ける仕組みが無ければ、しばらくして放置されたサイトになります。

AIサイト群の役割分担

サイト名担当テーマここでできること向いている読者注意点次に読むページ
gptguide.jpAI総合、AIツール比較、AI用語、AIモデル、AIエージェント用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するgptguide.jp を見る
chatgptguide.jpChatGPT、文章整理、要約、指示文、相談用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するchatgptguide.jp を見る
codexguide.jpCodex、Web制作、GitHub作業、公開前チェック用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するcodexguide.jp を見る
copilotguide.jpMicrosoft Copilot、Microsoft AI Models、Windows開発AI用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するcopilotguide.jp を見る
geminiguide.netGemini、Google Drive、Spreadsheet、情報整理用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するgeminiguide.net を見る
canvaguide.jpCanva、画像、バナー、サムネイル、素材権利用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するcanvaguide.jp を見る
figmaguide.jpFigma、UI設計、LP設計、ワイヤーフレーム用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するfigmaguide.jp を見る
githubguide.jpGitHub、repository、PR、Secrets、GitHub Copilot用途に合うガイドへ進む該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するgithubguide.jp を見る
hal9000.sbsAI安全注意、個人情報、APIキー、公開前チェック安全注意を先に確認する該当テーマを調べたい人公式情報、料金、仕様、提供範囲は公式サイトで確認するhal9000.sbs を見る

どのAIガイドを読むべきか

文章や要約

  1. chatgptguide.jp
  2. gptguide.jp
  3. hal9000.sbs

Web制作や実装

  1. codexguide.jp
  2. githubguide.jp
  3. hal9000.sbs

画像やデザイン

  1. canvaguide.jp
  2. figmaguide.jp
  3. codexguide.jp

Microsoft系AI

  1. copilotguide.jp
  2. gptguide.jp
  3. githubguide.jp

AIを使う前の共通チェック

  • □ 何をしたいか決めた
  • □ 文章、画像、実装、設計、安全確認を分けた
  • □ 個人情報や会社情報を入れすぎていない
  • □ APIキー、token、GitHub Secrets、.envを貼っていない
  • □ 公式ロゴや公式画像を使っていない
  • □ AIの回答をそのまま公開しない
  • □ 重要判断は人間が確認する
  • □ 公開前チェックを行う

次に読むページ

AIガイド群とは親ハブへ戻り、AI専門サイト群の全体像を確認します。AIサービス比較AIツール全体の違いを確認します。AI用語集分からない言葉を確認します。生成AIとは生成AIの基本を確認します。