見やすいレイアウトにするには?

見やすいレイアウトにするには?

こんにちは。
Webサイトを作成する際、いまいち見やすい画面になっていなくて困ったことはありませんか?
私自身もまだ完全に身についてはないのですが、見やすいレイアウトにするために意識していることを今日はまとめたいと思います。

① 1番見せたい部分を大きく強調する。

①1番見せたい部分を大きく強調するのイメージ

各ページごとにどの部分を1番に見せたいかを決め、その部分を大胆に大きくレイアウトすることが大切です。  1番に大きく強調されているかの目安は、50%縮小して表示した時に1番大きく見えてるかです。        その次に見出しなども立って見えてくると尚いいと思います。

② エントリーポイントを作る。

その③エントリーポイントをつくるのイメージ

コンテンツ内を見てもらうために目線の止まる部分をつくります。
エントリーポイントを作る際は、
人の気を惹くものに、道しるべ(展望ポイント)をつけてあげて、周りにホワイトスペースをしっかり取ってあげることが大切です。

③ 色にメリハリ(ノセとヌキ)をつける

その③色にメリハリ(ノセとヌキ)をつける

ノセとは?色の乗っている部分
ヌキとは?色が抜かれている部分
色のノセとヌキの配分は、情報のブロックごとに3:1または4:1くらいの面積配分がいいと思います。

あとは、視線に合わせて要素を配置し、グロープとグループの間にしっかり余白を開けることで読みやすいレイアウトができあがると思います。

おまけ

写真を使用する際に角版写真やキリヌキ写真が与えるイメージは下記をご参考ください。

 

おまけ 角版写真とキリヌキ写真のイメージ

「角版写真」
写真のエッジがまっすぐなラインで断ち切られているもの
力強く、整然とした印象、メインの写真やカタログなどに使用

「キリヌキ写真」
写っている対象物をそのラインで切り抜いたもの
自由でのびのびとした印象、動きのある構成を演出したいときに

以上で、見やすいレイアウトにするために普段私が意識していることになります。
ご参考になれば幸いです。


Previous: なんだか違和感?「錯視」とは? Next: すべての人が同じように感じる「デザイン要素」とは?

© 2017 ALL CONNECT Inc. All Rights Reserved.