ホワイトスペース -十分に利用されていないデザインエレメント

Post on:2010年9月28日

はじめに

素晴らしいウェブデザインをつくりだす多くのエレメントがあります、その中でも十分に利用されていないものの一つがホワイトスペースです。すべてのデザインがホワイトスペースを持っていますが、問題はすべてのデザインが十分持っているわけではないということです。

これは経験不足のデザイナーと彼らのクライアントがホワイトスペースを単にスクリーンの領域の浪費として見るという事実があります。
しかし、真実は違います。ホワイトスペースはあなたのデザインの最も貴重なエレメントです。

ホワイトスペースとは

その名前が暗示する白いスペースである必要はありません。この名前は、たいていの印刷物が白い紙の上に行うため、グラフィックデザインの初期から得たものです。
ホワイトスペースとはデザインやページレイアウトのエレメントの間、そして周りにある空間のことです。これはグラフィックやイメージの周りにあるスペース、カラムの間にある隙間、タイポグラフィの間にあるスペースなども含まれます。また、ホワイトスペースはネガティブスペースとも呼ばれます。

ホワイトスペースを十分に使用することで、デザインにいくつかの利益をもたらすことができます。単にレイアウトでエレメントの間のスペースを増やすことで、デザインに優雅なアピアランスを与えることができます。また、タイポグラフィにもっと多くのホワイトスペースを与えることで、コンテンツをいっそう読みやすくするでしょう。

優雅さと洗練さ

印刷デザインにおいて紙は貴重なリソースで、クライアントはそのすべての領域を使用することを望むでしょう。そのことは結局、コストがかかり、クライアントは元をとることを望みます。これに似た価値観がウェブデザインにおいてスクリーンの領域にむけられます。テキストとグラフィックによってプレゼンテーションされたメッセージは、寸法を決められ、スペースを限定されます。ホワイトスペースに大きな量を使うことは、スクリーンの領域よりいっそう重要です。

高級なブランドはこの概念を優雅と洗練のイメージを伝えるために使います。例えば、二つの家具の会社のサイトを見てみます。
Pottery Barnのサイトは比べると、いっそう高級感があり、さまざまなエレメントの間にたくさんの空白スペースをもっています。ロゴ周りにさえ、大きな量のホワイトスペースがあることに注目してください。

Pottery Barn

Rooms To Goのサイトは少しレベルの低い家具店で、それはウェブデザインからもうかがえます。これにはいくつかの要因があり、特にホワイトスペースの欠如は大きな役割を果たしています。エレメントの間のスペースは少ししかありません。

Rooms To Go

カテゴリリンクのリストが左のボーダーと隙間なく配置されていることに注目してください。このようなデザインはいい加減で、プロ的ではないように見えさせることができます。

次にあなたにも見覚えのある二つのブランドを見てみましょう。下記はAppleとMicrosoftのウェブサイトの比較です。
Appleのサイトは優雅と洗練の典型的な例で、たくさんのホワイトスペースを使用していることに気がつくでしょう。Microsoftのサイトはすこし詰めこめられた感があるので、それほど優雅ではありません。これはそれぞれの会社のブランドイメージと一致しており、正しいです。

Apple

Microsoft

[ad#ad-2]

レジビリティとユーザビリティ

マイクロレベルで、ホワイトスペースがタイポグラフィとユーザビリティにおいて主要な役割を果たします。テキストの行間が少ないと、読むことが非常に困難になります。これは行間にもっと多くのスペースを与えることで、コンテンツを読みやすくして、そして理解することがより簡単になります。

Information Highwaymanはポートフォリオサイトです。このサイトはテキストにホワイトスペースを大きく使用した優れた例です。行間がゆったりとられたコンテンツは読む際に喜びすら感じます。

Information Highwayman

マイクロホワイトスペースはテキストを読みやすくするだけでなく、コンテンツのブロックを分離するのにも役立ちます。これはユーザーがコンテンツをどこから始めて、どこで終わるのか区別するのに役立ちます。

コンテンツが互いにより際立つよう、コンテンツのさまざまなブロックの間に十分な分離をつくることは重要なことです。Analogのサイトでは、さまざまな量の分離をつくり、そしてコンテンツの流れをつくりだしています。より大きい量のホワイトスペースはコンテンツを分離するために使用し、小さい量はパラグラフの間に使用されています。