ウェブサイトの見た目を改善しました

目次

投稿日: 2020-05-08 金
Web

1. ダークテーマよりも普通の方がよかった

いままでこのウェブサイトはダークテーマを意識していて、黒い背景に白い文字を使用していました。 しかし、この Web で記事を閲覧するよりも GitLab で直接元の org-mode の文書を読んだ方が視認性が良いことにショックを受け、 根本的に見た目を改善する必要があることに気づきました。

ダークテーマはターミナルや Emacs で文書を書いているときには良いのですが、Web ではあまり良くないようです。 視認性の良い Web ページをダークテーマで作成するのは難しいと思います。

基本的に配色のこだわりを捨てて Web ブラウザのデフォルトに任せることにしました。 すると、悲しいことにその方がずっと見やすくてより良いものになりました……。

2. 文字を大きくしました

このサイトの文字のサイズは小さすぎました。 全体的に文字が小さくて自分で記事を読み返すたびに、 「この Web サイトの作者はどうしてこの文字サイズでよいと思ったんだろう」と疑問に思ったほどです。

なので、デフォルトでは少し大きめにしました。 かなり読みやすくなったと思います。

3. コードが読みやすくなりました

コードの装飾をちょっと良くしました。 ソースコードが良い感じに表示されるようになっています。 例として階乗の定義を示します。

(define (factorial n)
  (if (zero? n)
      1
      (* n (factorial (- n 1)))))

また、文中のコードの表示も改善しました。 「 (factorial 10) の値は 3628800 です」というように良い感じにコードがハイライトされるようになりました。

4. 感想

だいぶ見た目が良くなったと思います。 このウェブサイトはバージョン管理されているので、 暇な人は過去のコミットに戻ってサイトをビルドしてみると良いと思います。

Guix を使用していれば、ビルド環境の構築をしなくても下記のコマンドで一瞬です。

guix environment -l environment.scm -- make serve

特に環境を準備していなくてもこのコマンドだけで 8080 ポートを待ち受けるサーバーを起動することができます。 やはり Guix は最高ですね。

著者: Masaya Tojo

Mastodon: @tojoqk

RSS を購読する

トップページに戻る