Webサイトレイアウト。今が旬なのか?センタリングデザインについて考える。

Advertisement

Webサイトのデザインをセンター寄せにすると
印象がガラっと変わって見えますよね。
昔からあるレイアウトですが、
あまり見かけなくなったかなーとおもいきや、最近、 また気になり始めました。

横幅サイズ拡大による見え方の変化

これも今更な話しですが・・・
今のモニターサイズ感だと、かなりダイナミックな物が作れると思います。

横幅が900程のサイトでも、
今主流のモニターは解像度幅は低くても大体1200はあるのではないでしょうか
更に、当ブログのようなターゲットの場合、
見られている方のモニター解像度幅はかなり大きくなります。

※当ブログのユーザー解像度
あれ・・・意外と1280多いですね。もっと高いと思った。。ただ1位は1920ですね。

センター寄せを意識したデザインの場合、
サイドの余白や伸びた背景を上手く使えば、
とてもキレイで洗練された印象を与えられると思います。

いくつかセンター寄せのサイトを例に挙げてみます。

Freelance Graphic Design

InCub

Eighty Two Design

We are O3

※上記は1920で表示
We Are O3さんはクリスマス仕様になってますね。可愛い。
どれも、どこか『余裕』が感じられるデザインですね。

センター寄せにする事で得られる効果

シンメトリー効果。


人は、左右対象の物・人に対して美しさや安心、誠実を感じ、
整理されたレイアウトはルール化を認知させる事ができます。
(余談ですが、恋愛でもそうらしいですよ。顔が左右歪んでいる人は、
本能的に良くないと感じるそうです。
遺伝子を残したい本能らしい…。)

Webサイトをセンター寄せにした場合、
必然的に改行やテキストボリューム等を調整、
または長文の場合はサイズ感を考慮する必要があります。

この制限がある為、収まり感を意識しなければいけないのですが、
このお陰で安定した印象、
シンメトリーによる静的な、まとまり感あるレイアウトにする事ができます。

B3 Studios

といっても、
全てをセンターにする必要も無く

例に上げたサイトのように部分的、
もしくは全体のレイアウトとしてセンターを取り入れて見ると
良いかもしれませんね。
特にトップページ等は効果的だと思います。

ちなみに当ブログのトップページも 意識してるっちゃーしてます。(すこーしだけね)

まとめ

モニター解像度の高い昨今のユーザー環境なら、
HTML5などによる動きのあるモノ、
そして大きなデザインで、ダイナミックな表現ができ、
それにはセンター寄せが活きるはずです。
(きっと!たぶん!)

流行りのミニマルやパララックス、
無限スクロールを使ったサイトなんかも映えますね。
シングルカラムのセンターもキレイです。

なんともまとまりの悪い記事だなー