SiteAssets SiteAssets
Blog · Platforms 6 min read

Why the OG image still wins social previews in 2026

Every platform re-draws your link with its own layout. None of them agree on anything. Here is what each crawler actually reads, and why the image you ship is still the part people see.

6 min read SiteAssets team

A link preview is a negotiation. You publish tags, a crawler fetches them once, and a renderer turns them into a card that has nothing to do with your page layout. The only part you fully control is the data — which is why the OG image keeps punching above its weight.

The crawlers stopped agreeing years ago

Open Graph started as a Facebook spec, Twitter built a parallel set of tags, and everyone else improvised. In 2026 that means a page can look perfect on LinkedIn and broken on Discord without a single validation error.

  • X reads twitter:card first, then falls back to Open Graph. It prefers summary_large_image and crops to 1.91:1.
  • Facebook reads Open Graph only. It downscales to 1.91:1 and will reject images under 200 × 200.
  • LinkedIn prefers Open Graph, uses a 1.91:1 large card, and caches aggressively — sometimes for weeks.
  • Discord reads Open Graph, keeps the 1.91:1 card for embeds, and renders a square thumbnail inside compact messages.
  • WhatsApp still shows a small square thumbnail, so a wide card gets centre-cropped.
  • Slack renders a 1.91:1 unfurl and silently drops images served over plain HTTP.
  • Telegram caches the first render and needs a manual refresh when you change an image URL.

What actually breaks

In our scan data the same four problems account for most broken previews. They are all cheap to fix and all invisible on your own site.

  1. 01 og:image points at a URL that returns a 403 to non-browser user agents. The card falls back to a grey box.
  2. 02 og:title is missing, so the platform falls back to <title> and renders your SEO suffix — “Pricing — Acme | Blog”.
  3. 03 The image is 1200 × 1200. Nothing is broken, but the wide crop cuts your headline in half.
  4. 04 og:image:width and og:image:height are missing, so the first render is a 1:1 placeholder while the crawler measures the file.

Why 1200 × 630 is still the safe answer

The 1.91:1 ratio is the lowest common denominator across X, Facebook, LinkedIn, Discord and Slack. 1200 × 630 gives you enough pixels for a retina render, stays under every platform file-size ceiling, and survives the square crop that WhatsApp and Discord compact mode apply.

If you design at 1200 × 630 and keep all critical content inside a centred 1024 × 512 safe area, the same file is readable in every layout. That single constraint removes most of the guesswork.

Check, then fix, then generate

You cannot verify a preview by looking at your own browser. The only reliable loop is: scan the live URL the way a crawler sees it, fix the tags it reports, then regenerate the asset. That is the loop SiteAssets is built around — the same engine backs the website, the REST API and the MCP server.

Treat the preview card as an interface. It has a fixed aspect ratio, a title budget and no scroll.

Start by running your homepage through the Open Graph checker. Fifteen checks take about five seconds, and the report separates what breaks the card from what merely polishes it.

Try it on your own site

Fifteen checks, about five seconds.

Paste a deployed URL and read the check table: weight, status and the rule behind every row.