ページを公開してリンクをシェアしたら——プレビューに違う画像が出る、あるいは何も表示されない。OG image のトラブルは、ほぼ例外なく次の3つのどれかです:**タグの欠落、画像 URL の不備、古いキャッシュ。**本ガイドでは、シェアする前に OG image をプレビューする方法と、それぞれの障害が起きたときの直し方を解説します。
まずタグを確認する
ツールに頼る前に、ページのソースを表示(Ctrl+U / Cmd+U)して、<head> に次のタグがあることを確認しましょう:
<meta property="og:title" content="Launch day: v2.0" />
<meta property="og:description" content="Everything new in this release." />
<meta property="og:image" content="https://example.com/og/launch.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />次の2つのルールだけで、大半のバグはすぐに見つかります。
og:imageは絶対 HTTPS URL でなければなりません。相対パス(/og/launch.png)は、ほとんどのクローラーで失敗します。- 画像 URL は誰でもアクセスできる必要があります——シークレットウィンドウで開いてみてください。ログインが必要だったり、リダイレクトされたり、404 になる場合、どのプラットフォームも取得できません。
そもそも画像サイズが正しいか自信がなければ、まず OG image サイズガイドから始めましょう——正しい寸法は、プレビューを成立させるもう半分の条件です。
プラットフォーム別のプレビューツール
主要プラットフォームには、クローラーが実際に見ている内容をそのまま表示する公式デバッガーがあります。
| プラットフォーム | ツール | できること |
|---|---|---|
| Sharing Debugger(シェアデバッガー) | 取得済みカードの表示、警告の一覧、「Scrape Again」ボタンによる再取得 | |
| Post Inspector(投稿インスペクター) | プレビューを表示し、検査のたびに LinkedIn のキャッシュを更新 | |
| X (Twitter) | 下書きポストを作成 | X は単体の Card Validator プレビューを廃止——リンクを下書きに貼る(または自分に DM する)と実際のカードを確認できます |
| Slack | 自分にメッセージを送る | Slack はリアルタイムで展開。自分宛て DM は最速の OG プレビューです |
| Discord | 任意のチャンネルに貼り付け | Open Graph タグから即座に埋め込みが表示されます |
| WhatsApp / Telegram | 「Saved messages」/自分宛てに送信 | どちらも og:image を読み取ります。Telegram はキャッシュが強力(後述) |
実用的なワークフローは、タグを直す → Facebook Sharing Debugger を実行(警告が最も詳しい)→ 本命のプラットフォームで最終確認、の順です。
キャッシュを強制的に更新する
プラットフォームはリンクプレビューを強力にキャッシュします——ときには数週間も。OG image を更新したのに古い画像が表示され続ける場合は:
- Facebook: Sharing Debugger を開いて Scrape Again をクリック。
- LinkedIn: URL を Post Inspector に通す——検査そのものがキャッシュを破棄します。
- X: 手動更新はありません。キャッシュは通常1週間ほどで自然に切れます。
- Telegram:
@WebpageBotに URL を送ると、再クロールを強制できます。 - 万能の最終手段: 画像 URL 自体を変えること。バージョンクエリを付ける(
/og/launch.png?v=2)か、より確実なのはコンテンツハッシュ入りのファイル名にすることです。どのプラットフォームも、即座に新しい画像として扱います。
OG image をパイプラインで自動生成しているなら、最初からファイル名にバージョンやハッシュを含めておきましょう。キャッシュ無効化の悩みは完全に消えます。
それでも OG image が表示されないときは
デバッガーも実行したのに画像が出ない? このリストを上から順に確認してください。
- 画像が大きすぎる、または読み込みが遅すぎる。 数 MB のファイルはクローラーがタイムアウトします。1 MB 以下(WhatsApp なら 300 KB を大きく下回る)に抑えましょう。
- 画像サイズが大型カードのしきい値未満。 600×315 未満だと、Facebook は小さなサムネイルに落とします。1200×630 で書き出しましょう——詳細はサイズガイドへ。
- ページがクローラーをブロックしている。
robots.txt、ファイアウォール、ボット対策レイヤーがfacebookexternalhit、Twitterbot、LinkedInBotに 403 を返していないか確認を。 - タグがクライアントサイドで注入されている。 ほとんどのソーシャルクローラーは JavaScript を実行しません。OG タグはサーバーレンダリングされた HTML に含まれている必要があります。
- 複数の
og:imageタグが競合している。 プラットフォームは通常、最初の1つを採用します——テンプレートやプラグインが残した余分なタグを削除しましょう。
公開後ではなく、公開前にプレビューする
上のデバッガーは、問題が起きた後に原因を教えてくれるものです。より安上がりな習慣は、公開前に画像を正しく仕上げてしまうこと。当サイトの無料 OG image ジェネレーターは、編集中の画面を正確な 1200×630 でライブプレビューします——エディタで見たままが、ピクセル単位でカードの見た目になります——そして本記事のすべてのチェックをパスする最適化済み PNG を書き出せます。登録不要、ウォーターマークなし。
FAQ
投稿せずに OG image をプレビューするには?
公式のレンダリング結果を見るなら Facebook Sharing Debugger か LinkedIn Post Inspector を。あるいは Slack、Discord、WhatsApp で自分宛てにリンクを送りましょう——自分宛てメッセージは、公開シェアとまったく同じように展開されます。
OG image のキャッシュはどれくらい残る?
まちまちです。Facebook は再取得を強制するまでキャッシュし続け、LinkedIn は Post Inspector で更新され、X は1週間ほどで自然に切れます。画像 URL の変更(?v=2 や新しいファイル名)なら、すべてのキャッシュを一度に回避できます。
Facebook では表示されるのに WhatsApp では表示されないのはなぜ?
ほぼ確実にファイルサイズが原因です。WhatsApp は重い画像を諦めてしまいます——PNG を圧縮するか、より小さいバリアントを配信し、300 KB を大きく下回るようにしましょう。
JavaScript でレンダリングするページでも OG タグは機能する?
タグがサーバーの初期レスポンスに含まれている場合のみ機能します。ソーシャルクローラーは基本的に JavaScript を実行しないため、クライアントサイドで注入された meta タグは彼らには見えません。

