Official Sponsor

社内IT・情シス業務でお困りですか? 月額1,650円〜の情シス代行「Lapis Tech」

無料相談・IT診断はこちら
Webマーケティング 2026-04-08

OGP(Open Graph Protocol)

FacebookやXなどのSNSでWebページをシェアした際に、タイトル・説明文・画像を適切に表示させるためのメタタグ仕様。og:title・og:description・og:imageの設定が基本。

OGP(Open Graph Protocol)とは?

OGP(Open Graph Protocol)は、Facebookが2010年に策定したWebページのメタデータ仕様です。XやLINE・Slackなどのプラットフォームでも広く採用されており、URLをシェアした際に表示されるタイトル・説明文・サムネイル画像を制御できます。

基本的な実装

<head>
  <!-- OGP基本設定 -->
  <meta property="og:title" content="ページタイトル" />
  <meta property="og:description" content="120〜160文字の説明文" />
  <meta property="og:image" content="https://example.com/ogp.png" />
  <meta property="og:url" content="https://example.com/page/" />
  <meta property="og:type" content="website" />

  <!-- X(Twitter)Card -->
  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:site" content="@username" />
</head>

OGP画像のサイズ

用途推奨サイズ
基本OGP画像1200×630px
X Summary Large Image1200×628px
最小サイズ600×315px

og:typeの主な種類

  • website: 一般的なページ(デフォルト)
  • article: ブログ記事(og:article:published_timeも追加)
  • product: 商品ページ

確認ツール

  • Facebook Sharing Debugger: OGP情報のキャッシュクリアと確認
  • X Card Validator: Twitter Cardの確認
  • OGP確認ツール(無料): opengraph.xyなど

まとめ

OGPはSNSでのCTR(クリック率)に直結します。特にog:imageは視覚的なインパクトが大きいため、ページタイプに合わせた専用OGP画像を用意することを推奨します。

おすすめの高速レンタルサーバー PR

関連する用語 (Webマーケティング)

全45件を見る
🎓

ITスキルを動画でマスター

\ 新規受講生 割引実施中 /

React、AWS、Pythonなど、現役エンジニアから直接学べる世界最大級の動画講座。

人気のコースを見る

PR: スポンサーリンク

法人・個人向けサポート 受付中

インフラ構築やトラブル対応で お困りではありませんか?

AWSの構築、社内ネットワーク(VPN/NW)の改善、その他原因不明のITトラブルまで、現役インフラエンジニアが直接サポートします。単発でのご相談や、毎月のスポット顧問契約も可能です。

Sponsored Link

バグ・要望を報告する