OG Preview + Checker
All articles
7 min readOpen GraphFundamentals

What is Open Graph? A plain-English guide to og tags

Open Graph decides what people see when your link is shared. Here is what the protocol is, which og tags matter, and how to check yours in a minute.

Key takeaways

  • Open Graph is a set of meta tags that tells platforms what headline, description and image to show for your link.
  • og:title, og:description, og:image and og:url do the heavy lifting; LinkedIn never shows og:description.
  • Stale previews are a caching problem — fix the tags, then force a refresh in the platform's own debugger.
CB

Chris Bonney

CommonPoint LLC

Open Graph is a metadata protocol. Facebook published it in 2010 to solve one problem: when somebody pastes a link, what should the platform show? Rather than guessing from the page, the platform reads a handful of meta tags you control. Almost every service that turns a link into a card now reads them — LinkedIn, Slack, WhatsApp, Discord, iMessage and X included.

What an og tag actually looks like

An Open Graph tag is a normal HTML meta element in the head of your page. It uses the property attribute rather than name, and every Open Graph property is prefixed with "og:".

<meta property="og:title" content="How we cut onboarding to four minutes" />
<meta property="og:description" content="The three steps we deleted, and what happened to activation." />
<meta property="og:image" content="https://example.com/onboarding-card.png" />

Which og tags matter

  • og:title — the headline. Without it, platforms fall back to your <title>, which is written for Google, not a feed.
  • og:description — the supporting line. Facebook, Slack, WhatsApp and Discord show it. LinkedIn never does.
  • og:image — the single biggest factor in whether anyone clicks. Absolute https URL, 1200x630.
  • og:url — the canonical address, so shares of tracked variants do not fragment your counts.
  • og:type — website for most pages, article for posts.
  • og:site_name — your brand, shown above the headline in Slack and Discord.

Open Graph versus Twitter Cards

Twitter Cards are a parallel set of tags using name="twitter:...". X falls back to your Open Graph tags when they are missing, so you rarely need to duplicate everything. The one exception is twitter:card — set it to summary_large_image or X may shrink your artwork into a small square.

Why correct tags still show the wrong card

Caching. LinkedIn keeps the first preview it built for a URL for about a week. Facebook and Instagram share a cache that needs a manual re-scrape. So the order matters: fix the tags, deploy, verify, then force the refresh in the platform's own debugger — and only then post.

How to check yours

Paste your URL into the checker on this site. It reads the live tags, downloads the real image to measure it, grades what it finds, and hands you the exact tag to add for anything missing.

Check your own page

Paste a URL into the free preview and checker to see all seven platform cards and a graded audit.

Open the tool