WordPressをやめて、静的サイトエンジンを自作した話——ひとぅブログ、リニューアルまでの記録

リニューアル前後のひとぅブログ — 左がこれまでのデザイン、右がリニューアル後のトップ

この記事は、ひとぅブログに新しく設けた Deep の1本目です。

Deepは、短くまとめて終わり、ではなく、深く考察したことを書き記す場です。1本あたりだいたい1万文字前後を目安に、腰を据えて書いていくつもりです。リニューアル後の運営は、これまでの「ブログ」一本ではなく、ブログ／メモ／Deep の三部構成で進めていきます。

その最初の題材として、サイトそのものの話を選びました。2007年からWordPressで続けてきた場所を、自作の静的サイトエンジンに載せ替え、記事の正本をMarkdownにした。何を残し、何を手放し、これからどう書くサイトにしたのか。成功談というより、切り替えの記録として残します。

ブログ／メモ／Deep——三部構成で運営する

いちばん先に伝えておきたいのが、これからの書き分けです。同じ「投稿」に全部を押し込めるのではなく、役割の違う三つの棚を並べます。

ブログ

レビュー、新製品の情報、日々の出来事など、いち早く伝えたいことを置く場所です。これまでどおり、速さや軽さを大事にします。ガジェットを試した所感、サービスの変化、暮らしの中で見つけた便利さ——「今、読んでもらう価値がある」ものを、これまで近いテンションで書いていきます。

メモ

気になったことを調べた記録・メモです。結論を大きく振りかぶらなくてもいい。調べた過程、参照した情報、自分用の整理が、あとから見返せる形で残っていれば十分、という棚です。短くてよい。だからこそ、逃しにくくしたい。

Deep

深く考察したこと、方針、長く残したい考えの筋道を書く場です。文字数の目安は1万文字前後。この記事がその試作でもあり、最初の本編でもあります。すぐに消費される情報より、あとから読み返したときに「なぜそう考えたか」が残っている文章を、ここに積み上げていきたいです。

三部構成にしたのは、読者向けのラベルというより、書く側の自分がいちばん迷わなくなるためでもあります。今日はレビューでいいのか、調べもののメモでいいのか、もう一段掘るべき話なのか。棚が分かれているだけで、着手の判断が楽になります。トップも、その三つの気配が分かるマガジン型にしました。速さの違う文章が同居しているサイトだ、と先に伝わるようにしたかったからです。

三つは対立する箱ではなく、つながる棚でもあります。メモで調べたことが、あとからDeepの考察の材料になる。ブログで触れた製品の話を、必要ならDeepで長く掘る。Deepで決めた方針が、ブログやメモの書き方に戻ってくる。役割は分けつつ、ひとぅブログという一つの場所の中で循環させる——それが、今回いちばんしっくりきた運営のイメージです。

境界は、最初から完璧に引けるとは思っていません。迷ったら、まずは短い棚（メモやブログ）に置く。どうしても残したい筋道が出てきたらDeepへ移す、くらいのゆるさで始めます。大切なのは、全部を同じ密度で書かないこと。同じ密度で書こうとすると、どれも中途半端になりやすい、というのが長いあいだの実感でした。

なぜ、作り直したのか

長いあいだWordPressは便利でした。記事も資産として積み上がり、公開投稿は4000本を超えています。一方で、年数が経つほど次のような引っかかりも増えてきました。

運用が重い: 管理画面、プラグイン、テーマ、PHP、キャッシュ……「書く」以外のメンテが積み上がる
依存が増える: テーマやプラグインの仕様に、自分のブログの形が引っ張られる
古い記事の扱い: 今も読む価値があるものと、役目を終えたものが同じ棚に並んでいる
書く場所が一本道: レビューも調べものも長文考察も、同じ「投稿」に押し込めている違和感

「全部捨てて別ブログにする」のではなく、ひとぅブログという名前とURLの連続性は守りつつ、中身の作り方を変える。それが今回の芯です。三部構成も、その延長線上にあります。器を変えるだけでなく、何をどの棚に置くかまで含めて作り直した、という感覚です。

特にURLは、長いあいだ積み上げてきた入口です。/0記事ID のような形も含めて、できる限り壊したくない。見た目や中身の整理は進めても、ブックマークや検索で覚えている道筋は残す。その前提があるからこそ、別ドメインの新規スタートではなく、同じ場所の載せ替えを選びました。

自作に振ったのも同じ理由です。HugoやJekyllのような道具は成熟していますが、このサイト固有の都合——既存URL、WordPress時代の本文HTMLや装飾、ブログ／Deep／メモの分割、終了記事の410、隣接ディレクトリを巻き込まない切替——を素直に通すなら、小さな自前エンジンのほうが扱いやすかった。大層なフレームワークではなく、PHPのCLIで「読む → 整形 → HTMLを書く → 配置する」を積み上げています。

目指した運用のかたち

最初に決めたのは、流行を追うことより、この先も自分が続けられる形にすることでした。

正本はファイル: 記事はYAML＋Markdown。管理画面のDBが唯一の正解、にしない
公開は静的HTML: ビルドして配置する。表示のたびにPHPやDBを叩かない
外部サービスは最小限: Google AdSense、Google Analytics、問い合わせなどのフォーム。それ以外は足さない
書く場所はエディタ: Cursorで直して、CLIでビルド・確認
三部構成: ブログ／メモ／Deepで、文章の密度と役割を分ける

公開面も、あえて薄くしました。コメントや会員、サーバー側の問い合わせフォームは持たない。必要な連絡はGoogleフォームへ。AdSense ＋ Analytics ＋フォームで足りる構成に閉じる。便利さを足すより、単純さのほうを取りました。

Deepを「だいたい1万文字」と決めたのも、同じ単純さの延長です。短くまとめすぎない。かといって、無限に長くしない。読者にも書き手にも、見通しのつく長さを一つの目安にする。ブログとメモが軽さを担うぶん、Deepは深さを担う。三つの棚が揃って、はじめてサイト全体のバランスが取れる、と考えています。

1万文字は、正確にはノルマというより長さの目安です。足りなければ足すし、主題が早く閉じるなら無理に水増ししない。ただ、「Deepに置くなら、それなりに掘る」という自己制約にはしたい。短評で終わる話はブログへ、調べの途中経過はメモへ。Deepには、結論までの道筋が残る文章を置きたい、という線引きです。

表示が、はっきり速くなった

静的HTMLにした効果でいちばん体感しやすいのは、表示速度です。ページを出すたびにWordPressとデータベースを起こす必要がない。ビルド済みのHTMLを返すだけなので、体感がかなり変わります。いわゆる「爆速」と言ってよいくらい、待ち時間が短くなりました。

速さは技術自慢というより、読者体験そのものです。記事を開いた瞬間に本文へ入れるかどうか。特にDeepのような長文では、表示の引っかかりが読むリズムを壊しやすい。広告や計測を残しつつも、表示の土台はできるだけ軽くしておく——その判断と、静的化はよく噛み合いました。

ブログやメモでも速さは効きますが、Deepではより重要です。1万文字前後を読んでもらう前提なら、最初の1秒でストレスを感じさせないこと自体が、記事の一部だと思っています。中身を厚くするなら、器の側も軽くする。両方そろって、はじめて「深く書く棚」として成立する、という感覚です。

広告を減らし、コンテンツを前に出す

シンプルさへのこだわりは、収益面にも出ています。

実は2026年1月に、すでに広告を減らしていました。その結果、広告収益は前月比でおよそ60%減になりました。それでも、「見てもらってなんぼ」だと思っています。画面を広告で埋めれば数字は取りやすい一方で、読みにくさも増える。長いあいだ続く個人サイトなら、後者の損のほうが大きく見えるようになっていました。

今回のリニューアルでは、その方針をさらに進め、広告をいっそう減らしています。数字は、たぶんもう一段下がる可能性があります。それでも気にしていません。守りたいのは収益の最大化ではなく、コンテンツと読者体験です。開いた瞬間に何が目に入るか。最後まで読めるか。また来たくなるか。そこを先に置くサイトにしたい、というのが今回の本音です。

三部構成ともつながります。ブログのレビュー、メモの調べもの、Deepの考察——どれも、広告より本文が先に来るべきです。特にDeepは長文なので、途中で視線を奪われるほど損が大きい。減らした広告枠は、そのぶん本文と余白に還しています。

WordPressから持ってきたもの、置いていったもの

移行でいちばん悩んだのは、「全部残すか、絞るか」でした。

公開投稿は4000本超。全部を持っていくこともできたかもしれません。でも、検索にもサイトの印象にも効くのは今も役に立つページのほうで、役目を終えた記事を大量に抱えること自体がコストになります。

そこで、ざっくり次のルールで残す記事を決めました。

2023年以降の記事は基本すべて残す
それ以前は、一定以上の閲覧があったものを残す
検索からクリックが付いているものは、閲覧が少なくても例外で残す
どうしても残したい初期の記事（たとえば再出発まわり）は手で残す

結果として、残す記事はおよそ1400本弱、移行しない記事はおよそ3000本弱になりました。「削った」というより、いまのサイトの顔として見せる棚を、現実的な量に戻した、に近いです。

選定の途中でいちばん迷ったのは、境界線上の記事です。閲覧は少ないけれど思い出があるもの。数字はあるけれど今読むと薄いもの。完全に機械だけで切ると偏るので、ルールは機械で広く拾いつつ、初期の再出発まわりのようにどうしても残したいものだけ手で戻す二段構えにしました。

検索から一度でもクリックが付いているページを例外で残したのも、同じ発想です。入口の気配があるものを先に落とすのは、整理というより損に近い。守りたい連続性は、トップの印象だけでなく、そういう一本一本の道にもあります。

残さないURLは、いきなり消えたように見せず、意図して公開を終えた（HTTP 410）と分かるようにしています。「なかったことにする」のではなく、「役目を終えた」と区切るイメージです。404と410では、読者にも検索エンジンにも伝わるニュアンスが違います。

これまでの投稿の多くは、これからもブログの棚に置かれます。Deepとメモは、これから積み上げる新しい棚です。過去を全部Deepに載せ替える、という発想はしていません。役割が違うものは、これからの執筆で分けていく。リニューアルは、過去の総入れ替えではなく、これから書く回路の更新でもあります。

実際、過去記事の中にも「今ならメモに置く」「今ならDeepまで掘る」ものがあるかもしれません。それでも、過去を遡って全部仕切り直すのは今回の目的ではない。まず器を用意し、これから書く分から三部構成を生きた運用にする。必要なら、あとから個別に移す判断をすればよい、くらいの温度感で進めています。

いまの更新の流れ

運用は、だいたい次のとおりです。

Markdownを書く・直す（画像は記事用フォルダへ）
build で静的HTMLを生成
ステージで確認し、問題なければ本番へ反映

下書きは status: draft にしておけばビルド対象外。公開するときだけ published にする。管理画面の「公開」ボタンの代わりが、ファイルの一行です。ブログでもメモでもDeepでも、この流れは共通です。違うのは、置く棚と、書くときの密度だけです。

差分ビルドも入れています。変わった記事を中心に更新し、テンプレートを大きく触ったときだけ全件を作り直す。この使い分けがあるだけで、「ちょっと直したい」の心理的コストが下がります。Deepのような長文ほど、公開前に何度か直したくなるので、軽い再ビルドができるのは実利が大きいです。

ステージングを先に用意したこと

今回いちばん効いた準備のひとつが、ステージング環境を先に用意したことです。本番に出す前に、あらかじめ挙動を確認できる場所をつくり、公開の流れそのものを先に通しておきました。

デザインの調整、記事の選定ルール、410の見え方、画像やカードの表示、トップの三部構成の見え方——迷いやすい話を、本番の顔を変えずに試せる。ヘッダーの並びを変えただけで全ページに反映されない、といった静的サイトあるあるも、ステージで一度見れば気づける。

同じサーバー上には、隣接する別コンテンツもあります。リニューアルの勢いで巻き込まないために、切替も「丸ごと入れ替え」ではなく、必要な範囲だけを差す前提で進めました。派手さはありませんが、長く続けてきた場所を壊さないための手順としては、ここが本丸でした。

本番公開用のビルドと配置の経路も、切替前に用意しています。確認用で育てたものを、そのまま本番へ載せられる形にしておく。事前に環境を組んでおいたおかげで、「作りながら本番を触る」不安をかなり減らせました。Deepの原稿も、同じ確認の習慣のうえで出していくつもりです。

見た目と情報設計で気にしたこと

中身の引っ越しだけでなく、読みものとしての再設計も同時に進めました。

緑は基調に、ただし淡く: 昔の濃い緑は少しきつかったので、長い文章でも疲れにくいトーンへ
トップはマガジン型: 全記事の無限リストではなく、「いま読みたい／Deep／メモ／探す」
スマホの余白: タイトルや見出しは詰めて、本文は読みやすい余白を残す
画像は引き伸ばさない: 小さい画像まで画面幅いっぱいにしない
古い装飾の再現: チェックリストや○×、マーカー下線など、本文に残っていたクラスをCSSで受け止める

トップをマガジン型にしたのは、三部構成を表に出すためでもあります。新しい順に全部並べるとにぎやかですが、「いま何を読めばいいサイトなのか」がぼやけやすい。ブログの速報性、メモの軽さ、Deepの深さ。それぞれの入口が見えるほうが、長いサイトには合うと思いました。

色についても、ブランドの緑は残しつつ濃度を落としました。読みものが主体のサイトでは、装飾が勝つより、本文が先に目に入るほうがよい。派手な刷新より、長く付き合うためのトーンダウンです。Deepの長文を読んでも疲れにくいことを、デザイン側でも意識しています。

読者側で、いちばん変わってほしいこと

裏側の話ばかりだと関係が薄いので、表側で変わってほしいことを書いておきます。

第一に、迷子になりにくいこと。役目を終えた古い着地を減らし、残すページはきちんと読める状態にする。リンク切れは分かるようにする。トップから、ブログ／メモ／Deepへ辿れるようにする。

第二に、読み心地。速さ、余白、見出し、画像の扱い、スマホでの詰まり方。派手な演出より、普通に最後まで読めること。広告を減らしたのも、ここに含まれます。

第三に、方針が見えること。何でもかんでも同じ「投稿」に積むサイトから、密度の違う文章が並ぶサイトへ。「これはレビュー」「これは調べもの」「これは考察」が、棚の分け方自体で伝わるようにしたいです。

技術の載せ替えは手段です。目的は、読んでくれる人にとっての「ここは続く場所だ」という感触を、きちんと作り直すことです。

Markdown運用で楽になったこと

切り替えてみて、続けやすいと感じている点があります。

差分が見える: どこを直したかがファイルとして残る
環境が軽い: 表示用に管理画面を起こさなくてよい
文章の種類を分けられる: ブログ／メモ／Deepを、同じテンションで無理に一本化しなくてよい
画像の置き場所がはっきりする: 記事ごとのフォルダに置き、相対パスで指す

特にDeepでは、長い原稿を何度も直す前提になります。ファイルとして残る差分は、自分の思考の履歴でもある。メモのように短く足す文章と、Deepのように長く育てる文章で、同じ正本形式を使えるのも都合がよいです。

逆に、自分でやらなければいけないことも増えます。ビルドを忘れると反映されない。フォームは外部サービス頼み。それでも、いまの自分のブログの使い方には、そちらのトレードオフのほうが合っていました。

古い記事とリンクの手入れ

引っ越しで地味に時間を取ったのが、本文まわりの掃除です。

昔の記事には、用のないトラッキング画像や空リンク、役割を終えた埋め込みが混ざっています。正本を手で全部直すのは現実的ではないので、ビルド時に機械的に落とせるものは落とす方針にしました。表示用HTMLだけをきれいにし、正本は必要以上にいじらない。

外部リンクも、切れているものは分かるようにする仕組みを入れています。「明らかに死んでいるもの」と「判断が必要なもの」を分けておけるだけで、公開面の印象はかなり違います。目次も、長い記事では自動で足すようにしました。Deepのような長文では特に、見出しの見通しがあるだけで読みやすさが変わります。この記事にも同じ仕組みが乗ります。

静的化したからメンテがなくなるのではなく、メンテの種類が変わる。その認識は、早めに持っておいたほうがよさそうです。

よく自分に聞いたこと

作業中、何度も自分に問い直しました。

「記事数が減って、サイトの評価が落ちないか？」 ページ数そのものより、残したページの質と一貫性のほうが大事だと考えました。検索から来ている気配があるURLは例外で残し、そうでない古く薄いものは410で区切る。数字を減らすこと自体が目的ではなく、残す側に集中できる状態をつくることが目的でした。

「広告を減らして大丈夫か？」 1月の時点ですでに大きく減り、今回さらに減らす。数字は下がるかもしれない。それでも、見てもらってなんぼ。コンテンツと読者体験を先に置く、という判断は変えません。

「三部構成は読者に伝わるか？」 最初は馴染みが薄いかもしれません。だからこそ、トップで棚を見せ、Deepの1本目で方針を文章として残すことにしました。ラベルより、実際に並ぶ記事の質で分かってもらうしかない、とも思っています。

「自作エンジンは続けられるのか？」 巨大CMSをメンテし続けるより、自分のブログ専用の小さな道具のほうが把握しやすい、というのが今の感触です。ただし、記録（このDeepのような文章）と、ステージで確認してから出す習慣は必須だと思っています。

「読者にとって何が変わるのか？」 読みやすさと探しやすさが上がり、古い迷子ページが減ること。裏側の技術は、できるだけ表に出さない。出すべきは「これからどう書くサイトなのか」という方針のほうです。

これからも直していくこと

リニューアルは「終わり」ではなく、書き続けるための土台ができた、という感覚に近いです。

細かい見た目、導線、記事の手入れはこれからも続きます。うまくいったこと・詰まったことは、追記や別のDeepで足していくかもしれません。派手な発表より、静かに差し替えて、読み続けられる状態を守る。その優先順位は、これからも同じだと思います。

三部構成も、運用しながら輪郭がはっきりしていくはずです。ブログに置くべきか、メモで足りるか、Deepまで掘るか。実際に書き分けてみて、はじめて分かることがある。ルールを先に固めすぎず、棚は用意したうえで、中身で育てていくつもりです。

この記事のあとに、自分がやりたいこと

エンジンと引っ越しに時間を使ったぶん、本丸はやはり書くことです。

ブログ: レビュー、新製品の情報など、これまでどおり軽やかに
メモ: 気になったことを調べた記録を、逃さず残す
Deep: 深く考察したことを、1万文字前後で書き記す

Deepの1本目が「道具と方針の話」なのは地味かもしれません。でも、三部構成で運営していく宣言でもあり、次に続く長文のための前置きでもあります。ガジェットや暮らし、ネットの変化についても、ここには短評では収まらないものを置いていきたいです。レビューの延長でもなく、メモの寄せ集めでもない、自分の考え方が残る文章——それをDeepの基準にします。

もし「自分のブログも同じことをすべきか」と考え始めた人がいたら、結論を急がなくていい、とも言っておきたいです。向く条件と、向かない条件がある。大切なのは流行の構成ではなく、自分が続けられる回路を持っているかだと思います。私の場合は、それがファイルと静的公開と、ブログ／メモ／Deepという三つの棚でした。

まとめ

ひとぅブログのリニューアルは、デザインの塗り替えというより、ブログの持ち方そのものの更新です。

WordPress依存を下げ、静的HTMLで公開する（表示はかなり速くなった）
記事の正本をMarkdown（ファイル）にする
公開面は AdSense ＋ Analytics ＋フォームでシンプルに閉じる
広告は1月に減らした流れをさらに進め、コンテンツと読者体験を先に置く
ブログ／メモ／Deep の三部構成で運営する
Deepは、深く考察したことをおよそ1万文字で書く場
残す記事は、新しさ・閲覧・検索・思い入れで選ぶ
ステージングで確認し、本番公開の経路も事前に用意する
役目を終えたURLは、消すのではなく410で区切る

Deepの1本目が「ツールの話」で始まるのは地味かもしれません。でも、2007年から続いてきた場所を、次の十年に渡すための土台の話でもあります。

長いあいだ読んでくれている人にも、これから来てくれる人にも、「ここはこういう方針で動いている」と伝えられる一文になればうれしいです。次は、道具ではなく中身の話を、このDeepの棚に積み上げていきます。

（続く、かもしれない——いや、これからも続けるつもりです）