概要
CodexのようなAIエージェントを使うと、Webサイト制作の進め方はかなり変わります。従来は、ワイヤーフレーム作成、Figmaなどでのデザイン作成、HTML / CSSコーディング、ブラウザ確認、修正指示、再調整という流れが一般的でした。
しかし現在は、文章をもとにHTML化し、実際の画面を見ながらCSSを調整し、そのままGitHubへcommit / pushしてCloudflare Pagesへ反映する流れまで、会話ベースで進められます。
つまりWeb制作の一部は、人間が細かく作業するものから、人間が判断し、AIが実装するものへ変わり始めています。
Codexでできるようになったこと
実際にCodexを使うと、かなり多くの作業を任せられます。HTML記事ページの作成、CSS修正、タイトルサイズの調整、行間や段落間の調整、日付位置の調整、カラム位置の調整、スマホ表示の調整などです。
さらに、パンくずリスト、関連記事、meta description、canonical、sitemap.xml、内部リンク切れ確認、Git commit、GitHub pushまで、実務上必要な作業も一連の流れとして進められます。
従来であれば制作会社やコーダーに依頼していた細かい調整も、会話しながら進められる点が大きな変化です。特にコラムサイトや静的サイトのように構造がある程度決まっているサイトでは、かなり相性が良いと感じます。
- HTML記事ページの作成
- CSSの修正
- タイトルサイズの調整
- 行間・段落間の調整
- 日付位置の調整
- カラム位置の調整
- スマホ表示の調整
- パンくずリストの追加
- 関連記事の追加
- meta description / canonical の追加
- sitemap.xml の更新
- 内部リンク切れ確認
- Git commit / GitHub push
Figmaを挟まない制作フロー
一般的なWeb制作では、Figmaなどのデザインツールを使って画面設計を行い、その後にHTML / CSSへ落とし込む流れが多くあります。もちろん、ブランドサイトや大型サイトでは今でも重要な工程です。
一方で、コラムサイトや小規模なLPでは、必ずしも毎回Figmaを挟む必要はないと感じます。文章を書き、HTML化し、実画面で確認し、CSSを調整し、GitHubへpushしてCloudflare Pagesで公開する。この流れなら、実装と確認の距離が非常に短くなります。
これはデザインカンプを見ているのではなく、実際に公開されるHTML / CSSを直接見ながら調整している状態です。そのため、細かな違和感をその場で修正しやすく、記事サイトの量産とはかなり相性が良い制作フローです。
レイアウト調整は会話で進められる
Codexが便利なのは、感覚的な指示をCSSへ落とし込める点です。例えば、タイトルが大きすぎる、行間が広すぎる、日付を右詰めにしたい、本文の左ラインを揃えたい、概要までの余白を少し広げたい、といった指示でも実際のCSS修正へ進められます。
これは従来のAIチャットとはかなり違います。単に「CSSはこう書きます」と説明するだけではなく、実際のファイルを読み、修正し、差分を確認し、GitHubへ反映できます。
特に今回のように、本番サイトの実装ログをもとに記事を書く場合、作業そのものが一次情報になります。どの設定値を変えたのか、なぜ変えたのか、どこを人間が判断したのかが、そのまま有益なコンテンツになります。
- タイトルが大きすぎる
- 行間が広すぎる
- 日付を右詰めにしたい
- 本文の左ラインを揃えたい
- 概要までの余白を少し広げたい
- スマホでは文字を小さくしたい
- 空白行ではなくCSSで余白を制御したい
ただし最終判断は人間
一方で、Codexにすべてを任せれば良いわけではありません。最終的に、見やすいか、違和感がないか、ブランドに合っているか、読者にとって自然か、問い合わせ導線が分かりやすいかを判断するのは人間です。
AIは修正できます。しかし、この見た目で公開してよいかを判断する主体は人間側にあります。これは外注しても本質的には同じです。
ホームページ業者に依頼しても、最終確認を行い、修正指示を出すのは発注者側です。AI時代に重要になるのは、作業を全部自分で行うことではなく、何を直したいのかを判断し、言語化できることです。
外注しても確認作業は残る
ホームページ制作を外注すれば、すべて任せられると思われがちです。しかし実際には、原稿確認、デザイン確認、スマホ表示確認、文言修正、導線確認、問い合わせフォーム確認、公開前チェックなどは発注者側にも残ります。
制作会社の人の目が入ることには価値があります。ただし、それでも最終的に「これで公開してよいか」を判断するのは発注者です。
つまり、外注する場合でも、発注者側のWebリテラシーは重要です。逆に言えば、発注者側のリテラシーが上がれば、外注しなくても対応できる範囲はかなり広がります。
ユーザーのスキルが上がると外注範囲は減る
CodexのようなAIエージェントがあると、HTMLやCSSを完全に書けなくても、かなりの作業を進められるようになります。重要なのは、すべてのコードを理解することではありません。
むしろ、何が気になるのか、どこを直したいのか、どんな見え方が自然なのか、どの導線を重視するのか、どこまでを公開品質とするのかを判断できることです。
これから重要になるのは、コードを書く力だけではなく、AIに正しく修正指示を出す力です。この力があると、簡単なコラムサイト、LP、静的サイト、社内向けページなどは、かなり内製しやすくなります。
ホームページ業者が不要になるのか
では、ホームページ業者は不要になるのでしょうか。個人的には、すべて不要になるわけではないと思います。ブランド設計、大規模サイト設計、複雑なシステム連携、写真撮影、本格的なコピーライティング、広告戦略、法務確認、セキュリティ設計などは、専門家の価値が残ります。
一方で、小規模なコラムサイト、静的なLP、会社案内ページ、SEO用の記事ページ、シンプルなサービス紹介ページ、Googleフォームへの問い合わせ導線のような範囲では、AIを活用した内製の可能性はかなり高まっています。
ホームページ業者が完全に不要になるというより、業者に依頼する範囲が狭くなるという表現の方が近いと感じます。
AI時代の制作は人間の判断力が重要になる
AIが実装を支援できるようになると、人間の役割は減るのではなく、変わります。これまでは、手を動かす、コードを書く、調べる、修正することに多くの時間がかかっていました。
しかし今後は、何を作るか、誰に見せるか、どの導線を重視するか、どの品質で公開するか、どこをAIに任せるか、どこを人間が確認するかの判断が重要になります。
Codexは、実装担当としては非常に優秀です。しかし、サイトの目的や方向性を決めるのは人間です。人間が判断し、AIが実装する。この役割分担が、AI時代のWeb制作ではかなり現実的になってきています。
公開可能な実装ログをナレッジ化する
企業でAI活用を考えるとき、機密情報をAIに入れてよいのか、学習されないのか、情報流出しないのかという不安は当然あります。ここは慎重に設計すべき領域です。
一方で、公開済みサイトの改善ログや、外に出して問題ないCSS調整、GitHub / Cloudflare Pages運用、ブラウザ確認の流れなどは、公開可能な実務ナレッジとして活用できます。
つまり、機密情報をAIへ投げるのではなく、公開してよい業務ログをAIで整理し、人間がレビューして記事化するという使い方です。これは、AI時代の企業メディア運用としてかなり有効な方法だと感じます。
Time合同会社での考え方
Time合同会社では、CodexのようなAIエージェントを、単なるコード生成ツールではなく、実務の制作パートナーとして捉えています。特に、コラムサイト運用、Cloudflare Pages、GitHub管理、静的サイト制作、SEO構造設計、内部リンク設計、HTML / CSS調整のような領域では、AIとの相性が非常に良いと感じています。
重要なのは、AIに丸投げすることではありません。人間が見て、判断し、修正指示を出し、AIが実装する。この役割分担によって、小規模でもかなり高い速度でWebサイトを改善できます。
まとめ
Codexを使うことで、Webレイアウト調整はかなり楽になります。タイトルサイズ、行間、段落間、カラム位置、日付位置、レスポンシブ対応、内部リンク確認、GitHubへのpushまで、会話ベースで進められるようになっています。
一方で、最終判断は人間です。見やすいか、自然か、読者に伝わるか、ブランドに合っているか。そこを判断する力は、外注しても内製しても必要になります。
これからのホームページ制作では、業者に丸投げするのではなく、人間が判断し、AIが実装するというスタイルが広がっていく可能性があります。ユーザー側のWebリテラシーが上がれば、制作会社に依頼しなくても対応できる範囲は大きく広がります。Codexは、その変化をかなり実感できるツールの一つです。