サイトを共有してもリンクプレビューに画像が出ないのはなぜ？

クローラーが実際に読んでいるもの

リンクを貼り付けたとき、プラットフォームは訪問者と同じようにページを見ているわけではありません。クローラーが URL をリクエストし、サーバーが返した HTML を読み、head にあるいくつかの meta タグからカードを組み立てます。ほとんどのプラットフォームが読む形式は Open Graph プロトコルで、og:image は og:title、og:type、og:url と並ぶ 4 つの必須プロパティのひとつです。スクリプトが実行されて初めて存在するもの — クライアントサイドのフレームワークが差し込むタグや、ブラウザ上でプラグインが設定する画像 — は、こうしたクローラーの大半からは見えません。コードを実行しないからです。

画像そのものも各プラットフォーム独自の基準をクリアする必要があり、その基準はそれぞれ異なります。Facebook のドキュメントは、最適な表示には 1200 × 630 ピクセル以上、大きな画像の投稿には最低 600 × 315、どんな場合でも 200 × 200 を下回らないこと、比率はできるだけ 1.91:1 に近づけ、ファイルは 8 MB 未満にすることを求めています。LinkedIn のヘルプセンターは最小を 1200 × 627、比率は同じ 1.91:1、上限を 5 MB としており、必要なタグとして og:title、og:image、og:description、og:url を挙げています。5 MB 未満の 1200 × 630 の画像を 1 枚用意すれば、両方の条件を満たせます。

よくある原因 — おおよそ確認すべき順に

• 共有したページに og:image がない。 最も多いのは、トップページにはあるのに下層ページにはないケースです — そして実際に共有されるのは下層ページです。
• 画像の URL が相対パスになっている。 /images/card.png のようなパスは、HTML を文脈抜きで読むクローラーにとって意味をなしません。Open Graph の仕様にある例はすべて https:// から始まる完全なアドレスです。それに倣ってください。
• 画像が小さすぎる、大きすぎる、または形が合っていない。 プラットフォームの最小サイズを下回るとサムネイル表示になるか、何も出ません。ファイルサイズの上限を超えると画像は捨てられ、正方形や縦長の画像は 1.91:1 の枠に合わせて切り取られます。
• クローラーが画像に到達できない。 robots.txt のルール、ログインの壁、ステージング環境のパスワード、見慣れないユーザーエージェントを遮断するファイアウォールがあると、クローラーはタグをひとつも見ないうちに止められます。
• プラットフォームが古いコピーを表示している。 今はタグが正しくても、リンクが最初に共有されたときに欠けていたなら、目にしているのはキャッシュされたカードです — 詳しくは後述します。

私たち自身のサイトで起きていたこと

2026年7月14日まで、agentceres.com — AI Growth Officer である AgentCeres のサイト — には og:image を持つページがひとつもなく、Slack、X、LinkedIn に共有したリンクはすべて素のテキストカードとして展開されていました。直すには独立した 2 つの修正が必要で、どちらか一方だけを直しても、サイトは半分壊れたままになっていたはずです。

ひとつ目は配置でした。カード画像を生成するファイルが、実際にはどのページも継承していないアプリの階層に置かれていたため、何にも適用されていなかったのです。ふたつ目は、Next.js で開発しているなら知っておく価値のある落とし穴です。Next.js のドキュメントによれば、異なる階層のメタデータは浅くマージされ、上位で定義された openGraph のようなネストされたフィールドは、最後にそれを定義した階層によって上書きされます。ページのタイトルと説明文を設定する共通ヘルパーが画像なしで openGraph を設定していたため、それを使うすべてのページ — ロールページ、ブログ記事、比較ページなど、最もよく共有されるページ — で、ページ自身の openGraph がカードを持つ openGraph を画像ごと置き換えていました。配置だけを直していたら、まさに人が共有するページが画像のないまま残っていたことになります。私たちが得た教訓はこうです。トップページだけでなく、これから共有するそのページの HTML を確認すること — こうしたタグが抜け落ちるのは下層ページです。

タグを直すのは半分にすぎない

プラットフォームはリンクが最初に共有されたときに作ったプレビューをキャッシュするため、ページを修正しても古いカードが表示され続けます。Facebook は、画像は URL 単位でキャッシュされ、URL が変わらない限り更新されないと明記しています。Facebook の Sharing Debugger はページを取得し直し、クローラーに今何が見えているかを表示してくれます。LinkedIn の Post Inspector は LinkedIn で同じことを行うツールで、プレビューに古い画像が出る場合の対処法として LinkedIn のヘルプセンターが案内しているものです。タグや画像を変更したら必ず両方にページを通し、それでも古い画像が消えないプラットフォームがあれば、画像のファイル名を変えて URL を変えてください。

プレビューは見た目以上に重要です。共有の多くはチャットアプリや DM の中で起きており、そこではカードが第一印象のすべてで、訪問がどこから来たかをアナリティクスに伝えるリファラーも残りません — こうしたトラフィックはダークソーシャルと呼ばれます。グループチャットで灰色のテキストとして展開されたリンクは読み飛ばされやすく、獲得できなかったクリックをどのレポートも見せてはくれません。ページを変更したばかりなのに公開中のサイト自体がまだ古く見えるなら、それは別のキャッシュです。サイトを更新したのに古いままの理由を参照してください。