見やすさ抜群！ユーザーに優しいブログのサイトデザインの18のコツ

ブログに重要なことはユーザーに役立つような質の高い内容です。そして、その内容を読みやすくするためには、記事のデザインも必要だということを、必須条件！ブログの記事を見やすくするための記事デザイン手法22選の記事で紹介しました。

しかし、記事の内容な読みやすさがよくても、ブログ自体のコンテンツの配置や配色が見づらいものであっては意味がありません。

ブログには記事の内容とデザイン、そしてそれらをすべて包括するサイトのデザインの見やすさが必要なのです。

そこで、今回はユーザーにとって見やすいブログのサイトデザインのコツを紹介します。

ユーザーに優しいブログのサイトデザインの18のコツ

ブログのデザインにあたっては2カラムにして、メインカラムを記事一覧や記事本体、もう一つのカラムをサイドバーやそのほかのリンクを集めたものにするのがベストです。

3カラムでもいいですが、記事本体のカラムの幅が小さくなってしまうため、2カラムをおすすめします。

そして、メインカラムは左で、サイドバーのカラムを右にすることをおすすめします。

webページは横書きで、人の目線は左から右にかけて移動します。メインである記事を左にした方が、目線の移動がスムーズにできて、読みやすくなります。

カラムで区切る際は、それらを枠や線で区切ったり、背景色を変えて区別するべきです。

同じ背景色で、枠や線がないと、どこが区切りかわからくなり、読みづらくなってしまいます。

きちんと区別するようにしましょう。

背景色で赤などの明るい色や、黒などの暗い色を設定すると、見にくいですし、怪しいサイトだと思われてしまいます。

基本的に、白背景に黒文字をおすすめします。

背景色を付けるところも、なるべく白に近い淡い色にして、見やすくなるようにしましょう。

背景色だけでなく、それ以外の文字や、画像などの色も刺激の強い色は控えるようにしましょう。

サイトは全体的に落ち着いた感じに配色するべきで、すべての色を見やすくなるように配色を心がけましょう。

Twitterのように、スクロールすると過去のコンテンツがロードされて、下にどんどん追加表示されていくのを、無限スクロールと呼びます。

この無限スクロールは流し読みするコンテンツなどにはかなり便利ですが、ブログにおいては記事を何回も読む読者もいます。

そのような人は、ページネーションで記事一覧が表示されていると、大体何ページにお目当ての記事があったか覚えておくことができ、再度読もうと思ったときは、簡単に記事を見つけることができます。

もしこれが無限スクロールであれば、どのあたりに目当ての記事があるかもパッと見ではわからず、しかもいちいちスクロールするのが面倒くさいです。かなり昔の記事であれば、その分スクロールを何回もしなければなりません。

ブログはざっと読むものではなく、1つ1つの記事に価値があります。ユーザビリティーを考え、記事一覧では目当ての記事を読者が探しやすいようにページネーションで分割表示しましょう。

上記で、記事一覧はページネーションで分割するべきと説明しましたが、そのページネーションでも気を付けたいことがあります。

ページネーションにおいて、「1、２、３、…….、18」のように、最初と最後のページのリンクだけ表示して、途中は省略しているものをよく見かけます。

この場合、途中のページに行きたい場合は、番号を目当てのページに近づけるために、いちいちリンクを辿らなければいけません。

それはかなり面倒くさく、ユーザにお目当てのページへ1クリックで行かせるために、ページネーションのリンクはすべての番号のページを表示するべきです。