写真がないホームページの作り方｜文字・図形・素材の使い分け

写真の役割を、先に決める

写真は大きく分けて、実物を伝える役割と、雰囲気をつくる役割があります。商品、店舗、施工内容などを見て選ぶサービスでは、実物の写真が判断材料になります。一方、相談や開発のようなサービスは、対応内容や進め方を図と文章で説明する方法も考えられます。

使う写真を探す前に、「この画像があると、訪問者は何を判断できるか」を一文にします。答えが曖昧なら、写真を大きく置くより、必要な説明を増やした方が役に立つことがあります。

文字の大きさに差をつける
事業を説明する見出し、補足の文章、リンクの順に視線が進むようにします。すべてを大きくすると、何が大切かがわかりにくくなります。
余白で情報のまとまりをつくる
関連する内容は近くに、別の話題には少し間隔を置きます。余白を埋めるためだけに装飾を足す必要はありません。
図形に説明の役割を持たせる
流れはステップ、比較は並列のカード、まとまりは囲みで示します。図を見たあとに、文章の内容を理解しやすくなるかを確認します。

装飾としての図形も使えますが、見出しに重なったり、ボタンのように見えたりしないようにします。小さな画面で文字が読みづらくなる場合は、装飾を減らす方が有効です。

NORTHLINEの制作解説では、同じ架空のコンサルティング会社について、写真版と図形版を用意しています。写真版はオフィスの奥行きで場の空気を伝え、図形版は直線と濃い青で事業の方向性を表現しています。

澄の制作解説では、写真版は木の机と植物、図形版は円と罫線を使っています。同じ内容でも、素材の選び方で印象が変わることを比較できます。いずれも自主制作であり、実在する企業の実績ではありません。

比べるときの視点
「写真がある方がよいか」だけでなく、事業の内容を理解できるか、依頼する前の不安が減るか、更新時に同じ方向性の素材を用意できるかを見てください。

写真を使う場合は、配布元の利用条件を確認します。「無料」という言葉だけで判断せず、商用利用、加工、クレジット表記、再配布などの条件を、使う素材ごとに確認します。取得元のURLと確認日を残しておくと、後から確認しやすくなります。

人物や場所のイメージ写真を、実際のスタッフや事務所であるかのように使うのは避けます。実物の説明が必要な部分は、自分で撮影した写真を用意するか、イメージであることがわかる表現にします。

制作を始める前に、提供サービス、対象のお客さま、依頼の流れ、連絡方法、料金の考え方を整理します。そのうえで、文章だけでは伝わりにくい部分に、写真や図を足します。

素材が少ないことを前提にしたデザインは可能です。何も載せないのではなく、判断に必要な情報を、読みやすい形に組み立てることが大切です。