謹賀新年

2018年の目標。

お客様との活動を通じて高品質なデザインとUI UX 感情を揺さぶる「もの・体験」を世の中に発信します。

このブログを通じて自分のなかで曖昧になっている知識を書き出し、まとめ上げ、似た境遇に置かれている人の突破口となる力となります。

私と協力してくださる方々と共により良い未来を作ります。

世の中のあらゆる困っている人をデザインの力で助けます。

 

代表 小清水翔太

余白を工夫して読み手に与える印象を変える。

読み手に与える印象とホワイトスペース(余白)の関係

ウェブ表現の主な要素として、画像、文章、タイトルの3つの要素があります。これらをデザインとして並べていくわけですが、並べる際に、ブラウザの端から要素の距離、要素同士の距離を調整することで、読み手に与える印象を大きく変えることができます。情報量、高級感、ブランドイメージ どれを読み手に印象付けたいかによって余白の使い方を工夫する必要があります。今回はそんな余白の使い方をまとめました。簡単な例を図で示します。

情報量の多さから信頼を得る。

情報量が多いイメージ、「ここなら欲しい情報が見つかりそう」という印象を与えたい場合、

要素同士はなるべく密接して、配置するのが好ましいでしょう。文章と適度な量の画像が繰り返されることで、流し読みをしやすくさせることができます。

高級感の表現

高級感を表現したい場合、掲載する写真やフォントによっても印象を変えることができますが、余白使いとしては 要素を画面の中央に配置することで、それを実現できます。

また、作品や写真の持つイメージを最大限に伝えたいときは、写真を画面いっぱいに配置し、タイトル(キャッチコピー)や文章は少なめに配置するのもよいかもしれません。

ほかにも高級感を与える方法としては、ゴシック体よりも明朝体を使う。

細かな装飾を施す、色を高級感のあふれる色にするなど、さまざまな方法があります。 もう少し詳しく知りたい方はこちらの高級感のタグを参照してください。

ブランドイメージを伝える。

相手にブランドの存在を知らしめ、強烈に印象に残すには写真の力が大きいかもしれません。ブランドイメージを彷彿させる、写真を大きく配置し、

それを高めるキャッチコピーを配置することで、相手の記憶に残るブランドを作ることができるでしょう。

 

ホワイトスペースをうまく使って読み手に与える印象をコントロールすることで、あなたの商品、製品にあったサイト作りをしていきましょう。