ホームページの最初に大きな横長写真を置く案になったものの、手元には縦に撮った写真しかない。写真を探し直しても枠に合わず、撮影からやり直すべきか迷うことがあります。

選ぶ基準は、今ある写真で伝えたい仕事が分かるか、画面に合わせて切り抜いても必要な部分が残るかです。写真の内容が合っているなら、縦の形を生かすレイアウトが候補になります。伝えたい場面自体が写っていないなら、追加撮影を検討します。

横長へ切り抜いたとき、何が見えなくなるかを見る

まず元の写真をそのまま確認し、主画像で伝えたいことを決めます。人の仕事ぶりなのか、製品の全体像なのか、店舗の広さなのかによって、残したい部分は違います。鮮明であることに加えて、今の仕事や設備を正しく表しているか、掲載してよい写真かも確かめます。

例えば、家具工房が職人の作業を紹介する架空例を考えます。縦写真には顔から作業台まで写り、木材を削る手元も見えています。これを横長の帯へ切り抜くと、顔は残っても手元と道具が消える場合があります。顔だけを見せたい人物紹介なら使えても、家具を作る仕事の主画像としては説明が弱くなります。

制作会社には、実際の写真に切り抜き範囲を重ねて見せてもらいます。左右へ引き伸ばして形を変えたり、小さい画像を大きく拡大したりして枠を埋める前に、何が欠けるかを確認します。必要な鮮明さは掲載する大きさでも変わるため、送られてきた縮小画像だけでなく、撮影時の元データで判断します。

写真の内容が合うなら、縦の形を生かす案を作る

例の工房で、職人と手元を一緒に見せたいなら、写真を画面いっぱいに広げず、縦写真の隣に見出しと説明を置く構成が考えられます。写真と文章を分けることで、細かな道具や木目に文字を重ねずに済みます。

パソコンでは写真と文章を横に並べ、スマートフォンでは上下へ並べる方法もあります。横長の写真がなくても、何をする工房なのかを冒頭で伝えることはできます。主画像を横長にすること自体が目的になっていないか、見出しと写真を合わせて考えましょう。

複数の写真を並べる場合は、足りない幅を埋めるためだけに枚数を増やさず、それぞれに役割を持たせます。作業する様子と完成した家具を組み合わせるなら、工程と成果を伝えられます。一方、よく似た縦写真を細かく並べるだけでは、スマートフォンで一枚ずつが小さくなることがあります。

パソコンでは縦写真と文章を横に並べ、スマートフォンでは写真と文章を上下に置く構成例
写真の形を変える前に、写真と文章の並べ方を比べます。

追加撮影が必要なのは、見せたい場面が足りないとき

工房の空間や複数人で働く様子を伝えたいのに、手元の写真が一人の顔の近写だけなら、配置を変えてもその場面は見せられません。写真が古く、今は使っていない設備が大きく写っている場合も、新しい撮影を考える理由になります。

撮影を頼むときは、「横長で一枚」だけでなく、主役と残したい範囲を伝えます。例の工房なら、作業台、職人の手元、使う道具を含め、工房の奥行きも見せたいと共有します。画面に言葉を重ねる予定なら、その位置も構成案で示します。

当日の撮影では、一つの構図だけに絞らず、少し広く写したものや主役の位置を変えたものも相談します。周囲に余裕があれば、画面ごとの切り抜きを考えやすくなります。ただし、余白を取るために主役が小さくなりすぎないかも、撮影する方と確認します。

必要な写真が主画像だけなら、すべての写真を撮り直すとは限りません。手持ちの縦写真は仕事紹介や社員紹介に使い、冒頭に必要な場面を追加する案もあります。撮影場所、対象、立ち会う人、日程を決め、画面変更の作業と撮影費用を分けて見積りを受けます。

伝えたい内容が写真に写っている場合は配置変更、場面や現在の状態が不足する場合は追加撮影を検討する図
足りないのが横幅なのか、伝える内容なのかを分けます。

パソコンとスマートフォンで、同じ部分を残せるか確かめる

パソコンで問題がなくても、スマートフォンの画面で両端が切れると、人物や製品が欠ける場合があります。反対に、写真全体を小さく収めると、手元などの細部が見えなくなることもあります。二つの画面案で、最初に見てほしいものが残るかを確かめます。

画面に応じて切り抜き方や画像を変える実装も可能です。MDNの画像要素の解説でも、表示条件に合わせて画像を切り替える方法が紹介されています。一枚をすべての枠に無理に合わせず、同じ仕事が伝わる範囲で写真の見せ方を調整できます。

確認するときは、写真単体だけでなく、実際の見出し、説明、次に進む案内まで置いた状態を見ます。写真を守るために説明が遠くへ離れていないか、文字が主役を隠していないかを合わせて確かめると、レイアウトを選ぶ理由が明確になります。

撮る前に、手持ち写真を使った構成案を比べる

迷う場合は、元の写真を制作会社へ渡し、縦写真を生かす案と、撮影を追加する場合の案を見せてもらいましょう。何が伝わるようになるか、必要な費用と日程はどう変わるかを比べます。素材に合わせて画面を考える段階なら、写真の準備が終わるまで制作を止めずに相談できます。

Bämの原稿・写真の準備から相談できるホームページ制作では、手元の写真を確認し、使える場面と新しく撮る場面を整理します。追加撮影が必要な場合は、場所や対象、日数に応じて費用をご案内します。

参考資料