黒い文字なのに読みにくい？「視認性・可読性・誘目性」の違い

Webサイトやポスターを見ていて、

「文字は見えているのに、なんだか読みづらい」

「目立つ色なのに、文章としては読みにくい」

と感じたことはありませんか？

色彩検定では、こうした「見やすさ・読みやすさ・目につきやすさ」を考えるときに、視認性・可読性・誘目性という言葉が登場します。

似ているようで意味が違うので、今回は3つの違いを整理してみます。

視認性とは？

視認性とは、対象が「そこにある」と認識しやすいかどうかのこと。

文字だけでなく、標識やマークなどにも使われます。

たとえば、

白い背景 × 黒い文字

は明度差が大きいため、文字の存在を認識しやすく、一般的に視認性が高くなります。

一方、

薄いグレーの背景 × 白い文字

のように背景と文字の明度差が小さいと、文字が背景に埋もれてしまい、視認性が低くなりやすくなります。

ポイントは、

「見つけやすい・識別しやすいか？」

と考えることです。

可読性とは？

可読性とは、文字や文章の「読みやすさ」のことです。

ここで重要なのが、

視認性が高い ＝ 必ず読みやすい

とは限らないこと。

たとえば黒い文字でも、

文字が小さすぎる

行間が狭すぎる

文章が長く詰まっている

読みにくい書体を使っている

といった状態では、文字の存在は認識できても、文章としては読みづらくなります。

Webデザインでも、本文のフォントサイズや行間、文字間、1行の長さなどを調整するのは、可読性を高めるためでもあります。

誘目性とは？

誘目性とは、意識して探していなくても「自然と目を引く性質」のことです。

たとえば、落ち着いた色ばかりの画面の中に鮮やかな赤いボタンがあれば、

「あそこに何かある！」

と目が向きやすくなります。

一般的には、高彩度の色や周囲との違いが大きい色などは誘目性を高めやすく、注意喚起や広告、CTAボタンなどにも利用されています。

ただし、目立つ色をたくさん使ってしまうと、どこを見ればいいのか分からなくなることも。

**「目立たせたいところを絞る」**ことも大切です。

3つの違いを整理すると

用語 意味 覚え方

視認性 見つけやすい・識別しやすい 見える？

可読性 文字・文章が読みやすい 読める？

誘目性 自然と注意を引きやすい 目が行く？

こうして比べると分かりやすいですね。

Webデザインにも重要な考え方

この3つは、色彩検定のためだけの知識ではありません。

たとえばWebサイトのCTAボタンなら、

周囲から見つけやすく、自然と目が向き、ボタンの文字も読みやすい

という状態を作る必要があります。

つまり、視認性・誘目性・可読性を組み合わせて考えることになります。

現在LP制作をしている私にとっても、実際のデザインと結びつけて覚えやすい内容でした。

色彩検定ポイント

最後に3つだけ覚えておきます。

視認性 → 見つけやすさ

可読性 → 読みやすさ

誘目性 → 目の引きやすさ

似た言葉ですが、

「見える？・読める？・目が行く？」

と置き換えると、違いを整理しやすくなります。