見やすいグラフを作ろう！基本のポイント4つ
- 投稿日：2019年07月23日
- 作成者：weblab
- カテゴリ：デザイン
数値を伴う情報を伝える際に、欠かせないのが「グラフ」。文章のみでは理解しづらい情報も、グラフを添えて示すことで、ユーザーは直感的に理解できるようになります。最近では採用情報ページなどでも、沢山のグラフを載せている企業が多いです。年代別の人数、有休取得率、通勤時間などの情報をわかりやすく伝えるためには、グラフが欠かせません。今日は、ちょっとしたひと工夫で見やすいグラフに変える4つのコツをご紹介します。
見やすいグラフにするための4つのポイント
見やすいグラフを作るだけで、コンテンツの読みやすさは格段に上がります。頑張ってグラフを作成すれば、ユーザーも「時間をかけてオリジナルのグラフまで作成してくれて、見やすいしわかりやすいな！」と評価してくれるかもしれません。
では、どういった工夫をすれば、ユーザーに評価されるのでしょうか。ここでは、見やすいグラフにするための4つのポイントを確認していきます。
1.色数をむやみに増やさない
情報を無駄なく効果的に伝えたいのであれば、むやみに色数を増やさない方が良いです。NG例のグラフはカラフルで綺麗ですが、別々の要素を比較しているグラフのように見えてしまいますよね。このグラフで伝えたいことは「ここ数年、毎年売上高が上昇していて、中でも昨年度が最も高かったこと」です。この場合は同系色でまとめて、昨年度の部分のみを濃く目立たせることで、主張が伝わりやすくなります。
つい項目の数だけ色分けしたくなってしまいますが、基本的には数色に抑える方が見やすいグラフになるでしょう。ただ、「項目が何種類あるのか」を伝えたい時など、色分けをした方が見やすい場合もあります。グラフの目的に応じて、必要な色数をよく考えて使うことが大切です。
2.要らない要素を消し、スペースを広めにとる
見やすくわかりやすいグラフは、スペースが広くとられていて、必要な要素だけで構成されているものです。上記のNG例では、そもそも項目を書く十分なスペースがないため、文字のサイズが小さくなり、間隔もあけられず、窮屈で読みづらくなってしまっています。
今回のように項目名が長く窮屈な場合は、横向きの棒グラフに変えると読みやすくなります。長い項目名であっても、1行に収めることができるからです。また、要らない線やメモリはなるべく取ってしまいましょう。1メモリ刻みで線が引かれていても、それをユーザーが一つずつ数えるとは考えにくいです。細かい数値を知って貰いたい時は、OK例のようにメモリを無くし、グラフのすぐそばに数値を書き込む方がわかりやすいです。
3.遠くに凡例を置かない
一見、NG例は項目が綺麗に並んでいて見やすい気がしますが、結局のところ、この数値はどの項目のものなのか？とその都度視線を往復させないといけないため、ユーザーにとってはストレスを感じやすい例です。青と水色、黄色とオレンジなどの色の差も見分けて確認するのは、効率的であるとは言えません。
円グラフの場合は、なるべくグラフの中に項目と数値を入れた方が見やすいです。万が一、スペースが無くて入らない場合は、線を引き近くに書きましょう。この方法なら別途項目を分ける必要がなくなり、視線の往復させずに数値を読むことができます。
4.順序を守る
グラフは、「順序」を守らないと意味が伝わらなくなってしまう場合があります。このグラフは、社員の年代別人数を表したものです。NG例では、円グラフの並べ方と混同し、人数が多い項目から順番に並べてしまっています。
単なる割合や人数を表すことは円グラフでも棒グラフでも可能なため、混同しがちですが、割合を表す円グラフに対して、棒グラフは、本来順序のあるものの推移や分布を表すものです。「若手社員が多いのか？ベテラン社員が多いのか？」を一瞬で判断してもらうためには、OK例のように年代順に並んでいる方がわかりやすいですよね。
アンケートの結果を整理して、多い順に並べられたデータなどをそのままグラフに反映してしまうと、このようなミスが起こります。グラフを作成する前に、「何を伝えたいグラフなのか」を明確化しておきたいですね。
まとめ
今回は、見やすいグラフを作るための基本的なポイントについてご紹介しました。ホームページでの使用に限らず、プレゼン資料などでも積極的にグラフを利用すれば、誰もが見やすく読みやすいコンテンツを作成できます。練習を重ねることで、見やすいグラフを作れるようになり、ホームページにもオリジナル性を出していくことができます。
わかりやすいグラフは、他のホームページやSNSなどでも引用されやすいです。一工夫を加えることは、SEO対策にも有効とされており、検索順位のアップが期待できます。今日、ご紹介したデザインのポイントは、今から実践できるものばかりですので、言葉と共に上手に使って、わかりやすく情報を伝えましょう。
