こんにちは。コモテック制作チーム デザイナーです。
WEBサイトは、ビジュアルなどで目を引くことの他に、文字の読みやすさも重要です。せっかくサイトを立ち上げても、書いてある内容がユーザーやターゲットに伝わりづらいと効果が薄くなってしまいます。
今回は、文字が見やすい・読みやすいサイトをいくつかピックアップしてみました。読みやすいしくみを見ていきましょう。
(投稿日時点の情報です)
見出しの文字はひときわ大きく太く、ひと目で分かりやすいようになっています。本文は小さすぎず大きすぎない大きさで、見出しを邪魔しないように少し細くなっていたり、グレー色になっていたりしています。
また、本文以外の補足情報などはさらに小さくなっており、文字情報の順番付けがきちんと統一されています。
そして、文字の周りには余白を多めにとっていることも、区切りがわかりやすく読みやすさに繋がっているようです。
・株式会社プロフェッショナル・ネットワークス
https://www.pronets.co.jp
こちらは英文見出しがメインになっているパターンです。ビジュアルが無くシンプルな文字だけの情報ですが、各数字パーツ等を用い、文字周りの余白をうまく使うことによって、情報の区切りがわかりやすくなっています。
また、プランなどの箇所ではただ文字を羅列するのではなく、大きさのメリハリやマークアイコン等で理解しやすい工夫がされています。
・株式会社モノモード
https://monomode.co.jp
サイトのテイストによっては、あまり太い文字を使いたくない場合もあります。その際はこのように、メイン文字以外はグレー色にすること等によって、優先的に目に入ってほしい情報へ誘導するパターンもあるようです。
まとめ
いくつかのサイトを見比べてみると、共通点としては、「見出しは大きく目立つように」「文字周りの適切な余白」「文字情報の順位付け」がされているサイトは、文字が見やすい印象がありました。
文字にも気を配って、ユーザーやターゲットに伝わりやすい、見やすく読みやすいサイトにしていきましょう!