読者です 読者をやめる 読者になる 読者になる

Blogのデザインをリニューアル

CSS

死にかけたテストがやっと終わったので、前々から気になってた、デザインをいじってみました。

きっかけ

最初は
http://d.hatena.ne.jp/themesample?breeze
こいつを使ってました。かっこ(・ ∀・)イイ!!

でも

  • 字が小さい
  • サイドバーが右にあるので横に長いソースコード貼り付けるとかぶる

という不満点があったので、サイドバーを左にして字を少し大きくして使ってました。


wordpressとかでよく見るサイドバーなしの字がでかいやつがカッコいいなーとおもってたので、そんなカンジにしてみました。

特徴

body{
  font-size: 130%;
  line-height: 175%;
}

.hatena-body{
  margin-top: 0px;
  margin-right: 70px;
  margin-bottom: 0;
  margin-left: 80px;
  padding: 0;
}
  • フォントサイズ130% wwww

やたら字を小さくする風潮に逆らいたい年頃です。本来は各ブラウザのデフォルトが一番いいみたいです。良い子は100%にしましょうね。

  • 行間、0.75文字分

日本語組版では行間は0.5〜1.0文字分くらいが良いと言われてます。書籍では普通の行間ですが、webページとしてはやや広すぎなきがしないでもない。もっと文章をいっぱいぎっしり書くとしっくり来るかも。

  • サイドバーなし

1 column とも言うみたいです。あれだよね、サイドバーないとオサレ感ただよいやすいよね。

  • 可変幅

近年のモニタは横が広くなってるというのに、その中に細長ーく佇んでるのって不自然だよね。携帯かっつーの。でも横が広すぎると読み辛いのは確か、その辺のバランスは難しい。かのGoogle先生の検索結果だって固定幅だしね



こんな感じ。まあそこそこ気に入ってるけど、なんか気づいたらアドバイスとかくれるとうれしいです