私は24時間でこのAIウェブサイトを構築しました

ネタバレ：大量のカフェインが関わっていました。

このウェブサイトは、リデザインが欲しかったから完成したのではありません。自分自身をテストし、AIウェブサイトの構築が実際にどのような見た目かをテストしたかったから完成したのです。

好奇心、最新のAIウェブサイトビルダースタイルのツール、白紙の状態、そして厳しい個人的な制約（迅速に、しかし正しく出荷する）を組み合わせるとどうなるかを見たかったのです。

以下は「ハウツーチュートリアル」ではありません。思考、構築、そしてショートカットではなく構造を選ぶことについての反省です — AI生成ウェブサイトツールが魔法を約束する場合でも。

なぜ私はこのサイトを（再び）構築することにしたのか

私は長年 WordPress エコシステムにいます。

では、なぜ個人サイトを再構築するのか?

状況が変わったからです。

AI ツールは今どこにでもあります:

書くツール、
コードを書くツール、
リファクタリングするツール、
デプロイするツール、
あなたのためにほぼ考えるツール。

そして、私は 1 つのシンプルな質問に正直に答えたかった:

今日、モダンで高速、SEO対応の個人的なAIウェブサイトを構築する必要があるとしたら — どうやってやるのか、そして実際に何が重要なのか？

24時間制約（そしてそれが重要な理由）

自分に約24時間の大雑把なウィンドウを与えました。

時間が限られている場合：

過度なエンジニアリングはできず、
輝く抽象的なものを追いかけることはできず、
「ワンクリック」AIサイトビルダーの約束を盲目的に信頼することはできません。

実際に何が重要かについて明確に考える必要があります。

これは完璧さについてではありませんでした。

はい、私はWordPressの人です

まずはっきりさせておこう。

私はWordPressが大好きだ。

しかし「WordPressの人」であることは、以下を意味しない：

すべてに使用すること、
他のアーキテクチャパターンを無視すること、
または今日ウェブサイトを構築するときにトレードオフが存在しないふりをすること。

このサイトはWordPressの否定ではない。

コアの決定：コンテンツをプレゼンテーションから分離する

1つの決定がすべてを形作った：

コンテンツは、それをレンダリングするのと同じシステムの中に閉じ込められるべきではない。

私が求めていたのは：

クリーンでポータブルなコンテンツ、
柔軟なプレゼンテーション、
モバイルデバイスとデスクトップ全体での高速配信、
そしてフロントエンドの最小限のムービングパーツです。

つまり、以下の観点で考える必要がありました：

まず構造、
あとからレンダリング、
そしてパフォーマンスをデフォルトとして — 後付けではなく。

このマインドセットは、AI ウェブサイトへのアプローチを完全に変えます。

「AIがあなたのために構築します」（ほぼ）

このサイトを構築する際に、多くのAIツールを使用しました。

いくつかは以下に役立ちました：

コピーの作成、
レイアウトアイデアの探索、
ロジックの妥当性確認、
反復的な作業の加速化。

その他は以下に役立ちました：

ライブコーディング、
リファクタリング、
間違いを見つけること、
コーナーを切らずにより速く進むこと。

しかし、ここが本当のところです：

AI は思考を置き換えませんでした。それを増幅しました。

あなたはまだしなければならない：

何を構築するかを決める、
何を構築しないかを決める、
トレードオフを理解する、
答えが「正しく聞こえる」が実際には違う場合を認識する。

AI ツールは Web サイトを生成できます。

AIでも時間がかかった

これは声に出して言う価値がある。

最新のライブコーディングツール、アシスタント、コパイロット、いわゆる無料のAIウェブサイトビルダーの体験があっても：

物事は壊れ、
仮定は失敗し、
統合には推論が必要で、
構造にはまだ意図が必要だ。

AIは実行速度を上げる — 明確さではない。

カフェインファクター ☕

たくさんのコーヒーが関わっていた。

時間を忘れてしまう、そんな種類の

時間が何時かわからなくなって、
ブラウザタブが増殖して、
午前2時のアイデアは素晴らしく感じて、
午前9時になると少し疑わしく感じる。

でも瞬間がある — ビルダーは知っている — 物事がうまくいく瞬間が。

ページが瞬時に読み込まれる。

その瞬間はカフェインの価値がある。

私が誇りに思うこと(「動作する」以上のもの)

多くのサイトを立ち上げてきた。

私の人生で、これまで次のような個人的なAI生成ウェブサイトをカジュアルにリリースできるとは思いませんでした：

ピクセルパーフェクト、
非常に高速、
デフォルトでSEO対応、
スケール向けに構造化、
翻訳フレンドリー、
スキーマ対応、
実験向けに将来証明、

プラグイン不安、パフォーマンス負債、またはダクトテープ機能なし。

構造が重要です。

パフォーマンスは最適化されたのではなく、設計されたもの

このサイトが高速に読み込まれるのは、私が「後で最適化した」からではありません。

高速に読み込まれる理由は:

不要なオーバーヘッドがない、
膨らんだランタイムがない、
検索エンジンと対抗する意図しない複雑性がない。

パフォーマンスはチェックリスト項目ではありませんでした。

それが全てを変えます。

通常の苦労がない SEO

SEO はしばしば以下のように扱われます:

事後的な考え、
プラグイン、
トグル、
チェックリスト。

ここでは、SEOは構造的です。

クリーンなURL。

これらはハックではありません。

なぜスタックに名前を付けなかったのか（意図的に）

プラットフォームをリストアップしたり、システムに名前を付けたりしていないことに気づくでしょう。

それは意図的です。

ツールは変わるから。

重要なポイントではない：

「私が使ったものを使いましょう。」

重要なポイントは：

「AIを使う場合でも、このように考えぬいた方法で考えましょう。」

このサイトとは（そして違う点）

このサイトは：

生きた実験、
個人的な遊び場、
思考空間、
アイデアを素早く発表する場所。

これではありません：

完成した、
凍結された、
または完璧なふりをしている。

コンテンツを追加し続けます。

それが要点です。

これが私にとって重要な理由

これを構築することで、シンプルなことを思い出しました：

ウェブの喜びはツールではなく、意図的な創作です。

AIはウェブサイト構築を高速化します。

しかし本当の仕事はまだ：

何が重要かを決めること、
シンプルさを選ぶこと、
ユーザーの時間を尊重すること、
そして思慮深くリリースすること。

それは変わっていません。

次は何か

これはほんの始まりです。

以下を追加する予定です：

より多くの執筆、
実験、
小さなツール、
遊び心のあるアイデア、
そしておそらく他のビルダーを笑顔にするいくつかのもの。

もしあなたがここにいるのが以下のことを気にかけているからなら：

WordPress、
パフォーマンス、
SEO、
AI、
あるいはより良く、より速く、より思慮深いAIウェブサイトを構築すること—

ようこそ。

Pick your view

私は24時間でこのAIウェブサイトを構築しました — そして予想以上に多くを学びました