Glossary
Open Graph
Open Graph (OG) is a metadata protocol that defines how a webpage previews when shared on social media — title, description, image.
Open Graph (originally a Facebook spec, now adopted across LinkedIn, X/Twitter, Slack, Discord, iMessage, and others) defines a set of <meta> tags that control how your URL renders when shared as a link preview.
Key OG tags: og:title, og:description, og:image (1200×630 recommended), og:url, og:type. Twitter has its own twitter:card tag with similar variants (summary, summary_large_image, app, player) — modern sites set both.
Sites without OG metadata render as bare URLs in social shares — drastically reducing click-through rate. Twitter shows the URL string with no preview; iMessage shows a small generic card; LinkedIn shows a poorly-rendered fallback. A custom OG image is one of the highest-ROI changes a marketing site can make.
The image is the highest-leverage tag. A 1200×630 image (the standard size) renders at full width on Twitter (summary_large_image), LinkedIn, and Slack. Most marketing sites use either a static image per page or dynamically-generated images per URL — Next.js has built-in OG image generation via @vercel/og or next/og.
Common OG mistakes: missing og:image (most damaging), wrong aspect ratio (1.91:1 is correct; square images get cropped), text that's too small to read at preview size, and stale cache from social platforms (use Facebook's Sharing Debugger or Twitter's Card Validator to force a re-scrape).
Example
A landing page with a custom 1200×630 OG image, a sharp title, and a one-line description gets ~3× the click-through rate of the same URL with no OG tags — measurable inside the first hour of social distribution.