「連絡は当日中を目安に返信します。」
AIに作らせたポートフォリオに、この一文が入っていました。自分は一度も、そんなことを言っていません。
夜勤が入る週は、まず守れません。
今回やろうとしていたのは、同じ指示文を2つのAIに渡して、出てきたHTMLのフォントを比べることでした。ところが、もっと気になる違いが出てきました。
比べたのはこの2つです。どちらもパソコンの中のファイルを読める道具です。 使ったツールとモデルを並べました。
| ツール | 選んだモデル | |
|---|---|---|
| A | Codexアプリ | GPT-6 Astra(高) |
| B | Claude Code | Opus 5 |
きっかけは、Geminiが毎朝まとめて置いてくれるネタです。その中にこの動画の要約がありました。
GPT-6 Astra FINALLY Kills AI Website Slop(粗悪なAI量産サイトの終焉と新世代Web制作)
いかにもAIが作ったような画一的でチープなWebサイト(AI Slop)を完全に過去のものにする。
人間側が「デザイン指示の審美眼」を持つことで、他と被らないサイトを数分で立ち上げる。
要約を読んだだけでは分かりません。同じ指示文を2つに渡して、出てきたHTMLを数えました。
この記事で分かること
- Codexアプリ(GPT-6 Astra)と Claude Code(Opus 5)に、まったく同じ指示文でポートフォリオHTMLを作らせた結果
- 判定を4項目、作る前に決めてから測った話(Webフォントの追加は 0対0 でした)
- 測るつもりのなかった場所で差がついたこと
- 同じ資料を使える状態で、片方はリンクを拾い、片方は本人が言っていない約束を足したという話
仮説 ── 「審美眼のある指示ならSlopは消える」を測る
元の主張は「人間側が審美眼を持てば」です。なら、審美眼のある指示を出せば消えるはず。
問題は、消えたかどうかを何で見るかです。「なんとなく安っぽい」では測れません。
自分が真っ先に思ったのはフォントでした。AIが作ったページを見て最初に気づくのは、たいていWebフォントが1つも足されていないことだからです。
前提 ── 判定は4つ。作る前に確定させた
作らせたのは、ライティング案件の応募に使うポートフォリオ1枚。HTML1ファイルで完結させる条件です。
判定はこの4つにしました。
| # | 見るところ | 標準のまま | 選んでいる |
|---|---|---|---|
| 1 | font-family に何を書いているか | システムフォント/Helvetica/Arial のみ | 具体名を意図して指定 |
| 2 | Webフォントの読み込み | なし | <link> で読み込んでいる |
| 3 | 見出しと本文でフォントを変えているか | 同じ | 変えている |
| 4 | font-weight / letter-spacing / line-height | 触っていない | 触っている |
ここで設計の矛盾に気づきました。 指示文でフォントを指定したら、言われたとおりにするだけで測れません。
なので、こう分けました。
配色・構成・情報の並び → 細かく指示する
フォント → 指定しない
「作り込んだ指示を出しても、フォントは標準のまま手を抜くか」 を見るためです。
実際に渡した指示のうち、デザイン部分はこれだけ書きました。
- 配色:紺(#19448e)を基調に、生成りの背景、差し色に落ち着いた緑。派手にしない
- 紫のグラデーションは使わない
- 構成:①名乗りと一言 ②できること ③実績(数字を前に出す) ④連絡先の順
- 実績は「52本」「3か月」「13,383ファイル」のように数字を大きく見せる
- 全体を中央揃えで揃えない。左揃えと余白でリズムをつける
- 意味のないアイコンを並べない
- スマートフォンで見ても崩れないようにする
- 1ファイルで完結させる(CSSは
<style>内に。外部JSは使わない)
載せる材料は全部渡して、取捨選択はAIに任せました。
均衡 ── Webフォントの追加は、0対0だった
出てきたHTMLを開いて数えた結果です。
| # | 項目 | A:Astra | B:Claude Code |
|---|---|---|---|
| 1 | font-family に書いてあるもの | システム系+Helvetica Neue/Arial | システム系のみ |
| 2 | Webフォントの読み込み | 0 | 0 |
| 3 | 見出しと本文でフォントを変えているか | 同じ(数字部分だけ切替) | 同じ |
| 4 | font-weight / letter-spacing / line-height | 9 / 11 / 9 | 6 / 7 / 6 |
Webフォントの追加は、どちらもゼロでした。
Claude Codeは font-family に Noto Sans JP を並べていますが、読み込んでいないので端末に入っていなければ効きません。 実質はシステムフォントです。
ただし、太さや字間、行間は両方とも調整しています。 Astraは数字のところだけ Helvetica Neue / Arial に切り替えてもいました。触っていないわけではありません。
自分が期待していたのは、標準から一歩離れたフォント選びでした。それはありませんでした。
「AI Slopを完全に過去のものにする」——Webフォントを足すという意味では、まだです。
圏外 ── 測るつもりのなかった場所で差がついた
Webフォントの追加は0対0でした。差がついたのは、数えるつもりのなかったところです。
| A:Astra | B:Claude Code | |
|---|---|---|
@media print(A4指定の印刷用スタイル) | あり | なし |
aria- 属性 | 9件 | 0件 |
@media ルールの数 | 4件(画面幅2・動き軽減・印刷) | 1件 |
| 画面幅のブレークポイント | 2段(760px / 360px) | 1段(700px) |
| 記事への個別リンク | 3本 | 0本 |
noindex, nofollow | なし | あり |
| 文字数 | 12,978 | 9,099 |
| ファイルサイズ | 15,237バイト | 11,631バイト |
Astraは印刷を想定していました。 @page{size:A4;margin:12mm} から始まって、印刷時だけ文字サイズと余白を組み直しています。ポートフォリオはPDFで送ることがあるので、これは効きます。prefers-reduced-motion や focus-visible にも触れていました。
(@media が4件あるうち、画面幅で切り替えているのは2段です。残りは印刷用と、動きを減らす設定用でした。)
Claude Codeは noindex, nofollow を入れていました。 ポートフォリオを置いても検索に載らないようにする配慮です。これはこれで実務的です。
指示文には、印刷のこともnoindexのことも書いていません。両方とも、自分が指定しなかった場所で判断していました。
越境 ── 二つとも、指示の外へ出た
ここからが本題です。
指示文に書いたURLは、ブログのトップページ1本だけです。 記事の個別URLは渡していません。
それなのに Astraは実在する記事URLを3本、正確に載せていました。
kazu-asset-life.com/meta-ai-typeless-aqua-voice-comparison/
kazu-asset-life.com/linkstation-data-recovery-ubuntu/
kazu-asset-life.com/housing-loan-prepayment-junban-50dai/
3本とも生きています。どこから拾ったのかを確かめました。
作業の記録を開くと、「ブラウザーを使用しました」と出ていました。何を開いたかまでは表示されません。ただ、渡したのはトップページのURLだけで、出てきたのは個別記事のURL3本です。
題材そのものは、こちらが指示文に書いていました。「音声入力AI3種の比較」「NAS救出」「繰上返済のExcel」は材料として渡しています。渡していなかったのはURLの部分だけです。
一方のClaude Codeは、記事の一覧ファイルが置いてあるフォルダの中で動いていました。それでも、出てきたポートフォリオには個別記事へのリンクが1本もありません。
片方の出力にはリンクがあり、片方にはなかった。
虚実 ── 出た先に、何があったか
どちらも指示文に無いことを書き足しています。違ったのは、足したものが実在したかどうかでした。
Astraが足したもの。
記事URL3本のほかに、音声入力の比較記事についてこう書いていました。
公開翌日の普段使いで印象が変わった点も追記しました
これも渡していません。でも実在します。 その追記は前日に自分で入れたものです。前日の追記まで、ポートフォリオに反映していました。
Claude Codeが足したもの。
指示文に無い記述は、いくつもありました。数えようとして、やめました。 言い回しや見出しの付け方まで含めると、どこで線を引くか決められなかったからです。
そこで、応募先への約束や、できることの範囲にあたるものだけを見ました。
確かめたら事実だったものがあります。下の2つは、渡した材料に括弧が足されていたものです。
| 書いてあったこと | 足された部分 | 確かめた結果 |
|---|---|---|
| 稼働:平日夜と土日が中心です | 全部 | ✅ 合っている |
| note 26本(有料記事を含む) | 括弧の中だけ | ✅ 合っている |
| Instagram 12回投稿・リール制作1本(企画から画像制作まで担当) | 括弧の中だけ | ✅ 合っている |
そして、自分が言った覚えのないものがありました。
| 書いてあったこと | 実際 |
|---|---|
| 1本3,000〜8,000字が中心です | 言っていない |
| 連絡は当日中を目安に返信します | 言っていない |
| 納品形式(Markdown/Word/Googleドキュメント/WordPress直接入稿)はご指定に合わせます | 言っていない |
| ExcelやAIツールでの資料作成も可能です | 言っていない |
| 執筆から入稿・見出し構成・公開前の確認までを一人で完結できます | 言っていない |
「連絡は当日中を目安に返信します」が、いちばん危ないと思いました。
夜勤が入る週は、まず守れません。応募書類にこれが書いてあったら、そのまま約束になります。
申告 ── 聞いてきたのは、合っていたほうだった
Claude Codeは納品のときに3点を自己申告してきました。そのうち1つが、稼働時間についての確認でした。
「稼働:平日夜と土日が中心」の1行は仮です。実際と違えば直します(本人が言っていないことなので、ここだけ確認させてください)
自分で書いて、自分で「これは仮です」と言ってきた。ここは正直だと思いました。
ただ、聞いてきた稼働時間は合っていました。 当日中の返信など、言った覚えのないほうについては、何も聞かれていません。
しかもHTMLを見ると、この2つは同じ1行でした。
平日夜と土日が中心です。連絡は当日中を目安に返信します。
前半だけを「仮です」と言ってきて、後半には触れていません。
そして Astraは、何も聞いてきませんでした。
速いほうがいいのか、聞いてくるほうがいいのか。今回でどちらとも言えなくなりました。
Astraは手を止めません。自分で調べて、そのまま出してくる。今回は全部合っていました。でも合っているかどうかは、こちらが全部確かめるしかない。
Claude Codeは聞いてきます。でも、聞いてきたのは事実だった項目で、気になったほうはそのままでした。「聞いてくるから安心」とは言えなかったわけです。
3か月以上、毎日Claude Codeを動かしてきました。今日はじめて別のAIと並べてみて、同じ指示で動き方がここまで違うのを見た感じです。
今回分かったこと
- Webフォントの追加は0対0だった。 太さ・字間・行間は両方とも調整しています。標準から一歩離れたフォント選びが無かった、という結果です
- 差がついたのは、測るつもりのなかった場所。印刷用スタイル、
aria-、noindexは、どれも指示していません - 同じ資料を使える状態で、片方の出力にはリンクがあり、片方にはなかった
- どちらも指示文に無いことを足した。違ったのは、足したものが実在したかどうかです
- 自己申告だけでは拾い切れませんでした。 当日中の返信など、言った覚えのない記述は、こちらが読んで気づいたものです
- 「資料を見に行っていいか」を指示文に書かなかったのは、こちらの書き漏らしです。ただ、書いていない約束を足していい理由には、なりません
指示文をどう書くかは、まだ考えます。
ただ、今回いちばん効いたのは、出てきたものを最後まで読んだことでした。
読まなければ、そのまま応募書類になっていました。


コメント