ブログ記事で使う色は３色まで！
きのです。いつもブログ作成お疲れ様です＾＾。わたしは最近、ブログテーマをデザインしている画像をデザインするのが楽しいなと感じております。
ここ最近のアイキャッチやブログ画像は、写真ではないシンプルな画像を使っていますが、実は私が自分で作っています。
ちょっとばかし時間がかかるのですが、楽しいのでついつい作ってしまうのです。
まあ、それは置いといて、前回は記事の装飾について書きました。
programmingforbeginners.hatenablog.com
今回は、ブログ記事の中で使う文字色について記事を書いていきたいと思います。
『読者に伝わりやすいブログを書けるようになりたいけど、どうすればよいかわからない』そういった方に読んで欲しいと思います！
【 目次 】
□ シンプルに１色
□ ２色で使い分ける
□ ３色で使い分ける
■ まとめ
読者は全てを読まない
基本的にですが、読者はブログは全てを読んでいません。なぜかというと、読者は、知りたい情報を手に入れるためにブログへやってくるからです。
そのため、知りたい情報が書いてある部分だけを探して読んでいくというのが、多くの読者の行動です。
そこで、わたしたち情報をブログで提供する側がすべきことは、読者が知りたい情報をわかりやすく提示することです。
それにより、『このブログに来れば、知りたい情報がすぐに手に入る』と読者に思わせることができます。
適切な色を使えば伝わる
伝わりやすいブログとは、一番伝えたい情報や重要な情報に、読者の目を向けさせることができるブログだと思っています。
例えば、使う文字色が多く、カラフルなブログは一見、たくさん装飾がしてあって、手が込んでいるなあと思いますが、記事の中で多くの文字色を使うと、
一番伝えたいことがぼやけてしまい、結果、読者が納得できないまま、ブログを離れていってしまうということになりかねません。
次では、どのように文字色を使い分けたり、マークをつけていけばよいかを解説していきたいと思います。
使う文字色は３色まで
シンプルに１色
１色だけを使用するときは、シンプルにこれは重要だなというところで、色を使って強調をさせます。
ここで使う色は、ブログの中でメインとなっている色をおすすめします！モノトーンなデザインのブログの方は特にですね。
ブログの統一感を持たせるために、メインカラーを使用するのが良いと思います！
？メインカラーってなんだよって方、詳細はこちらに書いてあります。
２色で使い分ける
２色以上を使用するときは、色の入れ方を工夫してみましょう。
例えば、伝えたいポイントに優先順位をつけて、"優先順位が高い方を文字色"、"低い方をアンダーライン"といった使い分けをします。
あるいは、重要単語や短い言葉の場合と長い文章の場合で分けることもできます。その場合は前者を文字色、後者をマーカーやアンダーラインで強調させてください。
理由ですが、長文での文字色は、重要度が薄れてしまったり、読者に読みにくさを感じさせてしまう可能性があるためです。
色が１色増えるだけでも、かなり色々なことを考えないといけないので、注意が必要です。
３色で使い分ける
３色の使い分けの方法、いろいろあると思いますが、今回はその中の１つを紹介したいと思います。
使用する色は、赤 ・青・黄とします。色の使い分け基準を一言で言うと、「読者の感情＋重要なポイント」です。
・赤→読者のプラスな感情
例）”Progateを使うメリットは「これなら僕でもプログラミングやっていける！」とモチベーションをあげることができる所にあります。”
・青→読者のマイナスな感情
例）”「ブログをカッコよくしたいけど、どうやったらいいのかわからない・難しい知識が必要なんじゃないか」と思っているあなたに見て欲しい！”
・黄→どうしても伝えたい重要ポイント
その記事の中で、あなたがなにがなんでも伝えたいことを黄色の文字ではなく、マーカーで強調してあげます。
なぜかと言うと、単純に黄色の文字は見にくいからです。強調したくて色を変えているのに、それが見にくいのでは本末転倒。。お気をつけくださいませ〜。
マーカーの引きかた
マーカーは、HTMLとCSSを使って書いていきます。
See the Pen marker by Sanae Sumi (@s-sanae) on CodePen.
ここを基本として、色や太さを変えたいときは、CSSのカッコ内の設定を変えていきます。
・to bottom→to topにすると、今の状態から上下逆になります。
・transparent 50%→上から50％は透明にしますという意味です。ここに色を指定すると、２色のグラデーションになります。
・#f7ee34 50%→50％の地点から下へ#f7ee34の色にしますと言う意味です。"#f7ee34"の部分を変えるとマーカーの色が変わります。
まとめ
今回はブログ記事の装飾で使う文字色のお話でした。何種類の文字色を使うかは、それぞれのブログの色合いであったり、デザインによって選ぶ必要があります。
しかし、１色でも２色でも３色でも、必須は『なにがなんでも伝えたいポイント』に色を使うことです。これがあるだけで、読者が見やすく、情報を探しやすいブログになります。
改善の余地があれば、是非挑戦して見てください。
最後まで読んでいただき、ありがとうございました！
ツイッターもやっているので、よければのぞいてみてください！
