タイトル・説明文・OGP画像などを入力すると、HTMLのmetaタグ一式を生成します。コピーして<head>に貼り付けるだけで、検索結果とSNSでの見え方を整えられます。
生成される主なタグ
og: で始まるタグはOpen Graph Protocolの仕様で、FacebookやLINEなど多くのサービスがリンクカードの表示に利用します。X(旧Twitter)は twitter:card を優先しますが、未指定の場合はOGPを参照します。
<title> <meta name="description"> <link rel="canonical"> <meta property="og:title" / "og:description" / "og:image" / "og:url" / "og:type"> <meta name="twitter:card">
書き方のポイント
- title:全角30文字前後。重要な語を前半に置く。ページごとに固有にする
- description:全角120文字前後。クリックしたくなる要約にする(順位には直接影響しませんが、クリック率に効きます)
- og:image:1200×630px 推奨。テキストは中央寄せにすると、切り抜かれても読めます
- canonical:内容が重複するページがある場合、正規URLを指定する
確認方法
設置したあとは、実際のURLをSNSに貼って表示を確認するのが確実です。X・Facebook・LINEにはそれぞれ公式のデバッグツールがあり、キャッシュの更新もそこから行えます。
OGP画像を差し替えても表示が変わらない場合は、SNS側のキャッシュが残っていることがほとんどです。
よくある質問
Q descriptionは検索順位に影響しますか?
直接の順位要因ではないとされていますが、検索結果に表示されクリック率に影響します。
Q OGP画像の推奨サイズは?
1200×630px(1.91:1)が一般的です。小さすぎるとカードが縮小表示されることがあります。
Q canonicalはいつ使いますか?
同じ内容が複数のURLで見られる場合に、正規のURLを1つ指定するために使います。
Q SNSでの見え方を確認するには?
各サービスの公式デバッグツールでURLを入力すると、キャッシュを更新して表示を確認できます。
