シルギア

OGP・メタタグ確認ツールの使い方|URLでSNSシェアの見え方をチェック

公開日:2026年7月24日 対象ツール:OGP・メタタグ確認

記事やページのURLをXやフェイスブック、LINE、スラックなどに貼ると、多くの場合タイトル・説明文・サムネイル画像をまとめた「カード」が自動で展開されます。この見た目を決めているのが、ページのヘッダに書かれたOGP(Open Graph Protocol)と呼ばれるメタタグ群です。カードが整っていればタイムライン上で目に留まりクリックされやすく、逆に設定が抜けているとURLの文字列だけがそっけなく貼られたり、画像のない小さな表示になったりして、同じ内容でも反応が大きく変わります。この記事では、OGPの要点と、シェア前にありがちな失敗、そしてこのツールでの確認手順を整理します。

OGPの各タグが担う役割

カード表示は、いくつかのタグの組み合わせで成り立っています。og:titleはカードの見出し、og:descriptionはその下に出る説明文で、ページのtitleやmeta descriptionとは別に「シェアされたとき用」の文言を指定できます。og:imageはサムネイルに使われる画像、og:urlはそのコンテンツの正規URL、og:typeはページの種別(記事なら article、トップページなら website など)を表します。加えてog:site_nameでサイト名を添えると、どこの記事かが伝わりやすくなります。

X向けにはTwitter Cardという別系統のタグがあり、twitter:cardで表示形式を選びます。値が summary なら画像が小さめの横型カード、summary_large_image なら画像が大きく前面に出るカードになります。twitter:title・twitter:description・twitter:imageを個別に指定できますが、これらが無い場合Xを含む多くのサービスはog:*の値を流用します。まずはog:*を一通り揃え、Xで大きな画像を見せたいときだけ twitter:card に summary_large_image を足す、という順番が実用的です。

画像(og:image)の推奨仕様

カードの印象を最も左右するのがog:imageです。各SNSで崩れにくい定番は横1200×縦630ピクセル、横縦比およそ1.91対1です。この比率から外れると、サービス側で上下や左右が切り取られてしまいます。そのため文字やロゴは画像の端に置かず、中央寄りの安全な範囲に収めるのが安全です。容量は数百キロバイト程度までを目安にし、重すぎる画像は読み込み失敗の原因になります。画像URLは誰でもアクセスできる公開状態の、実在するファイルを指定してください。

ありがちな不備とキャッシュ問題

つまずきやすいのは次の3点です。og:imageを指定し忘れて画像なしのカードになっている。画像URLを相対パスで書いてしまい、SNS側が画像を見つけられない(og:imageやog:urlは必ず絶対URLで書きます)。そして画像や正規URLがエイチティーティーピーエスではない安全でない参照になっている、というものです。いずれも公開後に貼って初めて気づきがちです。

やっかいなのがキャッシュです。主要SNSは一度読み取ったOGP情報をしばらく保持するため、タグを直しても古い画像やタイトルが出続けることがあります。その場合は各社の再取得ツールを使います。フェイスブックはシェアデバッガー、XはCard Validator、LINEはLINE Developersのアカウント向けツールなどでURLを再読み込みさせると、最新のカードに更新されます。修正のたびに手作業でSNSへ貼って試すより、これらの公式ツールでキャッシュを更新するのが確実です。

このツールでの確認方法

公開前・修正直後の下調べは、このツールが手早く済みます。確認したいページのURLを入力して「確認する」を押すと、サーバー経由でそのページのHTMLを読み取り、上部にシェア時のカードを模したプレビュー、その下にtitle・description・canonical・og:*・twitter:*の各値を一覧で表示します。主要タグには「あり」「なし」の印がつくので、og:imageの入れ忘れなどがひと目で分かります。プレビュー画像はog:imageを優先し、相対パスは取得元ページを基準に絶対URL化して確認します。ツールはキャッシュせず毎回取得するため、直した内容がすぐ反映されます。ここで値を確かめてから、最終確認に各SNS公式のデバッグツールを併用すると安心です。なお取得対象はサーバーが受け取る初期HTMLのため、ジャバスクリプトで後からタグを付与する一部のページや、ログインが必要なページでは値が取れないことがあります。

「OGP・メタタグ確認」を使ってみる →

ほかの記事

URLスラッグの付け方ガイド|良いURLの条件・日本語の扱い・変更時の注意 文字コード変換ツールの使い方|文字とUnicode・UTF-8・実体参照を相互変換 最大公約数(GCD)と最小公倍数(LCM)の求め方と計算ツールの使い方 抽選・順番決めツールの使い方|くじ引き・シャッフル・サイコロ・コイントスを公平に 「◯日後・◯日前」の日付計算のやり方|100日後や納期の逆算も曜日つきで一発 退職金の税金はいくら?勤続年数から手取りを自動計算する方法

記事一覧をすべて見る →