Why Link Previews Break: Open Graph, X Cards, and Social Metadata Debugging

If someone shares your page and the preview looks broken, most people will never tell you. They just will not click.

That is why social metadata deserves more respect than it usually gets. A good preview helps with trust, click-through, and basic professionalism. A bad preview makes the site feel unfinished.

The two layers to care about

For most teams, the practical metadata stack is:

• Open Graph tags for broad social/link preview compatibility
• X/Twitter card tags for X-specific card behavior

If you get Open Graph wrong, previews often degrade across multiple platforms. If you get X card tags wrong, previews on X become less predictable.

The minimum good baseline

At minimum, each high-value page should set:

• og:title
• og:description
• og:image
• og:url
• twitter:card

In many cases it also helps to set:

• og:image:alt
• twitter:title
• twitter:description
• twitter:image

The failures that happen most often

Wrong image

This usually happens because:

• the image URL is stale,
• the page falls back to a generic image,
• the image is blocked, too large, or badly cropped,
• the OG image for a blog or product page was never generated.

Wrong title or description

This usually means one of these:

• the OG tags are missing,
• the template is inheriting the wrong page title,
• the description is too generic,
• the platform is falling back to other metadata because the social tags are incomplete.

Old preview after a fix

This is often a cache problem, not a metadata problem. Social platforms cache previews aggressively enough that teams think the fix failed when it has actually not refreshed yet.

A practical debugging workflow

1. View the raw HTML that a crawler receives.
2. Confirm the page is returning HTTP 200.
3. Confirm the canonical URL and OG URL agree.
4. Verify the image URL loads directly and returns a real image.
5. Check that social tags are page-specific, not generic layout leftovers.

If the preview still looks wrong after that, suspect platform cache before assuming the page is still broken.

Open Graph and canonical drift

One subtle problem is when the page says one thing in canonical metadata and another in social metadata.

Examples:

• canonical points to the clean URL, but og:url points somewhere else,
• the page title is updated but OG title is still generic,
• the image is still inherited from an older page template.

These issues make previews feel inconsistent and can create trust drift even when the page itself is fine.

Image rules worth enforcing

Your preview image should be:

• intentionally designed for sharing,
• reachable over HTTPS,
• not absurdly heavy,
• clearly branded,
• safe to crop.

The fastest route to bad previews is using whatever hero image happened to exist on the page.

Owner checklist

• [ ] Every important page has explicit Open Graph tags.
• [ ] X card tags are present and coherent with Open Graph.
• [ ] Social image URLs return a real image over HTTPS.
• [ ] Canonical, OG URL, and real page URL all agree.

Where Scavo helps

Scavo checks Open Graph, social preview signals, and the supporting metadata that decides how your links look when people share them.

That is useful because these issues are easy to miss if the team mainly tests inside the browser instead of through raw shared-link metadata.

Sources

• The Open Graph protocol
• X Developer Docs: About X Cards
• MDN: rel attribute reference, including icon

What to do next in Scavo

1. Run a fresh scan on your main domain.
2. Open the matching help guide in /help, assign an owner, and ship the smallest safe fix.
3. Re-scan after deployment and confirm the trend is moving in the right direction.