OGP設定とSNS連携
OGP(Open Graph Protocol)は、SNSでURLがシェアされた際の見え方を制御する仕組みです。設定していないと、意図しない画像やテキストが表示されることがあります。
① なぜOGP設定が必要か
OGPを設定していないサイトの記事をSNSでシェアすると、意図しない画像(サイトロゴやページ内の関係ない画像)が使われたり、タイトル・説明文がページのソースコードからそのまま抜き出されて不自然な表示になったりすることがあります。逆にOGPを適切に設定すれば、シェアされた投稿の見た目を意図通りにコントロールでき、クリック率の向上にもつながります。ブログ・メディアサイトはもちろん、コーポレートサイト・ECサイトでも設定しておくべき基本的なSEO・マーケティング施策の一つです。
② OGPが制御する要素
| タグ | 役割 |
|---|---|
| og:title | シェア時に表示されるタイトル |
| og:description | シェア時に表示される説明文 |
| og:image | シェア時に表示される画像(アイキャッチ画像が使われることが多い) |
| og:type | コンテンツの種類(記事なら"article"、トップページなら"website"等) |
| og:url | 正規のURL。SNS側にどのURLとして認識させるかを指定 |
| twitter:card | X(旧Twitter)での表示形式(大きい画像付きカード等) |
③ 推奨画像サイズ
og:imageに設定する画像は、1200×630px(アスペクト比1.91:1)が最も安定して表示されるサイズです。極端な縦長・正方形に近い画像は、SNSによって不自然にトリミングされることがあるため避けたほうが無難です。
- 推奨サイズ:1200×630px(最小600×315px)
- ファイル形式:JPEG・PNG(アニメーションGIFは静止画として扱われる場合あり)
- ファイルサイズ:8MB以下を目安に
- 文字を大きく載せる場合は、SNSごとのトリミングで見切れないよう中央寄せにする
④ 設定方法
Yoast SEO・All in One SEO・Rank MathなどのSEOプラグインを導入している場合、投稿編集画面から各ページ個別にOGP画像・タイトル・説明文を設定できます。特にアイキャッチ画像を必ず設定しておくことが、シェア時の見た目を安定させる最も簡単な方法です。
SEOプラグインを導入しておらず、OGP設定だけを軽量に追加したい場合は、専用プラグインのOpen Graph and Twitter Card Tagsが選択肢になります。SNSシェア用のOGP・Twitterカードタグの自動付与に特化しており、SEOプラグインを使っていないサイトにも導入しやすいのが特徴です。
⑤ 確認方法とキャッシュの注意点
設定後は、必ず実際のシェア表示を確認しましょう。
- Facebook:Meta公式の「シェアデバッガー」でURLを入力し、「もう一度スクレイピング」を実行すると最新の情報を確認できます。
- X(旧Twitter):2022年以降、公式のCard Validatorはプレビュー機能を廃止しており、外部から公式にプレビュー確認する手段は提供されていません。実際の見た目は、投稿作成画面(Tweet Composer)でURLを貼り付けて確認するのが最も確実です。
- LINE:公式の確認ツールはないため、実際にトークやタイムラインでURLを送信して見た目を確認します。