【個人開発】年間1,600円の音楽サイトが「SPAのSEO泥沼」から生還し、AdSense再申請に至るまでの全記録
個人でAI生成BGMの配布サイト（Neura Music Archive）を開発・運営しています。
最新のモダンな技術を組み合わせて、「サクサク動く最高のUX」と「極限まで安い維持費」を両立させたサイトを作ったつもりが、検索エンジンやAdSense審査の仕様と激しく衝突し、深い泥沼にハマることになりました。
本記事は、サイトの低コストな裏側から始まり、SPA（シングルページアプリケーション）特有のSEOの壁、理不尽なAdSense審査落ち、そして独自の「SPA×MPAハイブリッド構成」に辿り着くまでの全記録です。
1. 唯一の固定費「年間1,600円」。維持費ほぼゼロの仕組み
インターネット上で大量の音楽ファイルを配布するサイトとなれば、高額なサーバー代やデータ転送料がかかると思われがちですが、当サイトの純粋な固定費は年間約1,600円（月換算約130円）しかかかっていません。
この費用の正体は、「neura-music.com」という独自のカスタムドメインの維持費です。
サイト自体は「Cloudflare Pages」という静的ホスティングを利用してサーバー代を0円に抑え、楽曲ファイルは「Cloudflare R2」というクラウドストレージに保管しています。R2は「データのダウンロードに伴う転送の手数料（Egress料金）が完全無料」という破格の仕様のため、どれだけダウンロードされても追加課金に怯える必要がありません。
ただし、R2のファイルを外部公開するにはカスタムドメインの紐付けが必須条件となるため、この1,600円だけはシステム上どうしても削れない「唯一の必要経費」となっています。
この「圧倒的な維持の軽さ」は、個人開発を長く続けるための最高のライフハックです。しかし、このモダンで軽量な構成（SPA）を選択したことが、のちの悲劇を生むことになります。
2. 検索エンジンには見えない。SPAが招いた「インデックス未登録」の悲劇
サイトは画面遷移なしでサクサクと音楽が切り替わるSPAとして構築しました。しかし、自信満々でSearch Console（サチコ）にサイトマップを送信しても、インデックス数が「1（トップページのみ）」からピクリとも動きません。
SPAはJavaScriptで動的に画面を描画するため、Googleのクローラーから見れば「どのURLを開いても中身が空っぽ（または全部同じ）」に見えてしまうのです。
慌てて各ページにクリーンなURL（パス形式）を振り、R2に置いていたツール類をサイト内に統合するなど泥臭い対策を打ちましたが、一度「中身が薄いサイト」と判定されたクローラーの機嫌はなかなか直りませんでした。
3. AdSenseの理不尽な審査落ちと「自作CMS」の誕生
インデックスに苦戦する中、追い打ちをかけるようにGoogle AdSenseから審査落ちの通知が届きました。理由はお決まりの「有用性の低いコンテンツ」。クローラーがSPAの中身を正しく読めていない以上、当然の結果です。
「GoogleはJSも評価する」という建前を信じた私が甘かった。「タブレットで綺麗にまとめた宿題を出したら、採点できないから紙に書いてこいと怒られた」ような理不尽さです。
彼らの仕様に合わせるには、純粋な静的HTML（MPA）という名の“紙の束”を用意してやるしかありません。とはいえ、全ページを手作業で書き直すのは絶対に嫌だったので、私は「SPAのデータを読み込んで、静的HTML（MPA）を一括生成する専用のローカルCMS」を急遽、丸1日かけて自作しました。
AdSenseの審査を通すためだけに、本来必要なかった変換マシンを作らされた本末転倒な展開です。
4. 辿り着いた真理。検索エンジンには“外観”を、ユーザーには“店内”を
自作CMSでMPAを量産する中で、ようやくSPAとSEOの関係性の本質に辿り着きました。これまでは「SPAをサイトの本体」として検索エンジンに扱わせようとしていましたが、これが間違いだったのです。
結論はきわめてシンプルです。
「検索エンジンには“MPAを本体”だと思わせて、実際のユーザーには“SPAを本体”として使ってもらう。」
- MPAのCanonical（正規URL）は自分自身（
articles/〜.html）を指す。 - SPAのCanonicalは、対応する静的なMPAのURLを指す。
- サイトマップ（
sitemap.xml）にはMPAのURLだけを記載する。
クローラーにはCMSで作った中身の詰まった「外観（MPA）」を見せて評価させ、検索から訪れた人間は、裏側で違和感なく「店内（SPA）」のリッチな体験へと誘導する。
この明確な役割分担による二重構造を作って初めて、SPA構成における正常なSEOサイクルが機能し始めます。
5. 完璧なMPAに潜む罠。無言のサチコと世話焼きなBing先生
しかし、泥沼はまだ終わりません。
CMSで完璧なMPAを出力したつもりでしたが、サチコでは「クロール済み - インデックス未登録」が連発。しかもサチコは「URL は Google に登録できます」と緑のチェックマークを出して微笑むだけで、エラーや原因を一切教えてくれません。登録リクエストは通るのに、メタタグが抜けているためSEO的には無価値、という最悪のエアポケットに陥っていました。
そんなある日、「検索エンジンってGoogle一つじゃないよな」とふと思い出し、Bing版サチコである「Bing Webmaster Tools」に登録してみたのです。すると、サイトスキャン機能を開いた瞬間、画面が真っ赤なエラーで埋め尽くされました。
CMSのテンプレートを設計する際、一番大事な <head> 内の基本タグを一式入れ忘れるという初歩的な大ポカでした。
サチコが笑顔でスルーした致命的な欠陥を、Bing先生は手取り足取り、具体的に赤ペンを入れて教えてくれたのです。慌ててテンプレートを修正し、ページを再生成してアップロードし直しました。
まとめ：インデックスの進行と、AdSenseへの再挑戦
Bing先生のおかげで基本タグの抜けを修正し、正しい「SPA×MPAのハイブリッド構成」をデプロイしてから数日。
長らく沈黙していたサチコでも、ようやく「インデックス登録済み」のグラフが目に見えて右肩上がりに動き始めました。検索エンジンが正しくサイトの価値を認識し始めた証拠です。
維持費ほぼゼロを目指した気軽なスタートから始まり、モダン技術の落とし穴にハマり、自作CMSを叩き台から作り、Bingに救われるという長い長い回り道をしました。しかし、これでようやくスタートラインです。
インデックスの順調な進行を見届けた本日、因縁のGoogle AdSenseへ再申請のボタンを押しました。
結果はまだ出ていませんが、次こそはクローラー先生に文句を言わせない「完璧な紙の宿題」になっているはずです。吉報（あるいは新たな泥沼）があれば、またこのブログで報告したいと思います。