簡単な答え: ソーシャルシェアリング画像とは、Open Graph画像のことです。これは、商品やブログのURLがInstagramのDM、WhatsApp、Slack、X、またはFacebookに貼り付けられたときに表示される画像です。ページのヘッド内のog:imageで設定され、商品写真ではありません。Shopifyのデフォルトはしばしばストアのロゴか何も表示されないことがあります。ランキングには直接影響しませんが、共有されたリンクがクリックされるかどうかに影響します。ページ内画像のランキング要因についてはShopifyの画像SEOを、altテキストについては商品画像のaltテキストを参照してください。
多くのShopifyストアはこの問題を同じ方法で発見します。誰かがグループチャットで商品リンクを共有すると、灰色のボックス、引き伸ばされたロゴ、または全く違う商品が表示されるのです。この修正は小さく、ほとんどの場合見過ごされがちです。なぜなら、Shopifyの管理画面にはこれを表示するものがないからです。
プレビューを実際に制御するもの
3つのタグがすべて<head>内にあります:
og:image— 画像のURL。これが重要です。og:titleとog:description— 見出しとその下のテキスト。設定されていない場合、SEOタイトルとメタディスクリプションにフォールバックしますが、通常は問題ありません。twitter:card—summary_large_imageに設定すると、Xでサムネイルではなくフル幅のプレビューが得られます。
og:imageが欠けている場合、各プラットフォームが推測します。Facebookはページ上で最大の画像を選びますが、Shopifyのコレクションページではしばしばプロモーションバナーが選ばれます。SlackやWhatsAppは何も表示しないことが多いです。
| プラットフォーム | フォールバック動作 | 典型的な結果 |
|---|---|---|
| ページ上で最大の画像を選ぶ | しばしばプロモーションバナーを表示(意図した商品画像ではない) | |
| Slack | og:imageがない場合は何も表示しない | プレビュー画像なしでリンクが共有される |
| og:imageがない場合は何も表示しない | プレビュー画像なしでリンクが共有される |
実際に重要な仕様
1200×630ピクセル。 これは主要なプラットフォームがクロップする比率です。正方形の商品写真は中央でクロップされるため、背の高い商品(ボトルやドレスなど)は上下が切り取られます。
1 MB未満、理想的には300 KB未満。 WhatsAppやiMessageはサイズが大きすぎる画像を黙ってスキップします。これがデスクトップのSlackでリンクプレビューが正しく表示され、電話では何も表示されない理由です。
https://を含む絶対URL。 プロトコル相対の//cdn.shopify.com/… URLはブラウザでは動作しますが、多くのクローラーでは失敗します。
JPEGまたはPNG。 ソーシャルクローラーでのWebPサポートはまだ一貫していません。これはShopifyストアでWebPが不適切な唯一の場所です。
Shopifyでの設定方法
Shopifyの管理画面ではog:imageを直接設定できません。これはtheme.liquidで設定され、多くのテーマには合理的なデフォルトが含まれています:
商品ページはフィーチャー画像を使用するべきです。コレクションページはコレクション画像を使用し、ストアロゴにフォールバックします。ブログ記事は記事画像を使用します。それ以外は単一のブランド化されたデフォルトにフォールバックします。
一般的なバグは、テーマがog:imageを一度、グローバルにストアロゴに設定することです。そのため、すべての商品がロゴとして共有されます。Facebookのシェアデバッガーに商品URLを貼り付けることで確認できます。これにより、クローラーが見るものを正確に表示し、変更後に再スクレイプを強制できます。
なぜこれはランキング要因ではないのか、そしてそれでも重要な理由
Open GraphタグはGoogleによるランキングには使用されません。どれだけog:imageを工夫しても順位は変わりません。
変わるのは、共有リンクのクリック率です。共有は多くのShopifyストアが最初のリンクを得る方法です。灰色のボックスとして200人のFacebookグループに共有された商品は無視されますが、きれいな商品写真付きの同じリンクはクリックされます。SEOの価値は二次的であり、現実的です。クリックされる共有リンクはリンクされ、リンクはランキングを動かします。
また、3年前には存在しなかった理由でも重要です。AIの回答エンジンは、ページを引用するときに画像付きのソースカードを表示することが増えています。og:imageが欠けていると、あなたのストアはテキストとして引用され、競合他社は商品写真付きで引用されます。
カタログ全体での確認
1つの商品は簡単に確認できます。失敗モードはフォールバックが機能し、特定のケースが機能しないことです。フィーチャー画像のない商品、テーマが編集された後に作成されたコレクション、他のプラットフォームからインポートされたブログ投稿などです。
すべてのURLをFacebookデバッガーに貼り付けるのはスケールしません。RankEngineの監査レポートは、他のオンページチェックとともに、URLごとに欠落しているog:image値やサイズが大きすぎる値を報告します。これが、黙ってフォールバックしたサブセットをキャッチする唯一の方法です。
関連
- Shopifyの画像SEO — ファイルサイズ、フォーマット、ランキングやCore Web Vitalsに影響を与える画像作業。
- 商品画像のaltテキスト — altテキストの目的と、それが本当に役立つ場所。