✏️基本情報

ページタイトル 0

検索結果では全角30文字前後で切られます。

ページの説明 0

PCで約120文字、スマートフォンで約70文字までが表示の目安です。

ページのURL

OGP画像のURL

1200×630px を推奨。相対パスではなく絶対URLで指定してください。

サイト名

⚙️詳細設定

og:type

Twitter Card の種類

X（Twitter）アカウント

og:locale

テーマカラー

theme-color を出力する

追加で出力するタグ

canonical robots viewport charset

👁️見え方のプレビュー

Google 検索結果

example.com

—

X（Twitter）/ Facebook / Slack のカード

画像URLを入力するとここに表示されます

example.com

—

</>生成されたタグ

生成したタグは <head> の中に貼り付けてください。 OGP画像を用意するときは画像リサイズツールで1200×630に整えられます。

OGP・metaタグ生成ツールとは

OGP・metaタグ生成ツールは、SNSでリンクを共有したときに表示されるカードと、検索結果に出るタイトル・説明文を、見え方を確認しながら設定できるツールです。

OGP（Open Graph Protocol）はもともとFacebookが定めた仕様で、現在はX（Twitter）、Slack、LINE、Discordなど多くのサービスが参照しています。設定していないとリンクがただのURLとして表示され、クリックされる確率が下がります。

このツールは、入力に応じてタグを生成すると同時に、検索結果とSNSカードの見え方をその場でプレビューします。タイトルや説明文が長すぎて途中で切られないか、必要なタグが抜けていないかも同時に警告します。

OGP・metaタグ生成ツールの使い方

タイトル・説明・URL・OGP画像のURL・サイト名を入力します。
右側のプレビューで、検索結果とSNSカードでの見え方を確認します。
文字数カウンターが赤くなったら、切られない長さまで削ります。
生成されたタグをコピーして、HTMLの <head> の中に貼り付けます。

よくある質問

OGP画像のサイズはいくつが適切ですか？

1200×630ピクセル（1.91:1）が標準です。この比率から外れると、サービス側で上下または左右が切り取られます。ファイルサイズは1MB以下に抑えてください。画像のリサイズは画像リサイズツールで行えます。

画像を相対パスで指定してもよいですか？

いけません。OGP画像は外部のサービスが取得しに来るため、https:// から始まる絶対URLで指定する必要があります。相対パスだと画像が表示されません。

タグを更新したのにSNSのカードが変わりません。

各サービスが以前取得した内容をキャッシュしているためです。Facebookの「シェアデバッガー」やX（Twitter）の「Card Validator」でURLを再取得させると更新されます。キャッシュの保持期間はサービスによって数時間から数日です。

og:title と title タグは両方必要ですか？

はい。<title> は検索結果とブラウザのタブに使われ、og:title はSNSカードに使われます。同じ内容でも構いませんが、SNS向けにはサイト名を省いて短くするなど、使い分ける余地があります。

Twitter Card の設定も必要ですか？

twitter:card だけは指定しておいてください。それ以外の項目は、なければOGPの値が使われます。summary_large_image を指定すると大きな画像付きのカードになり、目に留まりやすくなります。

もう少し詳しく

文字数の目安

検索結果のタイトルは全角30文字前後、説明文はPCで約120文字、スマートフォンで約70文字までが表示の目安です。重要な語は前半に置いてください。なお説明文は検索順位そのものには影響しませんが、クリック率には直結します。Googleが本文から自動生成することもありますが、その内容は制御できないので、必ず自分で設定しておくべきです。

🏷️ OGP・metaタグ生成ツール