SNSシェアで差がつく!OGP(Open Graph)設定
最終更新日: 2025年10月24日
あなたのサイトのURLが、LINE、X(旧Twitter)、Facebookなどでシェア(共有)された時、どのように表示されるか確認したことはありますか?
この時に表示される「大きな画像」や「タイトル」「説明文」を正しく設定する仕組みが「OGP」です。
OGPとは? なぜ設定するの?
OGP(Open Graph Protocol)とは、SNSなどでURLがシェアされた際に、そのページの内容を「リッチなプレビュー(=魅力的なカード形式)」で伝えるためのルールです。
もしOGPが設定されていないと、SNS側がそのページから勝手に画像や文章を引っ張ってこようとします。その結果、
- 意図しない小さなロゴ画像が表示される
- 無関係な文章が説明文として表示される
- 最悪の場合、何も表示されずURLの文字列だけになる
といった事態が起こります。これでは、せっかく誰かが善意でシェアしてくれても、他の人の興味を引くことができず、クリックしてもらえません。OGPを正しく設定することは、SNS経由のアクセス(集客)を増やすために非常に重要です。
どうやって設定する?
OGPは、Titleタグなどと同じく、HTMLファイルの<head>内に専用の<meta>タグを記述して設定します。
これをページごとに、そのページの内容に合ったタイトルや画像を指定して記述する必要があります。
解決策:「My OGPクリエイター」の活用
この面倒なタグ作成を、プレビューを見ながら簡単に行えるのが、姉妹サイトの「My OGPクリエイター」です。
- ライブプレビューで確認
必要な情報を入力するだけで、実際にSNSでシェアされた時の見た目をリアルタイムで確認しながら作成できます。 - コピペするだけ
入力した内容に基づいて、必要なOGPタグ一式を自動で生成します。あとは<head>内にコピペするだけです。 - X(Twitter)カードにも対応
X(旧Twitter)で表示される専用のカード形式(twitter:card)にも対応しています。
このページのまとめ
- OGPは、SNSでシェアされた時の「見た目」を設定する仕組みで、集客に直結する。
- 設定しないと、意図しない表示になり、クリックされるチャンスを逃してしまう。
- 「My OGPクリエイター」を使えば、プレビューを見ながらOGPタグを簡単に作成できる。
Web制作者向け便利ツール
Myフォームクリエイター
PHPの知識がなくても、誰でも簡単に高機能なメールフォームが作れる無料ツール。カスタマイズも自由自在です。
My Logo Creator
登録不要で本格的なロゴを無料作成。Webサイトや名刺に使えるプロ品質のSVG形式にも対応しています。
My Canvas Creator
ブラウザ上で手軽に画像を編集・加工できるツール。SNS投稿やブログのアイキャッチ作成に役立ちます。
Myカラークリエイター
Webデザインに最適な配色が見つかるツール。アクセシビリティ対応のコントラスト比チェック機能も搭載。
My OGPクリエイター
SNSシェア時の美しいプレビューカード(OGPタグ)を、ライブプレビューを見ながら簡単に作成できます。
My Faviconクリエイター
1枚の画像やイニシャルから、あらゆるデバイスに対応したファビコン一式を瞬時に自動生成します。
