古事連記帖

趣味のこと、技術的なこと、適当につらつら書きます。

AncientChronicleのサイトを新しくしました

細々と活動してたりしなかったりする同人サークル「AncientChronicle」のウェブサイトを新しくしました。

ac.udonge.net

大きなデザイン変更はしていませんが、時代にあわせてアクセスカウンターを消したり、Silverlightで動いていた試聴モジュールを削除したり(代替品は用意できてないですが)しました。
本来ならモバイル端末に最適化できるともっとよさそうなんですが、ウェブページつくるの久しぶりすぎるのでいったん保留です。近いうちに簡易的に対応すると思います。

裏側事情(?)

新しくする前のウェブサイトは、もともと Microsoft Expression Web にあわせて作っていたものでしたが、Expression Web が終わってからは大きくページの更新することがしんどくなってきて、
作品紹介の更新もおろそかになれば、トップページにとりあえず書いて終わりみたいなことをしていたらひどい有様になってしまいまして。

いつかは新しくして管理しやすくしないとなあと思っていたところでしたが、AncientChronicle のサイトをはじめ自分が持っているウェブサイトをホストしている CORESERVER の値上げが発表されたのを機に、
持っているウェブサイトのホスト先の移動、管理の効率化を進めることにしました。

一枚ペラなウェブサイトである「うどんげ.ねっと」と、先日作成した「aynv.jp」については、既に対応が完了していて、ホスト先は Cloudflare Pages で、ウェブサイトは静的サイトジェネレーター「Statiq」を使っています。
www.cloudflare.com
www.statiq.dev

複数ページがいくつもある構成で Statiq を使うのは初めてで、作品紹介画面とお知らせ画面、2種類の構成をうまく1つのテンプレートに混ぜるかとかは結構苦労しました。
作品紹介画面は収録曲リストだけ Markdown に記載して、あとの情報は Statiq でいう Front Matter に全部寄せて、ページ内ヘッダー・フッターの cshtml を分割して作ってそこから参照するようにしています。
例えばこんな感じで↓

このページ全体を cshtml にしてもよかったんですが、それぞれで構成を組めるので楽っちゃ楽になる反面、数が増えてきたときの管理が面倒になってくるので、この構成にしました*1

ホスト先を Cloudflare Pages にしたことでまた利点ができて、GitHub に push してしまえばあとは勝手に展開される上、git 管理になるので更新履歴がコミット単位で管理できるのが非常に楽になりました。
Cloudflare Pages では Statiq の実行がそのままではできないので、手元では GitHub Actions で Statiq の実行を任せて、結果を特定のブランチに出力して Cloudflare Pages にフックしてコピーしてもらう手段をとりました。

これで管理が楽になった…はずです。
CMSだと管理がおろそかになった瞬間乗っ取られる可能性が高まるので、静的ページとしてアップロードするだけでいい静的サイトジェネレーターが、年に数回更新するかどうかのサイトにはちょうど良いのかもしれません。

*1:Markdown だけしかいけないと思ってて、あとから cshtml もいけるのを知ったのは内緒