MUTools

OGPチェッカー

OGPチェッカーツールは、指定した URL のページから OGP(Open Graph Protocol)と Twitter Card のメタデータを抽出し、 X や Facebook などの SNS でシェアされたときにどのようなカードとして表示されるかを近似プレビューするツールです。

URL を入力し「OGP をチェック」を押すと、ここに診断・メタデータ一覧・シェアカードプレビューが表示されます。

入力 URL はサーバーから取得して HTML を解析します。プライベート IP・localhost への接続は拒否されます。各 URL の取得は 8 秒でタイムアウトし、HTML 本文の先頭 2MB のみ読み込みます。

OGPチェッカーツールとは?

OGPチェッカーツールは、指定した URL のページから OGP(Open Graph Protocol)と Twitter Card のメタデータを抽出し、 X や Facebook などの SNS でシェアされたときにどのようなカードとして表示されるかを近似プレビューするツールです。

ページの og:titleog:descriptionog:image などの主要メタタグを一覧で表示するだけでなく、必須項目の欠落・推奨文字数の超過・ og:image:alt 未設定などを「要対応」「推奨」レベルで指摘する診断機能も備えています。

記事や LP を公開する前のレビュー、SNS からの流入を増やすための見直しなど、シェアカードの仕上がりを実際の SNS に投稿せずに確認したいときに役立ちます。

使い方

  1. チェックしたいページの URL(https:// から始まる形式)を入力欄に貼り付けます。
  2. 「OGP をチェック」ボタンを押すと、対象 URL のページが解析され、結果が表示されます。
  3. 「OGP 診断」セクションで必須項目の不足や推奨設定との乖離を確認します。
  4. 「メタデータ一覧」で抽出された title / og:* / twitter:* の各タグの値を確認します。
  5. 「シェアカードプレビュー」で X(Twitter)と Facebook のカード表示を切り替え、ライト / ダークの見え方を確認します。

利用シーン

  • 新しい記事や LP を公開する前に、SNS シェア時のカード表示が崩れていないかを確認したい編集者・マーケター。
  • SNS 経由のクリック率(CTR)を改善するため、タイトルや説明文・OG 画像を調整したい運用担当者。
  • コーポレートサイトの全ページに OGP が正しく設定されているかを 1 件ずつ確認したい Web 制作会社。
  • 競合サイトや参考サイトがどのようなシェアカードを出しているかを確認したい企画担当者。
  • OG 画像の差し替え後に、CDN キャッシュの影響を確認したいエンジニア(カードの内容が即座に反映されるか)。

注意点

  • プライベート IP アドレスや localhost への接続は安全のため拒否されます。社内ネットワーク内のサイトはチェックできません。
  • 1 件あたりの取得タイムアウトは 8 秒です。応答が遅いサイトはエラーになる場合があります。
  • HTML の先頭 2 MB のみ読み込みます。極端に大きなページではメタタグが取得できない場合があります。
  • JavaScript で動的にメタタグを書き換えるサイト(SPA など)の場合、初期 HTML の値が抽出されます。実際の SNS クローラの挙動と異なる可能性があります。
  • プレビューは X / Facebook の仕様に基づいた近似表示です。実際のカード表示は各 SNS の仕様変更により異なる場合があります。
  • SNS 側でカード画像をキャッシュしている場合、変更が反映されるまで時間がかかることがあります(X / Facebook いずれもデバッガで再取得を促すことができます)。

よくある質問

OGP とは何ですか?
OGP(Open Graph Protocol)は、Web ページの情報を他のサービスに伝えるためのメタデータ規格です。og:title、og:description、og:image などをページの <head> に記述することで、SNS でシェアされた際に画像付きのリッチなカードとして表示されます。Facebook が策定し、X(Twitter)・LinkedIn・Slack など多くのサービスが対応しています。
OGP と Twitter Card の関係は?
Twitter Card は X(旧 Twitter)独自のメタデータ規格で、twitter:card、twitter:title、twitter:image などのタグで指定します。多くは OGP の値にフォールバックされるため、X 独自の値を上書きしたい場合のみ twitter:* を指定するのが一般的です。本ツールでは両方を抽出し、それぞれの一覧と診断結果を表示します。
プレビューと実際の SNS でのカード表示が違うのはなぜ?
本ツールのプレビューは X / Facebook のレイアウトを参考にした近似表示です。各 SNS はカードの仕様を継続的に変更しており、画像の縦横比のトリミング・タイトル長の上限・ダーク/ライトテーマの扱いなどが異なる場合があります。最終確認は X カードバリデーター、Facebook シェアデバッガなど各 SNS 公式のデバッガもあわせて使うのがおすすめです。
og:title の文字数はどのくらいが適切ですか?
X では 70 文字程度で末尾が切り詰められることが多く、本ツールでは 70 文字を超えると警告を表示します。og:description は 200 文字以内が推奨です。実際にプレビューで切れ方を確認しながら、タイトル・説明文を調整してください。
チェックできないサイトがあります。
8 秒のタイムアウトを超えた場合、HTML 先頭 2 MB に <head> 内のメタタグが含まれていなかった場合、ベーシック認証や Bot ブロックでアクセスが拒否された場合などはエラーになります。プライベート IP / localhost への接続も安全のため拒否されます。これらに該当する場合は対象サイト側の設定確認が必要です。