2018-02-23

このサイトのデザインを改修した

いままでBulmaというCSSフレームワークを使ってこのサイトを作っていたが、実際Bulmaみたいな重厚なものは不要だなと思っていた。タブやらフォームやらは不要なので、もうちょっとミニマルなものにしたいと考えた。

選んだのはMilligramというフレームワーク。これまで何度かつかったことはあったけど、結局後から必要になるUIパーツを考えると最初から入ってたほうが楽だということになり、最近はずっとBulmaを使っていた。Milligramは標準的な色合いが結構気持ち悪く、鮮やかな紫というおよそ多くのサイトにはマッチしないであろう色味になってしまう。しかし同リポジトリにならんでmilligram-themesというリポジトリがあり、色を変えるためのスタイルシートがいくつか制作されていた。

面倒に思いながらもnormalize.cssを読み込み、milligramを読み込み、色を青っぽくするためのテーマを読み込み、highlight.js用のテーマを読み込み、最後に自分でカスタムするためのCSSファイルを読み込む。うーん。結構おおい。Bulmaは最初からCSSリセット(あるいはノーマライズ)機能を取り込んでいるため、CDNから一行読み込むだけで済んだ。さすがにCSSだけで5つ読み込むのはだるいのでStylusのビルド時にimportするようにした。main.cssだけで済むので精神にやさしい。

なんにせよそれなりに軽いサイトになった。bulmaのデフォルトのcontent表示と私の好みのスタイリングはあまり合致してなかったので、こういうミニマルなフレームワークはこういうシンプルなブログにぴったりだ。

デザインにもちょっとずつ変更を加えた。文字の大きさやタイトル文の位置、いままでヘッダーのすぐ下にあった薄い線を取り除いてみたり、フッターのコピーライトをCC-BYに変更したり…。

私のブログの一番の読者は私なので、私が一番心地よく感じる見た目を追求していかないとならない。私は私のブログをしょっちゅう見返している。面白いなぁと私ひとりが楽しめればそれでいいのだ。