はてなブログでブログの目次、字の種類、大きさ、行の間隔、カスタマイズをしたよ

こんにちは！久々の更新となりました。最近、ブログのデザイン強化月間として動いておりました。自分の備忘録も兼ねて行ったことを紹介したいと思います。

はてなブログのデフォルトそのままだと、目次とは気づけないあっさりとしたデザインですよね。夫のブログはそのままにしてあるのですが、なんともわかりにくい・・・

f:id:atenami:20170815221202p:plain

まずは「もくじ」とタイトル付けし、色付けをしてわかりやすく主張することにしました。私のページはPC表示とスマホ表示を別々にしているので、どちらも指定する必要があります。

PC表示ははなろぐ様のページを参考に、ピンクを基調としたものにアレンジをしました。

スマホ表示はひつじ様のページを参考に、同じくピンクを基調としたものにアレンジ。というか、もうひつじさんのテーマに全部変えたい今日この頃・・・。

私のものと同じカスタマイズでよければモリッとコピペしてください♩

はてなのそのままのデフォルトの字って小さいしフォントも読みにくくないですか？しかも行間もけっこう詰まっているし・・・私の主力ブログのユーザーは９割がスマホユーザーなので、スマホで読みにくいのは絶対NG！ということで、カスタマイズすることにしました。

字の種類はNorth-Geek様と同じアレンジのヒラギノとメイリオのミックスに

字の大きさ、行間は英語とappleとDiYと様のものを参考に作りました。ありがとうございます！

PC（CSSに貼り付け）・スマホ（フッター貼り付け）

カスタマイズ前のブログをスクショするのを忘れていたので、夫のブログと私のブログで比較しますw

f:id:atenami:20170815223154p:plain

f:id:atenami:20170815223228p:plain

うん！自己満足かもしれませんが読みやすいはず！！！

ライターアテナミの頭の中