おしゃれで読みやすいブログデザイン【3つのルールで差をつける】

おしゃれで読みやすいブログデザイン

今回は、以前公開したコチラの記事

の後編。

前編を書いてから半年以上も経った今、なぜ後編を書く気になったのかというと、つい最近「読みやすいです」という言葉をいただく機会があって、とっても嬉しかったから。

そして、私の試行錯誤が誰かの参考になるかも…!と改めて思えたから。

この記事では、ブログを飽きずに読んでもらうために、私が取り入れている

yoko
yoko

 3つのルール!

について、紹介していきたいなと思う。

記事をおしゃれにするコツも書いていくので、よろしければお付き合いください。

スポンサーリンク

この記事はこんな人にオススメ

  • 読みやすい記事にしたい人
  • おしゃれ、も大事にしたい人

この記事を読めば、わかること

記事を飽きずに読んでもらうための、3つのルールがわかる

おしゃれにするコツがわかる

このブログを読んでくださっている方ならもうお気づきかと思うけれど、書き方ではなく、デザイン中心の話になるので、ご了承いただいた上で続きを読んでいただければ。

読みやすいブログデザインに必要な、3つのルール

私が記事を書くときに気をつけていることは、以下の3つ。

 装飾で、重要な場所にスポットライトを当てる
 画像を適度に入れる
 吹き出しを使う

ここからは、1つ1つ深堀りしていきたい。

1:装飾で、重要な場所にスポットライトを当てる

たとえば、サンプルとして以下の文章を見てみたい。

読みやすいブログデザイン。装飾ありと装飾なしの例

一目瞭然だと思うけれど、目に飛び込んで来るのは、装飾(見出し・箇条書き・ボックス・表etc)を施した文字。

SNS・サブスク配信・ゲームなど情報が爆発的に増えている社会では、みんな多くの情報を秒でスワイプしている。流し読みするユーザーに手を止めてもらえるよう

装飾部分を読めば、内容がほぼ理解できる

を意識して記事を作っている。

記事をおしゃれにするコツ

装飾の色は、テーマカラーで統一する

読みやすいブログデザイン。装飾の色を統一した例と色がバラバラの例

はい。色が多すぎると「ごちゃごちゃ」してうるさい印象に。色を揃えると統一感が生まれ、スッキリする。

こちらもオススメ! Cocoonユーザ限定だけれども、装飾の色を自分好みにした方はコチラをどうぞ。

キップム
キップム

とっても簡単なので、ぜひ!

2:画像を適度に入れる

読みやすいブログデザイン。画像ありの例と画像なしの例
画像引用元:EVE韓国公式サイト より

文字だけがずーーーっと続くと、読者は疲れ離脱してしまうので、

画像を適度に入れて、目に優しい記事にしている

記事をおしゃれにするコツ1

画像サイズは、なるべく統一する

画像の横幅 = 記事の幅 だとなお良し

読みやすいブログデザイン。画像サイズが揃っている例と揃っていない例
画像引用元:JTBC公式サイト より

サイズが揃っていないと、ガタガタして落ち着かないけれど、大きさを揃えると、秩序が生まれてキレイな印象に。

記事をおしゃれにするコツ2

フリー素材サイトで画像検索するとき、キーワードを「テーマカラー」にする

コツ2は、今までに書かれているのを見たことがないので(私調べ)、万人に有用ではないと思うけれど。既出じゃない話を語りたい欲が増しているので少し語らせてください。

フリー素材サイトは多くのブロガーさんが使っているため、

  • パソコンの画像が欲しい時に、「パソコン」
  • お金の画像が欲しい時に、「お金」

と、普通にキーワード検索をすると写真がかぶってしまうことが多いなぁ、と。

「あ。この画像、どこかでも見たっ!」

となるのを避けたくて、試しにテーマカラー検索(当ブログの場合、blueやyellowなど)をしてみたら、結構いい写真が出てきた。 

テーマカラーで検索をかけて出てきた画像の例

あまり色にこだわりすぎると、全然話の内容に関係のない写真になったりするけれど……(私はそれでもいいかなと思っている。画像挿入は、読む際のストレス軽減が目的だから)

テーマカラーに近い色味の写真は、見出しの装飾に使っている色とも相性がよくキレイ!ということに気がついてしまったので、最近はカラー検索にハマっている。

キップム
キップム

画像の選択肢が広がるので、よかったら試してみてね!

3:吹き出しを使う

ブログを始めた頃は、文章を書くことに精一杯で、読み手の立場になってみる余裕なんてなかったけれど…デザイナーの友だちに、

yoko
yoko

吹き出しも使ってみたら?ポイントになるよ♪

とアドバイスされ、こんな感じで使い始めた。

今から思えば、「読みやすい記事」について考えるきっかけになったように思う。

吹き出しには、

伝えたい情報に使うと、視線を集めることができる

単調なレイアウトに、リズムが生まれる

会話形式にすると、読みやすくなる

などの効果があり、便利。

使いすぎるとうるさくなるので注意が必要だけど、メリットが多いので、これからも使うぞっと思っている。

記事をおしゃれにするコツ

イラストのテイストを揃える

読みやすいブログデザイン。イラストのテイストを揃えた例とバラバラ例

テイストがバラバラよりは、揃っていた方が雰囲気が崩れず、自然な感じになる。

自分でイラストを描けない方は、スキルのフリマ【ココナラ】などのサービスでオリジナルアイコンを作るのがオススメ。

理由は、ブログに「あなたらしさ」が出て、ユーザーの記憶に残りやすくなるから。

\ 会員登録で「300円割引クーポン」プレゼント! /

おわりに。読みやすいブログデザインまとめ

…ということで、最後に3つのルールをまとめると、

読みやすいブログデザインは、

  •  装飾で、重要な場所にスポットライトを当てる
     (文字装飾の部分を読めば、内容がほぼ理解できるようにする)
  •  画像を適度に入れる
  •  吹き出しを使う

おしゃれにするコツは、

  • 装飾の色・画像サイズ・イラストのテイストは、統一する

後編を読んで、前編も気になってきた…!という方がいたらコチラからどうぞ。

参考になる点があれば嬉しいなと思う。

文章: yoko(  @_yoko51_

Comment