資料やスライド、SNSの図解をつくるとき「読める」と「伝わる」は似ているようで実はまったく別物です。
読めるだけでは情報は届きませんし、伝わるだけでは誤解が生まれるかもしれません。
今回は、以下の３つを深掘りしながら「読みやすさ」を底上げする実践テクニックを紹介します。
- 視認性：ひと目で見やすいか？
- 可読性：読みやすいか？
- 判読性：正しく意味を読み取れるか？
視認性 ― パッと見で目に入りやすいか？
視認性の定義
視認性とは「文字の確認しやすさの度合い」のことです。
遠目に見ても「そこに文字がある」とわかるか、スマホの小さな画面でも判別できるか――そうした“気づきやすさ”を左右します。
視認性を高める３つのポイント
| テクニック | 効果 |
|---|---|
| 文字サイズを大きくする | 視界に入りやすく、読み始めのハードルを下げる |
| 文字を太くする | コントラストが増し、文字が背景に埋もれない |
| 背景と文字色をはっきり分ける | 輝度差で輪郭が立ち、チラ見でも認識可能 |
コツ： まず“見える大きさ”を確保してから、フォント選定や配置調整に移ると迷わないです。
可読性 ― ストレスなく読み進められるか？
可読性の定義
可読性は「文章の読みやすさの度合い」のことです。
行長が長すぎたり、漢字が連続しすぎたりすると、読者は途中で集中力を失ってしまいます。
可読性を高める３つのポイント
行長は「長すぎず短すぎず」
- 目安は全角30～40文字、または画面横幅の70～80％。
- スマホ表示を想定し、改行位置を意識するとGOOD。
行間を広げる
- 文字サイズの「50～100％」が目安。
- 詰め込みすぎは「文字のカタマリ」に見えてしまう。
適度に段落・余白を入れる
- 文脈の区切りで1行空けると“呼吸ポイント”が生まれる。
- リスト化や枠で囲むと、視線の迷子を防げる。
補足： 太字は視認性アップに有効ですが、本文すべてを太字にすると“黒い塊”になり可読性が下がります。
判読性 ― 正しく読み取れるか？
判読性の定義
判読性は「文字の意味を正しく読み取れるかの度合い」のことです。
たとえば「0（ゼロ）と O（オー）」「1（イチ）と l（エル）」が似ているフォントでは、数字とアルファベットの判別ミスが起こりやすくなります。
判読性を高める２つのポイント
| フォント選び | 具体例 |
|---|---|
| 字形の差が大きい書体を使う | BIZ UDGothic、DINなどは“0O1lI”の判別が明快 |
| 同系フォントでもバリエーションを混ぜる | 見出し＝ゴシック体、本文＝明朝体など、役割で差別化 |
豆知識： 欧文フォントは大文字・小文字・数字を並べてみてから採用すると、判読性のリスクを事前にチェックできます。
３つの指標を組み合わせた改善ステップ
- 下地をつくる ― 視認性
まず文字を「見える」状態に。サイズ・太さ・背景を整える。 - 読みやすく整える ― 可読性
行長・行間・段落でリズムをつくり、読者のストレスを減らす。 - 誤解を潰す ― 判読性
フォントと字形を検証し、似た文字の混在を防ぐ。
チェックリスト
- 文字は十分に読める大きさ？
- 行間は詰まりすぎていない？
- 「0」「O」「1」「l」を見分けられる？
この順番で確認すると、「見えるけど読みづらい」「読めるけど誤読しやすい」といった事故を防げます。
まとめ
- 視認性＝“見えるか”
- 可読性＝“読み進められるか”
- 判読性＝“誤読せず理解できるか”
デザインとは、装飾ではなく情報を届けるための技術です。
視認性・可読性・判読性を意識するだけで、同じ内容でも一気に伝わりやすくなります。
あなたの図解や資料が、もっと多くの人にスムーズに届く助けになれば幸いです。
参考文献
武田英志『伝わるデザインの授業 ―一生使える9つの力が身につく』翔泳社
※Amazonアソシエイトリンクです。
デザインの基本的なことから、伝わるデザインについてなど初学者向けに網羅的に書かれていて、おすすめの本です。