COLUMN コラム

サイト制作を行うWebデザイナーは、仕事で写真を撮ることはなくても写真データを扱う機会は多々ありますよね。

クライアントから提供された写真素材をそのままの縦横比で使用することは少なく、大抵はサイトに合わせて適宜トリミングすることが多いのではないでしょうか。

Webデザイナーとしてデザインを左右する写真を適切に扱うためにも、写真の構図を理解し効果的に使えるようになりましょう！

写真の重要性

写真が与える印象は文字より大きいと言われています。そのため写真をパッと見て3秒以内に興味を持たれなければ内容まで見てもらえないこともしばしばです。

逆に写真がサイトやテキストの内容と一致しており、適切に扱えている場合には流し読みや飛ばし読みが容易になるため読まれやすいとも言われています。

「その写真で何を伝えたいのか」「見せたいポイントはどこなのか」を考えて使うこと、その上で「見せたいポイント」に注目させる構図とはどのようなものか、サンプルの写真を交えて紹介したいと思います。

基本的な構図

1. 三分割構図

写真を縦横に三分割して、その線や交差する点に被写体や要素を配置する構図です。

オーソドックスでバランスの良い配置となる定番構図で、感情や関係性、全体を表現しやすいとされています。

2. 二分割構図

写真を縦もしくは横の二分割にする構図です。

色や奥行きが分かれているときに使いやすく、境界線をはっきりと出せることでシンメトリーのような美しさを表現することができます。

3.日の丸構図

被写体を中央に配置する構図です。

被写体を目立たせ、ストレートに捉えられることが特徴です。そのシンプルさゆえに力強い印象にもなれば、つまらない印象にもなりやすいので使い方のバランスが大切です。

4.放射線構図

ある一点から放射線状にひろがっていくような構図です。

遠近感や奥行き感を強調することができます。放射線の消失点に被写体を配置すると視線誘導にも有効です。

5.対角線構図

対角線上の線に境界を配置したり、被写体を乗せる構図です。

２つの被写体を見せたい場合、横並びよりも対角線上に置いたほうがバランスが取れた写真になります。

6.トンネル構図

枠となる風景の中にメインの被写体を置く構図です。

被写体に視線が集中しやすくなるため、より印象的に見せることができます。

おわりに

写真や素材の使い方・見せ方については「なんとなく良い」の主観も大事にしつつ、「なぜその配置にしたのか（切り取ったのか）」説明できる知識や目線を養っていきましょう。

弊社では士業やメディア、医療関係を中心にサイト制作を行っております。Webサイトについてお悩みのある方はお気軽にお問い合わせください。