【タイプ別】Webサイトで写真をキレイに見せるコツ

美しいWebサイトとは何でしょうか? 一般的に、ページを開いたときの第一印象がよく、目当てのコンテンツに辿り着けるページではないでしょうか? 印象は人それぞれですが、どんなサイトかイメージが伝わりやすい、美しい写真を大きく使ったサイトが増えてきています。

BiNDクラウドで作成された美しいWebサイトの例

かつては、ネットの通信速度も遅く、大きな写真を使うことは避けられていました。しかしブロードバンド接続が当たり前になり、携帯電話からも写真を使ったサイトを見ることが容易になったのです。では、具体的に写真をどの様に見せればよいのでしょうか? Webサイトのジャンル別に美しいサイトの実例をご紹介します。

コミュニティサイト

ママカメラ部(写真教室)

http://akaneiro-photo.com/

 

lifestyle1

写真そのものが商品、コンテンツとなっているWebサイトでは、写真の見せ方にこだわりたいものです。こちらのサイトでは、動的なスライドショー、小さい画像を並べてクリックすると拡大表示するようなフォトアルバムなどが充実しています。画像をメインに、文字は小さく表示するなど、微妙なバランス調整が、Web制作のプロでなくても、適切なテンプレートを選んで使うことで簡単にできます

複数画像を選択し、フォトアルバムのように表示する機能も。動的な見せ方も可能

⇒【Webサイト事例】BiNDクラウドで作成されたライフスタイル系サイト

サービス

あずんガーデンファーム(トマト農園)

http://azun-gf.com/

servise

飲食業、農業、レジャー施設などは、サービスの品質が命です。農園のサイトでは、農作物を大きく見せることで、みずみずしさや彩りを印象付けます。写真をトップページ全体に使う場合は、漠然とした場所の写真を掲載せず、一つこだわりの物にクローズアップした写真を掲載した方が効果的です。

⇒【Webサイト事例】BiNDクラウドで作成されたサービス系サイト

オンラインショップ

 デイズ コーヒー&ビーンズ(コーヒー豆の販売)

http://www.cafedays-shop.com/

onlineshop

オンラインショップでは、商品の魅力を伝えるとともに、購入に至るまでの説明の見やすさ、導線のわかりやすさが重要です。そのため、買い物のガイドやカートの位置、問い合わせなどのメニューがすぐに見つけられる位置に配置されています。そういった利便性とともに、トップページに表示される写真は、そのショップの特徴を現すため、複数の写真を組み合わせたものなども効果的です。

⇒【Webサイト事例】BiNDクラウドで作成されたオンラインショップ

写真はプロに撮ってもらうべき?

Webサイトに載せる写真は、必ずしもプロに撮影してもらう必要はありません。しかし、写真を大きく使う場合は特に、プロの技術が必要になってきます。アマチュアには難しく、プロなら可能なことは主に下記の3点があります。

最適なライティング

食べ物の鮮やかさ、ツヤ、フレッシュさなどのシズル感、建物や品物の細かいディティールを表現したい場合は、プロによるライティングが求められます。

構図など引き出しが多く、イメージにより近い撮影

Webサイトで表現したいことを伝える写真1枚。その1枚には、構図、露出(明るさ)、ホワイトバランス(色味)など、様々な要素が含まれています。プロはそれらの組み合わせのパターンが多く、アマチュアには思いつかない提案を期待できることがあります。

写真の加工

食べ物から漂う湯気、肉眼で見たまんまの(またはそれ以上の)鮮やかさ、複数の画像をコラージュした画像など、アマチュアでは加工が難しい表現があります。写真加工をアマチュアでも扱えるようになってきたとはいえ、餅は餅屋です。

番外編 素材サイトを使うという選択肢もアリ

Webサイトに掲載する写真は、必ずしも撮りおろしである必要はありません。写真を通して伝えたいものが、無料・有料の写真素材サービスでプロがすでに撮影した写真から気に入ったものが手に入る場合があります。また、撮り下ろす場合も、撮影の参考になるかもしれません。

参考:記事が映える! 写真素材サービスの選び方

無料でBiNDクラウドでサイトを作る

[デザイナー厳選] 覚えておきたい おすすめWebフォント30選

見た目や可読性に大きく影響するホントに使える30のWebフォントを、本文から見出し、日本語から欧文まで用途ごとにデザイナーが厳選しました。

今すぐ資料をダウンロード
  • POINT

  • 何を見せるべきか、漠然とした写真は使わず、こだわりの1枚を
  • 写真とともにナビゲーションの配置にも気を付ける
  • 特に大事なポイントの写真は、プロによる撮影や、素材サービスを活用した方が安心

あわせて読みたい