Social platforms read two parallel meta tag systems: Open Graph (og:*) and Twitter Cards (twitter:*). They overlap heavily, but they are not identical — and getting both right matters.
Open Graph tags
Defined with property="og:...". Used by Facebook, LinkedIn, Discord, WhatsApp, Slack, iMessage, and many others. This is your primary sharing layer.
<meta property="og:title" content="Page title"><meta property="og:image" content="https://example.com/og.jpg">Twitter Card tags
Defined with name="twitter:...". Used by X (formerly Twitter). If Twitter tags are missing, X falls back to Open Graph — but explicit tags give you more control.
<meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="Page title"><meta name="twitter:image" content="https://example.com/og.jpg">Key differences
| Aspect | Open Graph | Twitter Cards |
|---|---|---|
| Attribute | property | name |
| Image card types | One standard large image | summary, summary_large_image, player |
| Fallback | — | Falls back to og:* if missing |
| Primary consumers | Facebook, LinkedIn, Slack… | X (Twitter) |
Minimum dual setup
For most marketing pages, mirror your Open Graph values into Twitter tags:
<meta property="og:title" content="..."><meta property="og:description" content="..."><meta property="og:image" content="https://..."><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="..."><meta name="twitter:description" content="..."><meta name="twitter:image" content="https://...">Always use summary_large_image unless you intentionally want a small thumbnail card.
When values should differ
- X-specific crops — X sometimes crops differently. If previews look wrong on X only, set a dedicated
twitter:image. - @site / @creator — Add
twitter:siteandtwitter:creatorfor attribution on X.
Validate both layers
OpenGraph Check shows Facebook, LinkedIn, X, WhatsApp, and Discord previews side by side so you can spot mismatches between OG and Twitter tags instantly.
