OGP と Twitter カード:共有・引用された時のリンクの“見え方”
チャットやSNS投稿、AIの回答にリンクを貼ると、小さなプレビューカードが現れます——タイトル、短い説明、画像。そのカードは推測ではなく、ページの <head> にある Open Graph と Twitter カードのタグで制御されています。正しく設定すればリンクは意図的でクリックしたくなる見た目になり、無ければ空白や崩れたプレビューになります。
効くタグ
<meta property="og:title" content="ページのタイトル">
<meta property="og:description" content="1行の要約。">
<meta property="og:image" content="https://example.com/preview.png">
<meta property="og:url" content="https://example.com/page">
<meta name="twitter:card" content="summary_large_image">
- og:title / og:description — カードの見出しと要約。
- og:image — プレビュー画像。1200×630 が大きいカードの安全なサイズです。
- og:url — そのページの正規アドレス。
- twitter:card —
summary_large_imageで大きな画像のレイアウト、summaryで小さいレイアウトになります。
なぜGEOで大事か
これはページが出歩く時の見せ方の話です。人が共有するにせよ、AIがプレビュー付きで取り上げるにせよ、これらのタグが「どう表現されるか」を決めます——明確なタイトルと画像はクリックを増やし、引用元としての信頼感を高めます。AIがページを読めるかは変わりません(それは他の工程)が、参照された時の見え方を形づくります。
まとめ
<head> に og:title・og:description・1200×630 の og:image・og:url・twitter:card を加えましょう。一度入れれば、共有や引用のたびにページが意図的な見た目になります。GEOの全体像の「理解できる形にする」工程に寄り添う“見せ方”の補完です。