OGP (Open Graph Protocol) とは

概要

OGP (Open Graph Protocol) は、Facebook が策定したメタデータ規格である。Web ページの HTML に og:title、og:description、og:image などのメタタグを埋め込むことで、そのページが SNS でシェアされた際の表示内容を制御できる。X (旧 Twitter)、LINE、Discord など、多くのプラットフォームが OGP に対応している。

主要なプロパティ

OGP でよく用いられるプロパティは次のものである。og:title はページのタイトル、og:description は説明文、og:image はサムネイル画像の URL、og:url はページの正規 URL である。これらを HTML の <head> 内に「<meta property="og:title" content="..." />」の形式で記述する。

加えて、og:type でページの種類 (website、article など) を指定し、og:site_name でサイト名を設定する。X 向けには twitter:card メタタグで表示形式 (summary、summary_large_image) を指定する。

質問箱のようなサービスでの利用

質問箱のようなサービスでは、たとえば次の 2 つの場面で OGP が用いられる。第一に、質問箱の公開ページが SNS でシェアされた際に、質問箱のオーナー名と説明が適切に表示されるよう OGP タグを動的に生成する場面である。

第二に、回答済みの Q&A をシェアする際に、質問と回答をカード形式にまとめた OGP 画像を生成する場面である。この画像はサーバーサイドで描画され、テキストのみの投稿に比べて視覚的な情報量が多い形になる。