Why Your Links Look Broken on Social (And the 10-Minute Fix)
That grey box where your preview image should be? Open Graph tags control it — here's how they work, the sizes that matter, and how to test before posting.
You share your new page in the company group and it lands as a naked grey link — no image, a half-sentence of navigation text as the "description," instant credibility damage. Meanwhile some competitor's link unfurls into a handsome card with a crisp image and a headline that sells the click.
The difference is about eight lines of HTML. The platforms aren't judging your site's beauty — they're reading specific tags, and if the tags aren't there, they guess badly.
How link previews actually work
When a URL hits WhatsApp, LinkedIn, X, Slack or Discord, the platform fetches the page and looks for Open Graph tags in the <head>:
```
og:title — the card's headline
og:description — the sentence under it
og:image — the picture (the part everyone notices)
og:url — the canonical address
```
X reads its own twitter:card variants first, then falls back to OG. No tags → the platform scrapes whatever it finds: your <title> (fine), a random first image (chaotic), or nothing (the grey box).
Diagnosis takes one minute: run your URL through Open Graph Preview and see the card each platform will render — before your audience does. For what's present-vs-missing at the tag level, Meta Tag Analyzer itemizes the head.
The image: where cards are won
og:image decides whether the card gets glanced at or scrolled past. The rules that matter:
- Size: 1200×630 (1.91:1) is the standard that renders well everywhere — big enough for retina, the ratio large cards expect. Under 600px wide, platforms may downgrade you to a tiny-thumbnail layout.
- Weight: keep it lean. Heavy images time out on slow fetches and the preview silently fails — Compress Image to well under 1MB.
- Design for the format: text on the image should be huge (it renders small in feeds), critical content centered (platforms crop edges at different ratios). Build it at exact dimensions with Resize Image or the Social Media Image Resizer presets.
- Absolute URL, publicly reachable —
https://yoursite.com/og.jpg, not a relative path, not behind login.
One good default og:image for the whole site beats none; per-page images beat the default where the page matters.
The copy: title and description
og:title isn't your SEO title's clone — it can be punchier (no brand-suffix ceremony needed) and should survive at ~60 visible characters. og:description gets one sentence to earn the click; front-load it, because platforms truncate at different lengths. Draft both against the same discipline you'd use in Snippet Optimizer — small-space copywriting is one skill wearing two hats.
The refresh trap (read before you panic)
You fixed the tags, reshared the link — same broken card. Platforms cache previews aggressively: WhatsApp for days, LinkedIn similar, X and Slack shorter. The fix is fetching-forced-fresh: most platforms honour a URL with a harmless query string appended (?v=2) as a new object, and X/LinkedIn offer official re-scrape endpoints. Test with Open Graph Preview first so you know the tags are right and cache is the only enemy left.
Frequently Asked Questions
My preview shows on X but not WhatsApp — why?
Usually image weight or fetch speed — WhatsApp's fetcher is impatient. Compress the og:image and confirm it's directly reachable (no redirects) — then bust the cache with a query-string version.
Do OG tags affect Google rankings?
Not directly — but they shape sharing, and shared links drive the traffic and signals that do matter. Treat cards as conversion optimization for every link you'll ever paste.
Can I have different images per platform?
Yes — twitter:image overrides for X while og:image serves everyone else. Most sites don't need the split; a well-designed 1200×630 works universally.
What about pages I can't edit, like a marketplace listing?
You can't tag what you don't control — but you *can* check what will render with the preview tool before sharing, and choose the URL variant that unfurls best.
Before the next launch post, spend the ten minutes: tags in, image at 1200×630, verified in Open Graph Preview — the rest of the visibility toolkit is at SEO & Web.
