What is Open Graph, really?

Open Graph tags control how your links appear when shared on Slack, LinkedIn, X, and every major platform. Here is what they are and how to get them right.

What Open Graph is

Open Graph is a protocol — originally created by Facebook in 2010 — that lets you control how a web page appears when someone shares its URL. You add a handful of <meta> tags to your page's <head>, and every major platform (Facebook, LinkedIn, Slack, Discord, X, iMessage, WhatsApp) reads those tags to build the link card.

Without Open Graph tags, platforms guess: they might pull a random image from the page, truncate the title awkwardly, or show nothing at all.

Check your Open Graph tags

Run the free Open Graph Checker to see which tags are missing, invalid, or too small.

Open Graph Checker

The four tags that matter

These four cover every platform that supports the standard:

  • og:title — the headline shown in the card (aim for 50–60 characters)
  • og:description — the supporting line below the title (150–160 characters is a good target)
  • og:image — the preview image; must be an absolute, public URL
  • og:url — the canonical URL of the page

A minimal correct implementation looks like this:

HTML
<head>
  <meta property="og:title" content="Your Page Title" />
  <meta property="og:description" content="A clear description of what this page is about." />
  <meta property="og:image" content="https://yourdomain.com/og-image.png" />
  <meta property="og:url" content="https://yourdomain.com/your-page" />
</head>

How platforms read them

Each platform has its own crawler that fetches the page and reads the og:* tags:

  • Facebook and LinkedIn follow the Open Graph spec closely and cache results for days.
  • Slack and Discord scrape on-demand when you paste a URL and re-scrape on refresh.
  • X (Twitter) uses its own twitter:card tags but falls back to og:* if they're absent.
  • WhatsApp and iMessage read og:image directly; a small, fast-loading image (under ~300 KB) produces the most reliable preview.

Image requirements

Every platform reads og:image, but they render it differently. The size that works everywhere is 1200×630 pixels (1.91:1 ratio). See the full breakdown in Open Graph image size.

Two non-negotiable rules:

  1. The URL must be absolute (https://…). A relative path like /og.png fails.
  2. The image must be publicly reachable — no auth, no IP restrictions.

Common mistakes

  • Using a relative URL in og:image (the single most common cause of missing previews)
  • Forgetting og:url, which causes the canonical to mismatch the shared URL
  • Describing the page in og:description the same way as <title> — a missed chance to add context
  • Setting og:image to a tiny icon or logo; platforms crop aggressively at small sizes

How to check yours

Paste any URL into the Open Graph Checker to see exactly what each platform's crawler would read. It flags missing tags, relative image URLs, and unreachable images in one pass.

Want to maintain this across every route?

Linkraft is coming soon. Use the free tools today, and join the waitlist for route-level fixes, monitoring, and reports.

By joining the waitlist, you agree to receive launch updates from Linkraft. You can unsubscribe at any time.

No spam. Just launch updates and useful resources about metadata, schema, and link previews.