Claude Fable 5(AI)に関西の光回線LPを作ってもらった話|CSSだけで動く本格LPが“ほぼ一発”で完成

光回線

「関西の光回線、各社バラバラで比較しづらいなぁ」——そんな悩みから、AI(Claude・モデルは話題のFable 5)に横並び比較のLP(ランディングページ)を作ってもらいました。結論から言うと、CSSだけで動く本格的な比較LPが“ほぼ一発”で完成。あまりに驚いたので、その制作の様子を運営者目線でそのまま残しておきます。

この記事の結論

  • WordPressの固定ページに、JavaScriptを一切使わずCSSだけで動く光回線の横並LPを、WordPressの中で使い方を検証しながらが完成させた
  • LPも一人暮らし向け記事もほぼ修正なしの一発完成。完成度の高さに驚いた

きっかけ:関西の光回線は「横並び」で見たかった

光回線って、各社が自社サイトでそれぞれ違う見せ方をしているので、いざ比べようとすると本当にややこしいんです。月額の表示条件もキャンペーンもバラバラ。「関西で使える6社を、同じ土俵で一目で比べられる表があったら便利やのに」と前から思っていました。

そこでClaude Fable5に、こう依頼しました。「このブログのLPを、各社の横並び比較を入れて作成してください。PCとスマホに対応してください。不明な点は1つずつ質問してください。」と。

感心した点①:LPの「格納先」を聞いてくれた

まず良かったのが、いきなり作り始めず、ちゃんと確認してくれたこと。返ってきた質問は「LPをどこに作成しますか?」。選択肢の中に「WordPressの固定ページ」があったので、それを選びました。

感心した点②:CSSだけで“動く”LPを作ってしまう

出来上がったLPは、タブの切り替えや並べ替えが動く本格的なもの。普通こういうのはJavaScriptで作りますが、このLPはJavaScriptを一切使わず、CSSだけで動いています。これには素直に「CSSだけでここまでできるんや」と感心しました。

なぜCSSだけなのかというと、このサイトにはセキュリティ対策(WAF)が入っていて、ページ内にJavaScriptを書き込もうとすると弾かれてしまうから。その制約を理解した上で、制約の中で動く作り方を選んでくれたわけです。条件を把握して最適解を出してくる、この判断力がすごい。

ひとつだけ注意点:このLPは仕組みが繊細なので、人間がWordPressの編集画面で手を加えると動かなくなります。少しの変更でも、Claude Codeに依頼して直してもらう運用にしています。裏を返せば、それくらい緻密に組まれているということです。

ちょっと笑った一幕:WAFテストの残骸と「セキュリティ上、当然」

WAF(セキュリティ)に弾かれない書き方を探るために、Fabel5は「WAFテスト」という固定ページを何度も作って検証していました。その結果、テスト用の固定ページが20個ほど残骸として残っています(下書きなので表には出ていません)。

Fabel5は途中でそれを片付けようと一括削除を試みたようなのですが、まとめて削除はできませんでした。そのとき「セキュリティ上、一括削除ができないのは当然ですね」といった趣旨のメッセージを一瞬表示していて、思わずクスッとしました。次の画像はWordPress上で実験をして使い方を探っていた残骸です。

WAFテストという名前の下書き固定ページが大量に残っている管理画面
▲ これが実際に残った「WAFテスト」の下書きページたち。input単体・スタイル・プレーン・前半4/4・後半・等号のみ……と、検証の試行錯誤の跡がそのまま名前になっている。

感心した点③:一発完成の完成度

何より驚いたのが完成度です。LPは1回の生成で、ほとんど修正していません。1回でこのレベルのものが出てくるのかと。

同じ流れで作ってもらった「関西の一人暮らしにおすすめの光回線」記事も、ほぼ修正なしでした。構成も料金の見せ方も、最初からきれいにまとまっていて、手直しがほとんど要らなかったんです。

作業の進め方も几帳面でした。やることをToDoリストとして管理し、終わったタスクから取り消し線で消し込んでいくので、いま何が終わって何が残っているのかが一目でわかります。下の画面は、「関西一人暮らし向けの新規記事を作成(下書き Post 1132)」のタスクを完了して消し込んだ跡です。長時間、自律的に進行できるようになった理由はここにあるのかも知れません。

ToDoリストで関西一人暮らし向け記事作成のタスクが取り消し線で消し込まれた画面
▲ ToDoリストの「関西一人暮らし向け新規記事を作成(下書き Post 1132)」が完了し、取り消し線で消し込まれている。進捗が見えるので、任せていても安心だった。

感心した点④:スマホへの“心遣い”

細かい話ですが、ここが一番グッときました。横並びの比較表はスマホだと画面に収まりきりません。そこでLPには、「スマホは右にスクロールできます」というひとことの案内が添えられていたのです。

言われなければ「表が切れてる?」と戸惑う人もいるはず。そこを先回りして案内する——この読む人の戸惑いを想像した心遣いこそ、AIが単に「作る」のではなく、こちらの意図や、その先にいる読者のことまで汲んでくれている証拠だと感じました。

おまけ:あれだけ感心したFable 5が、突然使えなくなった

最後に、ちょっとした後日談を。これだけ感心していたFable 5ですが、作業中にモデルをあらためてFable 5へ切り替えようとしたところ、いきなり使えなくなりました。表示されたのが、次のメッセージです。

/model claude-fable-5[1m]
〜 Switched to claude-fable-5 〜● There’s an issue with the selected model (claude-fable-5). It may not exist or you may not have access to it.

「えっ、さっきまであれだけ凄かったのに!?」と、思わず二度見しました。輸出管理指令が発令され、使えなくなりました——これも一つのリアルな体験として残しておきます。

とはいえ、ここまでのLPと記事を一発で仕上げてくれた実力は本物。使えるうちに、その仕事ぶりをしっかり見せてもらいました。

まとめ:「意図を汲んだ完成度」がすごかった

今回の制作を通じていちばん印象に残ったのは、「こちらの意図を汲んだ完成度」でした。1つずつ確認し、制約を理解し、読者の戸惑いまで先回りする。そしてほぼ一発で仕上げてくる完成度。話題のFable 5、噂どおりの実力でした。

百聞は一見にしかず。実際に出来上がったLPと記事は、こちらから見られます。スマホでもサクサク動くので、ぜひ触ってみてください。

▶ Fable5が実際に作ったLPを見る

関西の光回線 横並び比較【2026年6月】|6社の料金・速度が一目でわかる
CSSだけで動く、6社まるごと横並びの比較LPです。タブ切り替え・並べ替えが効きます。

▶ Fable5が作った記事を見る

関西の一人暮らしにおすすめのインターネット回線【2026年最新】|光回線の最安は月2,980円〜
こちらもほぼ修正なしの一発完成。一人暮らし・2人暮らし向けに最安回線をまとめています。

【免責事項】

  • 本記事に掲載している料金・サービス内容は、2026年6月時点の各社公式サイトをもとに作成しています。見誤った数値を表記している場合があります。料金プランやキャンペーン内容は予告なく変更される場合があります。契約前に必ず各社公式サイトにてご確認ください。
  • 本記事に含まれる費用の試算は、工事費無料キャンペーン適用・契約期間中の料金変更なし・各種割引フル適用等を前提とした概算値です。概算値の条件の漏れや数値に誤りがある場合もございます。お客さまの利用状況・居住地域・契約内容によっても実際の費用は異なります。
  • 本記事はアフィリエイト広告(成果報酬型広告)を含んでいます。記事内のリンクから申し込みいただいた場合、当サイトに報酬が発生することがあります。ただし、掲載内容は各社からの依頼によるものではなく、独自の調査・比較に基づいています。(ご参考になった方は記事内のリンクから申し込みをお願いいたします。)
  • 本記事の情報をもとに生じたいかなる損害・トラブルについても、当サイトは一切の責任を負いかねます。サービスの最終的なご判断はご自身にてお願いいたします。

コメント

タイトルとURLをコピーしました
📊 関西の光回線6社を比較する