ホームページを作り始めると、多くの人が立ち止まるのが写真選びです。何枚用意すればよいのか、顔写真は必要なのか、スマートフォンで撮った写真でも公開してよいのか。悩みどころは一つではありません。
この記事では、トップ、プロフィール、サービス紹介それぞれの写真の役割から、掲載前に確認しておきたい権利や個人情報の扱いまで、順を追って整理します。
写真選びは枚数より目的が先
ホームページを作り始めると、まず気になるのは写真の枚数かもしれません。手元の写真を並べてみても、どれを選べばよいのか迷う方は少なくないでしょう。
ただし、最初に決めたいのは枚数ではなく、その写真で何を伝えたいかです。ここが定まると、写真は選びやすくなります。
教室の入口を伝えたい写真なのか、講師の雰囲気を伝えたい写真なのかによって、選ぶべき一枚は変わります。商品や作品の細部を見せたい場合には、また違う一枚が必要です。
写真は文章の代わりではなく、文章だけでは伝わりにくい部分を補う役割を持っています。ページの内容と関係のある写真を近くに置くと、読みやすさが増すという考え方です。
候補を選ぶときは、一枚につき一つの役割を書き出してみます。「空間の明るさを伝える」「サービスの流れを補う」など、短い言葉で十分です。役割を説明できない写真は、急いで載せなくてもかまいません。
たくさん並べるより、ページの内容に合う一枚を少しずつ整えるほうが、はじめての方にも読みやすいホームページになります。

ページごとに写真の役割を分ける
ホームページには、トップ、プロフィール、サービス紹介など複数のページがあります。
訪れる人がそれぞれのページで知りたいことは、実は同じではありません。同じ写真を何度も使い回すより、そのページの疑問に応える一枚を選ぶほうが親切です。
ここでは3つの用途に分けて考えます。
トップページは事業の入口を見せる
トップページは、事業の内容を知ってもらう入口です。最初に置く写真には、何をしている場所なのかが伝わるものを選びます。
教室ならレッスン空間、サロンなら室内、作品を扱う事業なら代表的な一点などが候補です。写真だけですべてを説明する必要はありません。事業名や短い説明文と並べたときに、内容が分かりやすいかどうかを確かめます。
雰囲気だけを優先すると、何のホームページなのか伝わりにくくなることがあります。美しい風景写真を使いたい場合は、サービスとのつながりが読者に伝わるかを見直すと安心です。
ライフデザインアカデミーのように複数の学びを扱う場合も、ページで最初に案内したい内容に合わせて写真を選ぶという考え方が役立ちます。
プロフィールは安心材料を選ぶ
プロフィールページでは、運営する人や事業の姿勢を知りたい読者が多いものです。顔写真だけが選択肢というわけではありません。
本人の写真、仕事中の様子、教室や店舗の外観、ロゴなど、公開できる範囲から選びます。大切なのは、プロフィール文と写真の内容が大きくかけ離れていないことです。
顔写真を載せることに抵抗があるなら、無理に公開範囲を広げる必要はありません。横顔や手元の写真を使う方法もあります。どの写真が事業の説明を補ってくれるかを基準にすると、選びやすくなります。
以前撮った写真を使うときは、現在のサービスや場所と合っているかも確かめます。服装や背景よりも、今の活動を誤解なく伝えられているかを見ると、判断しやすくなります。

サービス紹介は利用場面を補う
サービス紹介では、読者が文章だけでは想像しにくい場面を、写真で補います。道具、空間、作品の細部、準備の様子などが候補です。
人物を入れなくても、机の配置や使う道具だけで流れが伝わることがあります。実在するお客さまの写真を、わざわざ例として用意する必要はありません。
写真に写っていない内容まで伝わってしまう表現は避けたいところです。少人数の写真を見せながら、常に同じ人数で行っているように読める説明を添えると、誤解につながる場合があります。
写真と本文を並べて、その写真がどの説明を補っているかを確かめます。答えが見つからない一枚は、別のページで使うか、掲載を見送るという選択もあります。
写真の用意方法を無理なく決める
ホームページ用の写真をすべて新しく撮ろうとすると、準備の負担が大きくなりがちです。まずは、今ある写真と足りない写真を分けるところから始めます。
手元の写真を棚卸しする
スマートフォンやパソコンにある写真を、用途別のフォルダーへ分けます。トップ、プロフィール、サービス、空間、商品など、分かりやすい名前を付けておくと管理しやすくなります。
次に、内容が今も正しい写真だけを残していきます。終了したサービスや以前の料金表、移転前の場所などが写り込んでいないかも見ておくと安心です。
似た写真が複数ある場合は、表情や色合いだけで決めないようにします。文字を載せる余白があるか、縦長と横長のどちらで使うかまで見ておくと、候補を絞りやすくなります。
自分で撮る範囲を絞る
自分で撮影するときは、足りない役割の写真から手をつけます。トップ用の横長写真、プロフィール用の一枚、サービスの様子が伝わる手元写真など、撮るものを先にメモしておくとスムーズです。
窓からの光や室内照明を活用し、暗すぎない場所で撮影します。このとき、画面の端に個人情報や不要な物が入っていないかも見ておくと安心です。
一度に多く撮るより、同じ場面を少し角度を変えて数枚撮るほうが選びやすくなります。公開する場所に合わせて、縦と横の両方を用意しておく方法もあります。
撮影依頼や素材写真を補助にする
自分で撮るのが難しい写真だけ、撮影を依頼するという方法もあります。依頼する前に、使うページ、必要な向き、撮影場所、納品後に使える範囲を共有しておくと、後々の行き違いを防げます。
素材写真は、概念や季節感を補う用途には使いやすいものです。実際の教室や商品、設備を示す場面では、素材写真と実物を混同させない配慮が必要です。
撮影依頼でも素材写真でも、見た目だけで決めないことが肝心です。加工や掲載期間、他の媒体での利用条件が分からない場合は、提供元や撮影者へ確認しておきます。
掲載前に権利と公開範囲を確認する
写真が用意できても、そのまま公開できるとは限りません。誰が撮ったのか、誰が写っているのか、背景に何が写り込んでいるのかを、分けて確認していきます。
写真を使える条件を確認する
自分以外の人が撮影した写真は、撮影者との取り決めを確かめておきます。文化庁の契約書例でも、写真の著作物を利用する場面を想定し、利用許諾の内容を定めておく例が紹介されています。
無料素材にも有料素材にも、それぞれ利用条件があります。「無料」と表示されていても、どの用途でも同じ条件とは限りません。商用利用の可否、加工の可否、クレジット表記の要否を、提供元の規約で確かめます。
制作会社や知人から受け取った写真も、ホームページで使えるかどうかは別途確認が必要です。撮影を依頼した事実だけで判断せず、納品時の契約や当時のやり取りを見直しておきます。
人物が写る写真は同意を確かめる
個人情報保護委員会の案内によると、本人を判別できる写真は一般に個人情報に当たります。不特定多数へ提供する場合は、自主的に本人の同意を得る取り組みが望ましいとされています。
教室やイベントの写真を使うときは、撮影そのものへの同意だけでなく、ホームページへの掲載が含まれているかどうかも確認しておきたいところです。公開期間や掲載するページも共有しておくと、認識の違いを減らせます。
子ども、受講者、スタッフなどが写る写真は、立場や撮影状況によって確認先が変わることもあります。
判断に迷う場合は掲載を保留し、運営ルールや専門家の助言を確認することをおすすめします。
背景に写る情報も見直す
写真の中心だけでなく、背景も拡大して確認します。名札、予約表、伝票、郵便物、車のナンバー、パソコン画面などが写り込んでいることがあります。
自宅を仕事場にしている場合は、窓からの景色や表札から場所が推測されないかも見ておきます。公開する必要のない情報は、撮影時に片付けるか、別の角度から撮り直すと安心です。
ぼかし加工だけに頼らず、元の写真をそのまま公開してよいかどうかから考えます。一度公開した画像は、想定した範囲を越えて見られる可能性を踏まえて選ぶことが大切です。
見やすさと伝わりやすさを整える
写真の内容が決まったら、実際に掲載する画面での見え方を確認します。パソコンでは整って見えても、スマートフォンでは大切な部分が切れてしまうことがあります。
スマートフォンでも見切れないか確認する
トップに使う横長の写真は、スマートフォンでは左右が切れてしまう場合があります。人物の顔や商品の中心が、端に寄りすぎていないかを確認します。
写真の上に文字を重ねるときは、背景との明るさが近すぎないかも見ておきます。文字入りの画像だけで重要な説明を伝える方法は避け、同じ内容を通常の文章でも用意しておくと安心です。
公開する前には、パソコンとスマートフォンの両方で表示を確かめます。実際に使うホームページの仕組みによって切り抜かれ方が変わるため、元画像だけでなく掲載画面でも確認することが大切です。
画質と読み込みやすさの両方を見る
Googleの公式資料は、鮮明な画像をすすめる一方で、画像によってページ全体が重くなり、読み込みが遅くなる場合があると説明するものです。
元の大きな写真をそのまま何枚も載せるのではなく、表示する場所に合う大きさへ整えます。ホームページの制作担当者や利用しているサービスに、推奨するサイズや形式があるかを確認しておくとよいでしょう。
圧縮した後は、顔や商品の細部が崩れていないかも見ておきます。画質か速度のどちらかだけを優先せず、読者が内容を確かめられる範囲で整えることが大切です。
写真の意味を代替テキストで補う
画像を見られない方へ、内容や役割を伝える文章が代替テキストです。W3Cは、情報を伝える写真には重要な内容を短く説明する代替テキストを用意するよう案内しています。
たとえば教室の入口を案内する写真であれば、色や雰囲気を並べるよりも、入口を見つける手がかりを簡潔に書くのがおすすめです。写真の近くの本文に同じ情報がある場合は、あえて重複させない考え方もあります。
飾りとして置く画像には、読み上げの妨げにならない設定が向いています。写真の目的や周囲の文章によって書き方は変わるため、すべてに同じ説明を入れる必要はありません。
ファイル名も「IMG0001」のままにせず、内容が分かる短い名前に整えておくと親切です。公開する画面では、代替テキストがキーワードの羅列になっていないかも見直しておきます。
迷ったときの写真選び手順
写真選びが止まってしまったときは、次の順で一枚ずつ確かめていきます。
そのページを訪れた人が、まず何を知りたいのかを一つだけ書き出します。
文章の中で、写真があるとより伝わりやすくなる部分を探します。
その部分を補える候補を、3枚までしぼります。
撮影者、利用条件、写っている人の同意を確認します。
背景に写り込む個人情報や、現在のサービス内容と合っているかを見直します。
パソコンとスマートフォンの両方で、表示を確かめます。
必要な代替テキストと、分かりやすいファイル名を付けます。
候補が2枚残ったときは、きれいさではなく役割で比べます。ページの説明をより正確に補えるほうを選ぶと決めやすくなります。
公開した後も、場所やサービス、スタッフなどが変わった時期には見直します。写真が古くなっても、すべてを一度に交換する必要はありません。誤解につながりやすい一枚から、順に更新していきます。
まとめ
ホームページの写真は、枚数や華やかさよりも、そのページで何を伝えたいかから選びましょう。用途、利用条件、公開範囲、見え方を順に確かめながら、今必要な一枚から整えていくと、無理なく形になっていきます。
ホームページの整え方やWebでの発信について、基礎から確かめてみたいと感じた方は、ライフデザインアカデミーの講座をぞいてみてください。いきなり決めなくても、まずは雰囲気を確かめるだけで、次の一歩が見えやすくなります。
あわせて講座一覧のページもご覧いただくと、SNSやWeb活用など、ご自身のペースで学べる講座が見つかるかもしれません。
ライフデザインアカデミーでは、プロフェッショナル講師による各種講座を開講しています。対面講座からオンライン講座まで、学習環境に合わせて受講できます。
→ 講座一覧とお申し込みはこちら
上記に掲載していない限定講座(非公開講座)も定期的に開講していますので、学びたいことのご相談はお問い合わせよりお気軽にご連絡ください。

