読みやすいブログにする為の方法と準備

投稿日2015.06.18

はい。
今回は、ブログを読みやすく(自分好みに)する為のお話。

ブログのテーマ作りに行き詰まったので、気分転換がてらに…。

・WEBサイトとブログのレイアウトについて
・読みやすいブログデザインとレイアウトを総まとめ -2015年版-
・簡単にブログをカスタマイズする方法！！- 前編 –
・簡単にブログをカスタマイズする方法！！- 後編 –

と、一気に4記事を投稿しましたが、今回はカスタマイズの準備に向けて書いてみたいと思います。興味があれば、適当にお付き合い下さいませ。

デザインのベースをストックする

色んな情報を探していると、沢山のWEBサイトやブログを見る事になりますが、普段から「新しく取り入れてみたい」と思ったデザインや、調べ物をしていて「読みやすい」と思ったサイトをブックマークしておきます。

それと同時に、スクリーンショットでも撮っておき、画像としても残しておく。

これは、ブックマークしているサイトがリニューアルして、デザイン変更になってしまった場合や、404エラーになってしまう場合、サイドバー等に表示されている広告なんかのデザインや配色を参考にしたい時に役立ちます。

また、普段では調べないようなキーワードで検索をかけてデザインを探してみる。

例えば、WordPressを利用している場合でも、「Blogger+テンプレート」というワードで検索してみたり。テーマを絞り込んだ専門的な解説ブログや、日常やレビューを綴ったブログ等を運営していても、「ポートフォリオ+ブログ」で調べてみたり。

ブログで扱う内容によって、デザインも変わってくると思いますので、普段から「良いなぁ」と思ったデザインを見かけたら、片っ端からブックマークとスクリーンショットを活用し、手元に残しておきます。

読みやすさの秘密を調べる

前項のストックや、普段から定期的に読んでいるブログの中から、「読みやすい」と思う理由を調べていきます。

これは、ブログをカスタマイズする方法でも書きましたが、Chromeの「要素を検証」を利用すると便利で、知りたい部分に当っているCSSを調べる事が出来ます。

要素を検証

ブログの読みやすさに直結するのが、文章やコンテンツの幅(width)・文字の種類(font-family)・文字サイズ(font-size)・文字色(color)・行間(line-height)・字間(letter-spacing)辺りのプロパティになるので、「読みやすい」と思えるサイトが、どういった値を使っているのかを調べて、メモ帳にでも残しておきます。

普段は何気なく読んでいるブログでも、読みやすいと思えるブログは「行間」「字間」辺りを工夫されている場合が多くあります。

これらの値を、使用中のテンプレートに適応してみて、自分の中で「読みやすい」と思える値に設定するだけで、PVの改善に繋がるかも知れません。