OGP（Open Graph Protocol）は、Webページの内容をSNSが正しく解釈・表示するためのメタデータ規格です。適切に設定することで、SNSシェア時のクリック率が大幅に向上し、AI検索エンジンへの情報伝達も最適化できます。

本記事では、OGP設定の基本から、AI検索時代に対応する最新の最適化ポイントまでを解説します。
10年以上の国際SEOコンサルティング経験と、SEGO診断ツールで蓄積した340件以上の実データをもとに、中小企業のサイト運営者が今日から実践できる内容にまとめました。

SEOの全体像を体系的に学びたい方は、まずLLMOとは？ChatGPTに引用されるサイトをつくる5つの対策もあわせてご覧ください。

OGP設定とは何か

OGPとは、SNSでWebページが共有された際に、タイトル・説明文・画像・URLなどの情報を意図通りに表示させるためのHTMLメタデータ規格です。

2010年にFacebook（現Meta）が策定し、現在ではX（旧Twitter）、LINE、LinkedIn、Slack、Discordなど、主要なSNSやメッセージングアプリの大半が対応しています。HTMLの<head>タグ内に<meta property="og:...">形式で記述することで、SNSのクローラーがその情報を読み取り、リッチなプレビューカードを生成します。

OGP設定がない場合、SNSは自動的にページ内のテキストや画像を抽出して表示しますが、意図しない画像が選ばれたり、説明文が途中で切れたりすることがあります。OGP設定の有無は、SNS流入のクリック率を2〜3倍変えることもある重要な施策です。

SEGOがX上で表示されるOGPカードの実例。診断結果のスコア・ランク・カテゴリスコアが視覚的に表示される — 実例：SEGOの診断結果ページがX上で表示された際のOGPカード

なぜ今OGP設定が重要なのか

AI検索時代において、OGP設定はこれまで以上に重要な施策となっています。理由は3つあります。

第一に、ゼロクリック検索の増加で、検索結果からの流入が減少傾向にあるためです。
代わりにSNSやメッセージングアプリ経由の流入が相対的に重要性を増しており、SNSでの「第一印象」を決めるOGP設定の価値が高まっています。

第二に、ChatGPT、Claude、Perplexity、GeminiなどのAI検索エンジンのクローラーも、OGP情報を補助的に参照することが確認されています。AI検索エンジンが回答を生成する際、ページの内容を要約するためにog:descriptionやog:titleを参考にする場合があるのです。

第三に、OGP設定の不備はブランド毀損につながります。意図しない画像や説明文が表示されると、サイトの信頼性が損なわれ、シェアされる確率も下がります。

当社が運営するSEGO診断ツールで340件以上のサイトを診断した結果、OGP設定が不完全なサイトは全体の約62%にのぼりました。
中小企業サイトに限定すると、その比率はさらに高まる傾向にあります。

過去のコンサルティング経験では、OGP設定を最適化しただけで、SNS経由の流入が3ヶ月で2.8倍になった事例もあります。
広告費をかけずにできる施策としては、極めて投資対効果の高い領域です。

必須OGPタグ4つと推奨タグ3つ

OGP設定で最低限必要なタグは4つ、推奨タグは3つあります。まずはこの7つを確実に設定することから始めましょう。

必須の4タグ

以下の4つは、OGPの基本構成要素です。いずれか1つでも欠けると、SNS側で正しく表示されない可能性があります。

og:title：ページのタイトル（30〜35文字推奨）
og:description：ページの説明文（80〜100文字推奨）
og:url：ページの正規URL（絶対パス）
og:image：シェア時に表示される画像のURL（絶対パス）

推奨の3タグ

以下の3つは必須ではありませんが、設定することでより精度の高い表示制御が可能になります。

og:type：ページの種別（トップページはwebsite、記事はarticle）
og:locale：言語と地域（日本語サイトはja_JP）
og:site_name：サイト名

HTMLでの実装例

静的HTMLサイトの場合、<head>タグ内に以下のように記述します。

<head>
  <meta property="og:title" content="記事のタイトル" />
  <meta property="og:description" content="記事の説明文" />
  <meta property="og:url" content="https://example.com/article" />
  <meta property="og:image" content="https://example.com/ogp.png" />
  <meta property="og:type" content="article" />
  <meta property="og:locale" content="ja_JP" />
  <meta property="og:site_name" content="サイト名" />
</head>

Next.jsでの実装例

Next.js（App Router）を使用している場合、Metadata APIを利用すると簡潔に記述できます。当社のSEGOも、この方式で全ページにOGPを動的生成しています。

// app/article/[slug]/page.tsx
export async function generateMetadata({ params }) {
  return {
    title: "記事のタイトル",
    description: "記事の説明文",
    openGraph: {
      title: "記事のタイトル",
      description: "記事の説明文",
      url: `https://example.com/article/${params.slug}`,
      images: [{ url: "https://example.com/ogp.png" }],
      type: "article",
      locale: "ja_JP",
      siteName: "サイト名",
    },
  };
}

WordPressの場合は、All in One SEOやYoast SEO、SEO SIMPLE PACKなどのプラグインで簡単に設定できます。なお、テーマ機能とプラグインを併用するとmetaタグが二重出力される場合があるため、どちらか一方に統一してください。

主要SNSによってOGPの解釈と表示には違いがあります。基本のog:タグに加え、各プラットフォーム固有のタグを設定することで、より最適な表示が実現します。

X（旧Twitter）

Xでは、og:タグに加えてtwitter:cardの設定が必要です。これがないと、画像がカード形式で大きく表示されません。

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@your_account" />

twitter:cardには2種類あります。summaryは小さい正方形のサムネイル、summary_large_imageは大きい横長画像です。視認性とクリック率の観点から、後者のsummary_large_imageが推奨されます。

X公式ドキュメントによれば、twitter:titleやtwitter:descriptionは省略可能で、og:タグの値が自動的に使用されます。重複設定は不要です。

Facebook

Facebookでは、より詳細な分析を行いたい場合にfb:app_idを設定することが推奨されています。これにより、ページインサイト機能で詳細なシェア分析が可能になります。

<meta property="fb:app_id" content="your_app_id" />

FacebookはOGP情報を強くキャッシュします。設定変更後すぐに反映されない場合は、FacebookシェアデバッガーでURLを入力し「もう一度スクレイピング」を実行してください。

LINE

LINEはog:imageを最重要視する傾向があります。og:imageが設定されていないと、テキストリンクのみのシンプルな表示になります。

LINEのキャッシュは24時間程度持続することが多く、デバッグツールも公式には提供されていません。実機での確認を推奨します。シェア時に意図しない表示になる場合は、URLにクエリパラメータを追加する（例：?v=2）ことで強制的に再取得させる手法もあります。

LinkedInもOGP情報を読み取りますが、画像比率は1.91:1が推奨されます。LinkedIn Post Inspectorで確認できます。

OGP画像の作り方と推奨サイズ

OGP画像はSNSシェア時のクリック率を最も大きく左右する要素です。技術的な設定よりも、画像の質と内容が結果を決めます。

推奨サイズと仕様

2026年現在、主要SNSで共通して綺麗に表示される推奨仕様は以下の通りです。

サイズ：1200×630px（1.91:1）
最小サイズ：600×315px
ファイル形式：PNG または JPG（WebPは一部SNSで未対応）
ファイルサイズ：8MB以下、推奨1MB以下
テキスト占有率：画像面積の20%以下推奨

画像の中央付近に重要な情報を配置することも重要です。SNSによっては画像の両端が切り取られて表示される場合があるため、端に重要なテキストやロゴを置くと欠ける可能性があります。

作成方法の3つの選択肢

OGP画像の作成方法には、用途に応じて3つの選択肢があります。

1. デザインツールで手動作成

FigmaやCanvaを使ってテンプレートから作成する方法です。デザインの自由度は高いですが、記事数が多いと運用コストが嵩みます。月10記事以下の小規模サイトに向いています。

2. AI画像生成ツールを活用

DALL-EやMidjourney、Stable Diffusionなどで生成する方法です。記事のテーマに合った独自性のある画像を素早く作れますが、ブランドの一貫性を保つにはプロンプト設計の工夫が必要です。

3. 動的に自動生成

Next.jsの@vercel/ogやSatoriなどを使って、記事タイトルや日付を埋め込んだOGP画像を動的に生成する方法です。数百記事規模のサイトでも、追加の運用コストなく一貫したデザインのOGP画像を量産できます。

当社のSEGO診断ツールでは、@vercel/ogを採用し、診断結果ページごとにスコアやランクを反映したOGP画像を自動生成しています。
これにより、ユーザーがX等で診断結果をシェアした際、各自の結果が反映された個別のカード画像が表示される仕組みになっています。

SEGOの動的OGP画像生成例。診断結果のスコア68点、Bランク、5カテゴリの個別スコアバーが表示されている — 実例：@vercel/og で動的生成されたOGP画像（診断結果がリアルタイムで反映される）

AI検索エンジンとOGP - クローラーは何を読むのか

AI検索エンジンの台頭により、OGP情報の役割は「SNSシェア時の表示制御」から「AI検索エンジンへの情報提供」へと拡張されつつあります。

AI検索クローラーのOGP対応状況

2026年4月時点で、主要AI検索エンジンのクローラーがOGP情報をどう扱っているかを整理します。これは公式ドキュメント、技術ブログ、当社の検証結果を組み合わせた情報です。

GPTBot（OpenAI）：HTML全体をクロール対象とし、OGPタグも認識します。ChatGPTでの引用時、og:descriptionが要約のヒントとして使われる場合があります。
ClaudeBot（Anthropic）：HTML全体を解析対象とし、OGPは補助情報として扱われます。本文の質を最優先する傾向があります。
PerplexityBot：og:imageを引用カードのサムネイル候補として参照することが確認されています。
Google-Extended：従来のGooglebotと同様の挙動で、OGPは構造化データの補助として機能します。

AI検索時代の実装ポイント

AI検索エンジンを意識したOGP設定では、以下のポイントが重要になります。

og:descriptionは自然な文章で書く。AI検索エンジンは要約を生成する際、og:descriptionをページ内容のサマリーとして参照することがあります。キーワードの羅列ではなく、ページの結論を端的にまとめた自然な日本語で書くことが推奨されます。

og:imageは情報を補助する画像にする。装飾的な画像よりも、図解や数値を含む情報量のある画像の方が、AI検索エンジンが文脈を理解しやすくなります。テキストばかりの装飾画像は避けてください。

AI検索での引用獲得についてはサイテーションとは？AI検索時代に重要性が増す理由と中小企業でもできる獲得方法で詳しく解説しています。AI検索での自社可視性を確認したい方は、AI検索で自社は表示されている？ChatGPT・Gemini・Perplexityでの確認方法と改善策を参考にしてください。

OGP設定の確認方法とよくあるミス

設定したOGPは、必ず公式の確認ツールで検証してから本番反映してください。
JSON-LDの書き方！コピペで使える実装コード5種類と同様、確認作業を省くと予期しない表示エラーが発生します。

主要な確認ツール

各SNSが提供する公式ツールを使えば、実際にシェアする前に表示を検証できます。

Facebook：FacebookシェアデバッガーでURL入力後「もう一度スクレイピング」を実行
X（旧Twitter）：Card Validatorは廃止済み、現在は公式デバッグページまたは実機確認
LINE：公式ツールなし、実機での確認推奨
LinkedIn：LinkedIn Post Inspectorで確認

よくあるミスTOP3

SEGO診断ツールで検出された不備のうち、頻度の高いミスを3つ紹介します。これらは過去のコンサルティング案件でも頻繁に遭遇するパターンです。

第1位：og:imageを相対パスで記述している

SEGO診断データの約34%で確認されたミスです。og:imageは必ずhttps://example.com/ogp.pngのような絶対パスで記述してください。相対パスではSNSのクローラーが画像を取得できません。

第2位：og:imageの画像サイズが不適切

約27%のサイトで、推奨サイズ1200×630pxから大きく外れた画像が設定されていました。極端に小さい画像（例：200×200px）や、縦長の画像はSNS上で意図しないトリミングが発生します。

第3位：og:typeの設定漏れ

約19%のサイトでog:typeが未設定でした。デフォルト値が使われるため大きな問題にはなりませんが、トップページはwebsite、記事ページはarticleを明示的に設定することで、各SNSが意図に沿った表示を行いやすくなります。

これらのミスは、自社サイトのOGP実装状況を診断することで発見できます。当社のSEGOでは、無料でOGP設定を含む50項目以上のSEO・AI検索対応状況を診断できますので、現状確認の起点としてご活用ください。

OGP設定の重要ポイントまとめ

OGP設定は、SNS時代もAI検索時代も継続して重要な施策です。本記事のポイントを整理します。

OGPはSNSシェア時の表示を制御するメタデータ規格
必須4タグ（title、description、url、image）と推奨3タグ（type、locale、site_name）を設定
SNS別の最適化（X：twitter:card、Facebook：fb:app_id、LINE：og:image最重要）
OGP画像は1200×630px、テキスト占有率20%以下が推奨
AI検索クローラーもOGPを参照するため、自然な文章と情報量のある画像を心がける
設定後は公式デバッグツールで必ず検証

OGP設定の有無や品質は、SNS流入とAI検索可視性の双方に影響する重要な要素です。
まずは自社サイトの現状を確認し、不備があれば優先的に対応しましょう。

SEGOでは、URLを入力するだけで、OGP設定を含む50項目以上のSEO・AI検索対応状況を無料で診断できます。診断結果には、優先度の高い改善項目と具体的なアクションプランも提示されます。

SEGOで無料診断を試す

OGP設定に関するよくある質問

OGP設定をしないとSEOに影響しますか？

OGP設定の有無自体は、Googleの検索順位に直接影響しません。ただし、SNSでのシェア数や引用数が間接的に検索評価に影響する可能性があります。AI検索エンジンの引用獲得にも影響するため、設定することを推奨します。

OGP画像はどのツールで作成すればよいですか？

用途と規模によって選択が異なります。月10記事以下ならFigmaやCanvaでの手動作成、数十記事以上の中規模サイトはAI画像生成ツール、数百記事規模のサイトはNext.jsの@vercel/ogなどによる動的生成が効率的です。

WordPressでOGPを設定する最も簡単な方法は？

SEO SIMPLE PACKやAll in One SEOなどのプラグインを利用するのが最も簡単です。テーマにOGP機能が組み込まれている場合は、テーマ機能のみを使い、プラグインとの併用は避けてください。metaタグの二重出力が発生します。

OGP設定を変更したのにSNSで反映されません

SNS側がOGP情報をキャッシュしているためです。Facebookは公式のシェアデバッガーで「もう一度スクレイピング」を実行してください。LINEのキャッシュは24時間程度で自然に更新されます。緊急で更新したい場合は、URLにクエリパラメータ（例：?v=2）を追加して別URLとして認識させる方法があります。

X（旧Twitter）でカード画像が大きく表示されません

twitter:cardがsummaryに設定されているか、未設定の可能性があります。summary_large_imageを明示的に設定してください。また、画像サイズが推奨値（1200×630px）から大きく外れている場合も、表示が崩れる場合があります。

OGP設定とは？AI検索時代に効くSNS最適化7つのポイント