2017.02.21 Tue

「空白」をうまく使って情報を整理。ホワイトスペースの知識

fotolia_61007971_subscription_l

皆さんこんにちは。ジーニアスウェブ増田です。
まだ花などは咲いていませんが、ゆっくり暖かくなり、身近に迫る春を感じる季節となってきましたね。
少しづつ衣替えの準備をされている方もいらっしゃることと思いますが、まだ朝や夜は冷える日も多いので、体調管理には気をつけていただければと思います。

今回もデザインに関する知識をご紹介していくのですが、今回ご紹介するのは「ホワイトスペース」。日本語でいう余白についてお話したいと思います。
そもそも余白とは、印刷デザインからのもので、「文字が記してなく白く残っている部分」のことを示す日本語であるため、あまりいい印象を持たれない方もいらっしゃるかもしれません。
余白は埋めるものだと考えている方もいらっしゃるかと思います。

しかし、書類や文章と違い、デザインでの余白は非常に重要な役割を担っています。
この余白を使いこなすことで
・画面全体がスッキリして爽やかな印象を与えやすくなる
・文字やデザインの情報が整理されやすいため、見やすくなる

などといったメリットがあります。

それではもっと具体的にメリットをご紹介していこうと思います。

1.デザインに使いやすさを加える

まず最初に知っておいてほしいのは、空白スペースはデザインをより有用にするのに役立つ重要なデザインの原則であることです。「使いやすい」ということは非常に重要なポイントです。
見る人がいかに見やすく、理解しやすいかを考えることが大切です。
ウェブサイトのデザインであれば特にデザインする際に明確な目的をもつと、見る人へサイトの案内をする効果的な手段として空白スペースを使うことができ、探しているものを見つけるために空白スペースをうまく利用することができます。

2.コンテンツの読みやすさの向上

良いユーザビリティで重要なポイントは、コンテンツの読みやすさです。この読みやすさとは、フォント、フォントのサイズと色、テキストの構造、ハイライト、イメージと小見出しの関係などがあります。そして、空白スペースが読みやすさの重要な役割を果たします。

3.空白スペースによる見る人の休憩

ウェブサイトを訪れる際、様々な情報が掲載されていると思います。コーポレートサイトをはじめショッピングサイト等様々です。しかし、それらのほとんどのサイトで、文章やコンテンツが占める割合は圧倒的な量になります。そんな時に必要なのは、見るユーザーに休憩を与えることです。
ここでのポイントは「デザインをシンプルにすること」です。過剰な装飾を控えることで、疲れにくく読みやすいサイトになります。
空白スペースで最も重要なことは、フォーカスを合わせるために完璧なデザイン要素であることです。見る人を混乱させないで、最も重要なものを伝えること。不必要な飾りで注意をそらないようにし、そのサイト内で見てほしい情報を得られるようにすることが大事です。

4.空白スペースによってサイトを洗練させたものに

たくさんの空白スペースを使ったシンプルなデザインは、あなたのサイトに使いやすさ、見やすさを与えるだけでなく、見た目においても効果があります。ヴィジュアル的な効果も加えます。多くの空白スペースが機能したデザインは非常にプロフェッショナルな印象を与え、信頼感を生み出します。
特にEコマースサイトなどでは、プロダクトに空白スペースを与えると非常に美しく見えると思います。

今回は余白のメリットについてお話させていただきました。
デザインにうまく空白をつけるのはなかなか難しいかもしれませんが、ひとつひとつのコンテンツをどうやったらより見やすくなるかを考えていただければと思います。
それでは、今回はこれで失礼致します。

WRITERこの記事を書いた人

増田

a-blogやWordPressを使用したサイト制作に携わっています。 もっといろんなCMSを扱えるようになれるよう勉強中です。

a-blogやWordPressを使用したサイト制作に携わっています。 もっといろんなCMSを扱えるようになれるよう勉強中です。

FREE DOWNLOAD

顧客獲得に成功した24社の成功事例を1冊にまとめました。
顧客獲得にお困りの方も、そうでない方も、一度お読みいただくことをお勧めします。

MORE VIEW