CodexにWebサイトを作成する「Sites」機能が登場！
実際に触ってみたのでレビュー
KEITOのメルマガは皆さまの支援によって成り立っています。今後の配信も見逃さないために無料購読をお願いいたします。また有料購読でのご支援もご検討ください。
OpenAIのCodexに、Webサイトを作って公開まで一気にやってくれる「Sites」という機能が追加されました。これまでのCodexでも「サイトを作る」ところまではできたんですが、今回はビルドして公開する作業まで丸ごとCodex側でやってくれます。
実際に何回か触ってみて、どんなサイトができるのか、どう使うのか、そして正直どこが惜しいのかまで含めてまとめました。これからCodex Sitesを試す人が、つまずかずに同じ手順を再現できる構成にしています。
この記事でわかること
Codex Sitesでできること（作成→プレビュー→公開まで）
使うための前提（対応プラン・機能の場所）
きれいなサイトに仕上げるためのプラグインの組み合わせ方
独自ドメインで運用したいときの逃げ道（Vercelへの移行）
APIキーを使うWebアプリを作るときのキー管理
触ってみてわかったコスト感と現時点での結論
動画で見たい人はこちらを確認ください。（20分）
Codex Sitesとは
ひとことで言うと、Codexの中で指示を出すだけでWebサイトを生成し、そのままOpenAIのサーバー上に公開してくれる機能です。
OpenAI Codexに「Sites（build and share web apps）」が登場。指示するだけでWebサイトを作って公開まで完結する
ポイントは「作るだけ」で終わらないところ。生成したサイトはCodex上に保存され、何度でも編集・更新できます。さらに、サイトの中で使う環境変数やシークレットキーも保存できるので、APIキーを使うWebアプリまで作れてしまう。このあたりが従来との大きな違いです。
注意：使えるプランが限られています この記事を撮影した時点では、ビジネスプランまたはエンタープライズプランでしか使えませんでした。一般プランに降りてくるかどうかは現状わかりません。試す前に自分のプランを確認しておいてください。
Siteプラグインはどこにある？
ChatGPT（OpenAI）のビジネスプランまたはEnterpriseプランに加入していれば、入力欄の＋マークをクリックするだけで呼び出せます。＋を押して「プラグイン」を開くと、Documents・Spreadsheets・Presentationsと並ぶ中に Sites が出てきます。
入力欄の＋マークから「プラグイン」を開いたところ。一覧の中に「Sites」が並んでいる
逆に言うと、一般プランのアカウントだとこの「Sites」は現状出てきません。表示されない場合は、加入しているプランを確認してください。「Sites」を選べば、あとは作りたい内容を伝えるだけです。
【実演1】指示するだけでサイトができる
使い方はめちゃくちゃ簡単です。＋マークから「Sites」を選ぶと、入力欄の上に「Sites」のタグが付きます。あとは作りたい内容をそのまま打ち込むだけ。
入力欄に「Sites」タグが付いた状態で「Webサイトを作成したい…」と打ち込んでいるところ。ここに作りたい内容を伝える
そうすると、ほとんど自動でローカル上にWebサイトを作ってくれます。生成が終わるとこんな画面になります。
Codexが生成を完了した画面。公開URLと使用ファイルの一覧が表示され、この時点でリンクからサイトを確認できる
「Google Chromeで確認する」を押すと、ブラウザでサイトが開きます。今回作ったのは「AIエージェント活用セミナー」の告知ページ。
公開されたAIエージェント活用セミナーのサイト。ヒーローからしっかり形になっている
中身もちゃんとしていて、開催スケジュールのセクションまで作り込まれていました。プロンプト次第なところはありますが、文句なしのクオリティです。
セミナーサイトの「開催スケジュール」セクション。初心者向け・中級者向けの日程まで整理されている
このサイトがどこに公開されているかというと、〇〇.chatgpt-team.site というドメイン。つまり、OpenAIのサーバー上に公開される形です。
ポイント：そのまま公開URLが手に入る ビルドして公開する作業までCodexがやってくれるので、生成が終わった時点で共有できるURLができあがっています。「とりあえずプレビューを人に見せたい」用途ならかなり速いです。
Sitesタブで管理・共有する
作ったサイトは、左上の「Sites（サイトラブ）」タブから一覧で確認できます。公開中のサイトがここに並びます。
Sitesタブ。漢字ストローク道場・Procevo Renewal LP・AIエージェント活用セミナーの3サイトが一覧で並び、それぞれ共有設定もここから操作できる
共有も簡単で、招待した人やワークスペースでリンクしているメンバー全員に見せられます。
サイトの共有・招待画面。ワークスペースのメンバーに公開できる
環境変数・シークレットキーを保存できる
「Settings」を開くと、環境変数やシークレットキーをここに保存しておけます。
Settings画面。環境変数やシークレットキー（APIキーなど）をサイト単位で保存できる
たとえばAIの機能を組み込んだアプリを作るときに、OpenAIやClaudeのAPIキーをここに入れておく、という使い方ができます。URL・名前・機能スイッチといった項目もあるので、Web制作やWebアプリを触っている人ならイメージしやすいはずです。後半でこのキー管理を実際に使います。
きれいに仕上げるコツ：デザイン系プラグインを組み合わせる
ここが一番のコツです。ざっくり「Webサイト作りたい」とだけ頼むと、デザインが微妙になりがち。何回か試した結論として、デザイン系のプラグインを併用するのが一番うまくいきました。
おすすめの流れはこうです。
先に画像生成でデザインのイメージを固める
その画像を再現するようにコーディング（実装）させる
画像生成の時点でデザインがはっきりするので、それをもとにSiteプラグインがコーディングしてくれて、仕上がりが安定します。手元にデザイン案や参考画像があるなら、それを添付して伝えるだけでもいい。画像の添付にも対応しています。
Creative Productionプラグインで企画から任せる
Web制作って、構成・言い回し・どんな画像を使うかといったクリエイティブのディレクションが必要になります。ここが素人には難しいところ。Codexにはそれ用の「Creative Production」というプラグインがあって、構成から考えてくれます。
プラグインをインストールしてセットしたうえで、「企画を考えて進めて」と頼むと、依頼内容に対してディレクションを進めてくれます。面白いのが、向こうから質問してくれること。
Creative Productionプラグインが「軸」「ビジュアル言語」「避ける表現」などを選択肢タグで提示してくれる画面。選んで「この方向で制作」を押すと進む
「軸は何にしますか」「ビジュアル言語は何にしますか」「避ける表現はどうしますか」といった質問に答えていくと、それに沿ってデザインや画像を作りながら進めてくれます。答えていく形式なので、デザインに自信がなくても企画が固まっていきます。
【実演2】既存サイトをリニューアルしてみる
試しに、既存サイトのリニューアルもやってみました。「このサイトをリニューアルして」と元のページを渡せば、中身を理解したうえで、どんな企画・どんな構成で進めるかを考えてから作ってくれます。
約30分かけて、こんなLPが完成しました。
リニューアルで完成したLP。「学ぶAIから、使うAIへ。」のヒーローが組まれている
⚠️ 正直ベースのコスト注意 ここは包み隠さず書きます。この1回の指示で、クレジットを600ほど・日本円でだいたい1万円くらい使いました。推論の高さを「非常に高い」にして投げた結果なので、設定にもよります。推論を「高い」や「中」に下げればもう少し抑えられるはず。仕上がりは悪くないものの、コスト感はかなりシビアです。気軽に連発するものではない、と思っておいたほうがいいです。
独自ドメインで運用したいなら Vercel に移す
Codex Sitesで公開されるドメインは 〇〇.chatgpt-team.site。自社サイトをこのドメインで運用することはまずないですよね。現状のCodex Sitesでは独自ドメインの設定ができないので、自前のドメインで運用したいなら別の環境に移します。
ここで使うのが、Codexの「Vercel」プラグイン。「Vercel側に公開して」と頼むだけで、サクッとデプロイしてくれます。
Vercelにデプロイ後のプロジェクト画面。〇〇.vercel.app のURLで公開されている
〇〇.vercel.app のURLで公開できたら、あとはVercelのプロジェクトにドメインをセットするだけ。ドメインはVercel上から購入してそのまま割り当てられます。
Vercelのドメイン検索。$9.99程度から独自ドメインを取得してセットできる（取得するTLDによって価格は変わる）
年9ドルくらいから取れるので、Codexでサクッと作ったサイトをVercelに移して独自ドメインで運用、という流れが組めます。
補足：SaaS is dead? Web制作に特化したAIエージェントサービスはこれまでもありました。それがCodex（やClaude Code）でもできるようになった、という話です。「SaaS is dead」と言われる流れに、この領域も入ってくるのかもしれません。
【実演3】APIキーを使うWebアプリを作る
最後に、前半で触れたシークレットキーを実際に使います。APIキーを入れ込んだWebアプリを作って、OpenAIのサーバー上に公開してみました。
お題は「Webで遊べる漢字の書き順学習アプリ」。小学1〜6年生向けで、SVGで書き順をなぞって覚えられる、シンプルなUIのゲームです。アシスト役に「Game Studio」「Product Design」といったプラグインも組み合わせました。
このアプリはOpenAI（またはClaude）のAPIキーがないと動きません。そこで、Settingsのシークレットキーにキーを登録します。
Settingsのシークレットセクションに OPENAI_API_KEY という名前でAPIキーを登録したところ
完成したのが「漢字ストローク道場」。正解すると、書き順をなぞるSVGアニメーションを毎回AIが生成してくれます。
完成した漢字書き順アプリ「漢字ストローク道場」。問題に答えながら、書き順を選択式で確認して練習できる
漢字を選んで、書き順を見ながら練習できる形になっています。
「川」の書き順を練習する画面。ステージやレベルもあり、今すぐ遊べる
クオリティはまだ伸びしろがありますが、こういうWebアプリを作って、裏で動く設定（APIキーなど）はCodex側で管理する、という運用ができるのは面白いところ。ローカルやテスト環境でアプリを動かす用途なら十分ありです。
まとめ：今すぐおすすめ？
正直に言うと、今すぐ全力でおすすめ、とまではいかないというのが結論です。
Siteプラグイン単体が特別すごい、というほどではない
ただし「Codex上にすぐプレビューを公開できる」点に価値を感じる人にはかなり良い
現状は独自ドメインの設定ができない（Vercelなどへの移行が必要）
コストがそれなりにかかる（設定次第だが、油断すると一気に消費する）
独自ドメインの設定までCodex内で完結するようになれば、いよいよ「Web制作AIエージェント」としての本領が出てくるはず。運用部分まで見据えられて初めて実用、という段階だと感じました。とはいえ、OpenAIもそこは理解しているはずなので、近いうちに対応してくる可能性は高い。期待して待ちたい機能です。
最後まで読んで頂きありがとうございます。KEITOのメルマガは皆さまの支援によって成り立っています。今後の配信も見逃さないために無料購読をお願いいたします。また有料購読でのご支援もご検討ください。