「近接」 ～Webデザインの基本原則～

こんにちは、財前航介です。

今日は、私がお客様のWebサイトを作るときに、気にかけていることをご紹介します。

ただ、今日ご紹介するトピックは、すご～～～～く当たり前のことです。

当たり前なのですけど、気にかけて作った時と、全く気にしなかっと時とでは、Webサイトのカッコよさが大きく変わる部分でもあります。

それは、「近接」という、Webデザインの基本原則です。

この「近接」とは、Robin Williamsという方が、自身の書籍の中で「デザインの基本原則」の一つとして紹介しているものです。

近接って？

みなさんご存知のとおり「近接」とは、「近くにある」ということですね。

Webデザインにおいて、これはどういう原則なのかというと、
「人間は本能的に、近くにあるもの同士を、関係があるものとみなす」
ということです。

たとえば、公園の中に猫が2匹いるとき、その2匹が離れて寝ていたら、

「猫が2匹寝ているなぁ。」

ぐらいにしか思わないでしょう。

しかし、もし寝ている2匹の猫の距離が20cmぐらいだったら、
「あれ、友達かな？夫婦？」
なんて思っちゃいます。

特に論理的に考えなくても、距離が近いものは、なんだか本能的に関連し合っているような気がしてしまいます。

Webサイトの利用者に、一目でわかりやすいデザインにするためには、このような、利用者が無意識に受ける印象も気にしなければいけません。

フォームの例

たとえば、以下のようなフォームをWebサイトに設置する例を考えましょう。

上記のフォームを見たとき、なんだか僕はもどかしい、こそばゆい感じがしてしまいます。

下記の方がしっくりきませんか？

お名前の入力個所は、「お名前」と書かれたテキストに寄せて、

メールアドレスの入力ボックスは、「メールアドレス」という文字に寄せて、、、、

デザインは、「カッコイイ」「カッコ悪い」の世界なので、人によって受け取り方は変わると思うのですが、やはり関連し合っている情報は近くに寄せた方が、「分かりやすさ」の面からも良いと思います。

上記は極端な例かもしれませんが、「関連し合っているものは寄せる」。

意識しておくと、情報が整理された、より良いWebサイトができるかもしれませんね。

この記事が、皆様のWebサイト作成のお役に立てば幸いです。
最後まで読んで下さり、ありがとうございました。