店舗サイトの写真をスマホで撮る。最低条件と、載せ方で落とすもの

店舗サイトの写真は、プロに頼めれば一番です。ただ、メニューの入れ替えや季節の変更にそのたび依頼するのは現実的ではありません。

スマホで撮る前提で、最低限どこを守るか。そして撮った写真を、載せ方で台無しにしないための点を整理します。

撮影の条件は、公式に3つ書かれている

Googleビジネスプロフィールの写真ガイドラインに、品質についての記述があります。

品質: ピントが合っていて十分な明るさのある写真を使用します。大幅な加工や過度のフィルタ使用は避けてください。雰囲気をありのままに伝える画像をお選びください。

ピント、明るさ、加工しすぎない。この3つです。プロフィール向けの記述ですが、サイトに載せる写真でも基準は同じで構いません。画像検索のドキュメントにも、ぼやけた不明瞭な画像よりも高画質の写真はユーザーの関心を引くと書かれています。

3つ目の「ありのまま」は、見た目の話だけではありません。実物と違う印象を与える画像は、来店時の落差になります。生成AIで作った画像を使う場合の線引きは店舗の販促にAI生成画像を使う前にに整理しました。

スマホで撮るときに効くこと

公式の3条件を満たすために、現場でやることに落とすとこうなります。ここは各店の環境によるので、絶対の正解ではありません。

• 明るい時間に撮る。店内は照明だけだと暗く転びます。昼間にカーテンや扉を開けて撮るほうが早いです
• 撮る前に被写体をタップする。スマホはピントと明るさを合わせ直します。料理なら主役の一皿に合わせます
• 逆光を避ける。窓を背にして撮ると、手前が暗くなります。窓を横か後ろに回ってください
• 水平を出す。外観と店内は、傾いているだけで素人感が出ます。グリッド表示をオンにしてください
• 同じ構図で数枚撮る。ぶれは後から直せません。選べる状態にしておきます

フィルタは控えめに。彩度を上げた料理写真は、実物を見たときの落差を生みます。「大幅な加工や過度のフィルタ使用は避けてください」という記述は、見栄えの話ではなく期待値の話です。

載せ方で落とすもの

ここからが本題です。良い写真を撮っても、置き方を間違えると検索に拾われません。

1. CSSの背景画像にしない。ドキュメントに明記されています。

Google は、<img> 要素の src 属性の画像を検出できます（<picture> 要素などの他の要素に囲まれている場合も含む）。ただし、CSS の画像はインデックスに登録しません。

悪い例として <div style="background-image:url(puppy.jpg)"> が挙げられています。デザイン上の都合で背景画像にしている店舗サイトは少なくありません。料理や外観など見てほしい写真は、<img> で置いてください。

2. ファイル名を直す。スマホから上げた IMG_0023.JPG のままにしない、ということです。

たとえば、IMG00023.JPG よりも my-new-black-kitten.jpg が推奨されます。

image1.jpg、pic.gif、1.jpg のような一般的なファイル名は避けるよう書かれています。アップロード前にリネームするだけなので、手間に対して効果の見合う作業です。

3. 代替テキストを入れる。最も重要な属性とされています。

代替テキストは、スクリーン リーダーを使用するユーザーや、低帯域幅のネットワークを使用しているユーザーなど、ウェブページの画像を見ることができないユーザー向けの補助機能としても役立ちます。

書き方にも条件があります。ページの内容に沿った、情報に富む、役に立つものにすること。そしてキーワードを羅列しないことです。悪い例として、同じ意味の語を並べた代替テキストが挙げられ、ユーザーエクスペリエンスが低下するだけでなく、サイトがスパムとみなされる要因となる場合もあると書かれています。「渋谷 美容室 カット 安い 人気」のような書き方は避けてください。

4. 関連するテキストの近くに置く。Googleは画像のキャプションやページタイトルなど、周辺のコンテンツから画像の情報を抽出するとされています。料理の写真は料理の説明の近くに、外観はアクセスの説明の近くに置くのが素直です。

5. 画面幅に応じて出し分ける。<picture> 要素や img 要素の srcset 属性でレスポンシブな画像を指定できます。ただし、一部のブラウザやクローラーはこれらを理解できないため、常に src 属性で代替URLを指定することが推奨されています。

対応している形式は、BMP、GIF、JPEG、PNG、WebP、SVG、AVIF です。ファイル名の拡張子を形式に一致させることも推奨されています。

重さで表示が遅くなる

もうひとつ、写真が原因で起きる問題があります。

画像が原因で全体的なページサイズが大きくなり、ページの読み込みが遅く、通信費が高くなる場合がよくあります。

スマホで撮った写真は、そのまま上げると1枚で数MBになることがあります。アップロード前に縮小するか、サイト側で最適化してください。ただし圧縮だけでは表示速度が改善しない場合もあります。その理由と、ファーストビューの画像で避けるべき設定は店舗サイトのスマホ表示速度に書きました。

プロフィールに載せるときは条件が別

同じ写真をGoogleビジネスプロフィールにも使う場合、技術要件が決まっています。形式はJPGまたはPNG、サイズは10KB〜5MB、推奨解像度は720×720ピクセル、最小は250×250ピクセルです。

ひとつ注意点があります。カバー写真について、次の記述があります。

選択したカバー写真の画質が低い場合や、お客様のビジネスのカバー写真としてあまりふさわしくないと判断される場合は、顧客が投稿した写真が代わりに選択されることがあります。

画質が足りないと、お客さんが撮った写真に差し替わるということです。カバーだけは特に、明るくピントの合った1枚を用意してください。

アップロードした写真には保留中・不承認・公開のステータスが付き、表示されるまで最長で24〜48時間かかることがあります。枚数の目安はGoogleビジネスプロフィールの写真は何枚必要かにまとめました。

まとめ

• 公式の条件は「ピントが合っている」「十分な明るさ」「大幅な加工やフィルタを避ける」
• 明るい時間に、被写体をタップしてから、逆光を避けて、水平を出して撮る
• CSSの背景画像はインデックスに登録されない。見せたい写真は <img> で置く
• ファイル名を内容が分かるものに変える。IMG0023.JPG のままにしない
• 代替テキストを入れる。キーワードの羅列はスパムとみなされる要因になる
• 関連するテキストの近くに置く
• srcset や <picture> を使う場合も src で代替URLを指定する
• 画像が重いとページの読み込みが遅くなる。上げる前に縮小する
• プロフィール側は10KB〜5MB、推奨720×720。カバーは画質が低いと差し替わる

自店のサイトとプロフィールがどう見えているかを外から確認したい方は、無料のMEO診断をご利用ください。店名とGoogleビジネスプロフィールのURLだけで送れます。