OGP プレビュー — SNS でリンクがどう表示されるかを確認
URL を入力すると、Facebook、LinkedIn、X、Slack が表示するカードそのもの、見つかったすべてのタグ、不足しているものがわかります。
リクエストに応じて当サイトのサーバーがページのタグだけを取得します。あなたに関する情報は何も保存されません。 すべての無料ツールを見る.
不具合や改善できそうな点を見つけましたか？いただいたメッセージはすべて読み、すぐに対応します。
この無料の OGP プレビューツールは、公開されている任意のページを取得し、Facebook、LinkedIn、X、Slack がそのタグから作るリンクカードを、各プラットフォームと同じ方法で表示します。タイトル、説明、画像、サイト名を、各プラットフォームと同じように切り抜き・省略します。見つかったすべての og: と twitter: のタグを一覧表示し、シェア画像を測定し、失敗した項目ごとに具体的な修正方法を添えてページをスコア化します。
リンクのプレビューは一握りのメタタグだけで決まり、しかも失敗しても何も知らせてくれません。og:image がなければシェアした記事はただのグレーのリンクになり、幅 600 px 未満の画像はサムネイルになり、70 文字を超えるタイトルは単語の途中で切れます。シェアする前やデプロイ後にここで確認すれば 10 秒で済み、こうした問題をすべて見つけられます。取得はリクエストに応じて当サイトのサーバーが行うので、ログイン中のブラウザで見えるものではなく、クローラーから見えるものがわかります。
使い方
- ページの URL を貼り付けて「プレビュー」を押します。ページは公開されていてアクセスできる必要があり、localhost やパスワードで保護されたステージング環境は取得できません。
- 3 つのカードを確認します。タイトルだけだったり画像がなかったりする場合は、タグがないか、画像が読み込めていません。
- チェック結果を読みます。失敗した各行に、何を追加・変更すべきかが書かれています。不足しているタグはメタタグ生成ツールで作れます。
- 修正してデプロイしたら、「再チェック」を押します。Facebook や LinkedIn にまだ古いカードが表示される場合はキャッシュされているので、Facebook のシェアデバッガーや LinkedIn の Post Inspector で再取得してください。
よくある質問
プレビューが LinkedIn や Facebook の表示と違うのはなぜですか？
キャッシュのためです。どちらのプラットフォームも、最初に見たリンクのカードを、ときには数週間保存します。このツールは常に最新のタグを取得します。プラットフォームのキャッシュを更新するには、Facebook のシェアデバッガー（Instagram と WhatsApp も更新されます）か LinkedIn の Post Inspector を使ってください。X は 1 日ほどで自動的に更新されます。
og:image はどのサイズにすべきですか？
1200 × 630 ピクセル、比率 1.91:1、約 5 MB 未満で、HTTPS の絶対 URL で配信します。これでどこでも大きなカードになります。幅が 600 px 未満の画像は、Facebook と LinkedIn では小さなサムネイルになります。正方形の画像は切り抜かれるので、被写体は中央に置いてください。
最低限必要なタグは何ですか？
og:title、og:description、og:image、og:url です。og:site_name と og:type を加え、X が大きな画像を使うよう twitter:card を summary_large_image に設定してください。X は、twitter: で指定されていない項目には og: タグを代わりに読み込みます。
ページがリダイレクトされたと表示されました。問題ですか？
通常は問題ありません。http から https、www なしから www ありへのリダイレクトは普通のことで、ツールはそれをたどります。問題になるのは、シェア用のリンクがタグを返さないトラッキング用ドメインを経由してリダイレクトする場合や、リダイレクトの連鎖が遅くてプラットフォームのクローラーが諦めてしまう場合です。できれば最終的な URL を直接シェアしてください。
ログインが必要なページや localhost のページもプレビューできますか？
いいえ。取得は当サイトのサーバーから行うので、匿名の訪問者が見られるものしか見えません。それは SNS のクローラーが見るものと同じです。ローカルのページは、まずプレビュー用の URL にデプロイしてください。プライベートネットワークのアドレスへのリクエストは、設計上拒否されます。
何か保存されますか？
URL はリクエストに応じて取得され、タグはブラウザに返されて、何も保存されません。読み込むのはページの head 内のタグだけで、上限は 1 MB です。
各プラットフォームのカードの作り方
Facebook と LinkedIn は og:* を読み、画像、タイトル、ドメインを表示します（LinkedIn はフィードでは説明を省略します）。X はまず twitter:* を読み、なければ og:* を使い、twitter:card で大きいレイアウトか小さいレイアウトかを決めます。Slack、Discord、iMessage は og:* を読み、サイト名、タイトル、説明、画像をこの順に表示します。WhatsApp は og:image のサムネイルとタイトルを表示します。どれも JavaScript を実行しないので、クライアント側で挿入したタグは見えません。タグはサーバー側で出力してください。
プレビューが崩れるよくある原因
• og:image が相対パスか、https のサイトで http の URL になっている。
• 画像が robots.txt でブロックされているか、ログインが必要になっている。
• CDN やボット対策のレイヤーが、クローラーにチャレンジページを返している。
• ページが読み込み後に JavaScript でタグを設定している。
• og:url が別のページを指しているため、プラットフォームがそちらをプレビューしている。
関連する無料ツール
- メタタグ生成 — ページのタイトル、ディスクリプション、SNS カードの情報を入力すると、文字数カウンター付きで、正しくエスケープされた完全な <head> ブロックを生成します。
- SERP スニペットプレビュー — ページのタイトルとメタディスクリプションが Google でどう表示されるかを、文字数のリアルタイムチェック付きでプレビューできます。
- UTM リンク作成 — きれいで一貫した UTM トラッキングリンクを作成し、どのキャンペーンが顧客を連れてきたのかを正確に把握できます。