summaryrefslogtreecommitdiff
path: root/posts/redesign-www-tojo-tokyo.md
blob: 8f7e57183e465feaa4df44ff6d209551d8c24df0 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
title: ウェブサイトの見た目を改善しました
id: redesign-www-tojo-tokyo
date: 2020-05-08 06:45
updated: 2020-05-08 12:51
description: ダークテーマよりも普通の方がよかった
---

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

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

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

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

## 文字を大きくしました

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

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

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

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

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

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

## 感想

だいぶ見た目が良くなったと思います。
このウェブサイトは[バージョン管理](https://gitlab.com/tojoqk/www-tojo-tokyo)されているので、
暇な人は過去のコミットに戻ってサイトをビルドしてみると良いと思います。

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

``` shell
guix environment -l environment.scm -- make serve
```

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