ホームページに写真は何枚必要か｜ページ数からの逆算と、使い回してよい場所の線引き
ホームページに写真は何枚必要か｜ページ数からの逆算と、使い回してよい場所の線引き
ホームページに使う写真の枚数は、ページ数から逆算できます。目安は「1ページにつき3枚、トップページだけ10枚前後」。5ページ構成なら掲載に使うのは25枚前後、10ページ構成なら40枚前後です。そして重要なのは、用意してもらう枚数は掲載枚数の2〜3倍という点です。渡された写真がそのまま全部使えることはまずありません。解像度・向き・写り込みで脱落する分を見込んで、多めに集めるのが正解です。
graciautoが実際に制作した案件では、9ページ構成のサイトで初回に受け取った素材が25点、追加で32枚を依頼して合計57点から全ページを組みました。約210枚の写真を受け取って、最終的に採用したのが21枚だったサイトもあります。この記事では、実案件の数字をもとに「何枚必要か」「どこまで使い回してよいか」を整理します。撮影やスキャンを始める前に、ここで挙げる考え方でリストを作ってから動くと、撮り直しの往復がなくなります。
必要枚数はページ構成から逆算する
先にページ構成を決め、そこから写真の枚数を割り出します。順番が逆になると、「集まった写真に合わせてサイトを作る」ことになり、伝えたい内容と写真がかみ合いません。
基本の計算はシンプルです。
- 各ページの冒頭（ヒーロー）に1枚 … ページの顔になる大きな写真。ページ数ぶん必要
- 各ページの本文に1〜2枚 … 説明セクションに添える写真
- トップページは加算で10枚前後 … 複数のセクションがあり、他ページより多く使う
- ギャラリーを置くなら、その枚数を丸ごと加算 … 15〜20枚が目安
この式で、5ページの店舗サイトなら25枚前後、10ページの事業サイトなら40枚前後という掲載枚数が出ます。
実案件の内訳を3つ挙げます。いずれも業種だけ記します。
| サイトの規模 | 受け取った素材 | 実際の掲載 |
|---|---|---|
| 1ページ完結型の美容室サイト | 29枚 | ほぼ全量（ギャラリー19枚を含む） |
| 9ページの住宅設備サービス業サイト | 初回25点＋追加32枚 | 全ページのヒーローと本文に分散 |
| 18ページ規模のスクールサイト | 約210枚 | 21枚 |
注目してほしいのは3例目です。210枚受け取って採用21枚、採用率はちょうど1割でした。これは素材の質が低かったのではなく、日常の記録として撮られたスナップ写真から選ぶと、サイトに耐える写真は1割程度になるのが普通だからです。逆に、サイト掲載を目的に撮影した写真なら半分以上使えます。「何枚用意すればいいか」への答えは、写真の出どころで変わります。
- サイト用に撮り下ろす場合 … 掲載予定枚数の2倍を撮る
- 手持ちのスナップ・記録写真から選ぶ場合 … 掲載予定枚数の5〜10倍を集める
「渡した写真が使えない」はなぜ起こるか
受け取った写真が脱落していく理由は、実案件ではっきりパターンが出ています。撮影・提供の前に知っておくと、無駄な往復を防げます。
Excelやワードに貼った写真は、貼った時点で画質が落ちています。 業務報告書に貼られた現場写真を素材として受け取ることがありますが、貼り付け時に圧縮されるため、抽出しても600〜1000px程度しかありません。スマホの小さな表示なら耐えますが、ページ冒頭の大きな写真には使えません。現場写真を提供するときは、書類ではなく撮影した元のファイルをそのまま送ってください。これだけで使える枚数が大きく変わります。
文字が焼き込まれた画像は使えません。 SNS投稿用に日付や説明文を画像に載せたもの、複数枚を1枚にまとめたコラージュは、サイトでは文字の除去も分割もできないため素材になりません。文字入れ前の元写真を残しておく運用にしておくと、後で困りません。
ビフォーアフターはアングルが揃っていないと成立しません。 施工前と施工後で撮る位置や背景が違うと、並べても同じ場所の変化として伝わりません。ビフォーを撮った立ち位置を覚えておき、アフターも同じ位置・同じ向きで撮る。この一手間で、いちばん説得力のある素材が手に入ります。
ロゴは透過データかどうかを確認してください。 白背景が焼き込まれたロゴ画像は、色付きの背景に載せると白い四角が出ます。制作側で切り抜ける場合もありますが、デザインデータ（透過PNGやai形式）があるなら最初から渡すのが確実です。
こうした理由で、受領枚数の3〜5割が脱落するのは珍しくありません。「用意する枚数は掲載の2〜3倍」という冒頭の目安は、この脱落率から来ています。
使い回してよい場所
同じ写真を複数の場所で使うこと自体は、悪いことではありません。役割上、共通であるべき場所すらあります。
サイト全体で共通の要素は、共通のままでよい。 ヘッダーのロゴ、フッター、SNSでシェアされたときに出る画像（OGP画像）は全ページ共通が原則です。ページごとに変える必要はありません。
PC用とスマホ用の出し分けは、使い回しではありません。 同じ写真をPCでは横長に、スマホでは縦長に配置する作りは、実装上は2箇所に同じ写真を置いていますが、閲覧者はどちらか一方しか見ません。枚数を数えるときも1枚と数えて構いません。実案件でも、画面幅ごとに片方だけ表示される構成で同じ写真を割り当てています。
ブログのアイキャッチは、背景テンプレート方式が現実的です。 記事を書くたびに写真を撮るのは続きません。品質の揃った背景写真数枚に、タイトル文字とロゴを重ねるテンプレートを作っておけば、複数記事で背景が重なっても統一感として機能します。graciautoのブログ自体がこの方式です。
トップページと下層ページで同じ写真が1〜2枚重なるのも許容範囲です。 トップは各ページのダイジェストという役割があるため、下層の代表写真がトップにも出るのはむしろ自然です。
使い回しを避ける場所
一方で、同じ写真の使い回しがサイトの印象を直接下げる場所があります。
各ページの冒頭写真は、全ページ別にします。 ページを移動するたびに同じ写真が最上部に出ると、閲覧者は「ページが変わっていない」と感じ、サイト全体が薄く見えます。実案件の9ページ構成では、追加で受け取った32枚をまず各ページの冒頭に優先配分しました。枚数が足りないときに最優先で確保すべきなのがここです。
一覧のサムネイルに共通画像を使うと、一覧の意味がなくなります。 実際にあったケースでは、50本超の記事に対してサムネイル画像が5枚しかなく、カテゴリ共通の画像を使い回した結果、同じカテゴリの11本がすべて同じ写真で並びました。一覧は「どれを読むか選ぶ場所」なので、全部同じに見えた時点で選べません。このケースでは写真をやめ、記事ごとに色と図柄が変わるカード型のデザインに切り替えました。枚数が用意できないなら、写真に固執せず写真以外の見せ方に変えるのも正しい判断です。
同一ページ内の複数セクションで同じ写真を繰り返すのは避けます。 1ページの中で同じ写真が2回出ると、素材不足がそのまま伝わります。ページ内では全て別の写真にする前提で枚数を数えてください。
撮影前に「写真割り当て表」を作る
必要枚数の計算と使い回しの管理を同時に解決するのが、写真割り当て表です。作り方は簡単で、スプレッドシートに次の3列を作るだけです。
- 場所 … 「トップ・冒頭」「料金ページ・本文2」のように、写真が入る枠を全部書き出す
- 写真 … その枠に割り当てるファイル名
- 内容メモ … 「外観・引き」「作業中・手元の寄り」のような写真の説明
先に1列目の「場所」を全部埋めると、その行数がそのまま必要枚数です。撮影前にこの表を作れば撮影リストになり、写真を割り当てながら埋めれば重複チェック表になり、公開後に「あの写真どこで使ったか」を探す台帳にもなります。実案件でも、20枚規模の差し替えではこの割り当て表を必ず作ってから作業しています。後からの写真差し替えが、表を見て該当箇所だけ触れば済むようになるからです。
撮影リストとして使う場合は、内容メモに「引き（全体）か寄り（手元・詳細）か」を書き分けてください。同じ場面でも引きと寄りの2パターンがあると、ページ冒頭の大きな枠には引き、本文の小さな枠には寄り、と振り分けられて歩留まりが上がります。
運用で写真を減らさない・混ぜない
公開後の運用にも、写真に関して押さえておくべき点が2つあります。
サイトの素材置き場に、使わない写真を残さないでください。 WordPressのメディアライブラリに候補写真を全部アップして、その中から選ぶ進め方をすると、不採用の写真がサーバーに残り続けます。残った写真は、一覧から誤って選択されたり、自動取得の仕組みに拾われたりして、意図しない場所に表示されるリスクになります。実際、無関係な写真がメディア内に紛れていたために本番ページへ表示されかけた事例があり、以降は採用が決まった写真だけをアップし、候補選定はサーバーの外で行う運用にしています。
掲載した枚数は、数え方を決めて記録しておきます。 スライドショーは同じ写真が複製されて実装されることがあり、「表示される写真の種類」と「実装上の画像ファイル数」がずれます。クライアントへの報告や検収では「トップに写真10種類」のように種類で数えると認識が揃います。
まとめ
- 必要枚数はページ構成から逆算する。目安は1ページ3枚＋トップ10枚前後、ギャラリー分は加算
- 用意する枚数は掲載の2〜3倍。スナップからの選別なら5〜10倍（実例では210枚中、採用21枚）
- 書類貼付の写真・文字焼き込み・アングル不一致のビフォーアフターは脱落する。元ファイルをそのまま渡すのが最善
- 共通要素・PCスマホの出し分け・アイキャッチ背景は使い回してよい。各ページ冒頭・一覧サムネイル・同一ページ内は避ける
- 撮影前に写真割り当て表を作る。撮影リスト・重複チェック・運用台帳を1枚で兼ねられる
写真の枚数は、見積もりにもスケジュールにも直結します。制作を依頼する前にページ数の当たりをつけ、割り当て表で必要枚数を出してから撮影に動く。この順番なら、撮り直しの往復も「写真待ちで制作が止まる」事態も避けられます。graciautoでは構成案の段階で必要な写真リストをお渡ししています。手持ちの写真で足りるか判断がつかない場合も、お気軽にご相談ください。