サイトのデザインがまとまってきた

サイトのデザインが気に入らなくて何回もこねくり回していた話。こういうことを言うとまたリビルドが始まる

自分のサイトだしそれなりにいいデザインにしたい。色々な変更をしたかった。一番気にしたのは「個人サイトっぽくある」こと。ホームページビルダーだったり、HTMLの直打ちだったりするような、原始的な親しみやすいデザインであってほしい。最近のサイトはなんだかおしゃれな雰囲気があるけど、メニューがうにょーんと伸びてきたり、DHTML(死語)覚えたてのようなゴテゴテしたようなのは嫌だなあと考えていた

シンプルな設計をしよう。2カラムにして最新記事一覧とプロフィールを置いておくのはちょっと冗長だ。なにか見たくなったらサイトトップに行ってもらえば十分だ。そうすると2カラムは要らないから、1カラムにしてしまおう。レスポンシブデザインでも1カラムは人気だ

2カラムはユーザ体験も悪そうだなと感じる。著者について知りたいなあと思っても、すでにサイドバーは記事の上の方に存在している。そうでなくとも、スクロールに追随した結果サイドバーの下の方が表示されている。著者について知るためには「上に戻る」ボタンを押すことになる。それで出てくるのは簡易版プロフィールで、細いサイドバーに目を凝らすことになる。じゃあ「上に戻る」ボタンのかわりにトップに飛んだらよい。ページを簡略化すると低速なスマホでも1秒くらいで表示されるからそこまで悪くないだろう

それで、個別のページもそんなに必要ない。個人サイトといえば「一つの縦長のページに日記と拍手返事を詰め込む」だ。じゃあ読んでもらいたいもののうち短くなりそうなものは全部いれてしまおう。「私について」「このサイトについて」「連絡先」はトップページに押し込めてしまった。ただそれだけだと長大なページをたぐるのが可哀想なので、トップページの目次をつくって置いておいた

個別のページもそこまで情報を込めなくて良い。むしろ情報を置かないほうがすぐユーザをトップページに案内できる。よって、パンくずリストを一つ置いておくだけにした。ただしサイトトップのリンクもパンくずリストの中に入っている。

ここまできて設計からデザインの話になる。できれば原始的な方法で作れるようなシンプルなものがよい。最悪でもテーブルレイアウトでなんとかなるようなやつ。でもそうするとスマホで読みづらくなってしまうので、できるだけスペースを取ったりジャンプ率を高めたりする。こうしてだいたい今のレイアウトになった。あとはサイト全体を暗めにして、完成だ


楽しいけどおわりが見えないし疲れたからしばらくこのままでいいかな……