You write a blog post, share it on LinkedIn, and the preview card shows a random nav icon from your header instead of the hero image you spent time selecting. Or worse, it shows nothing at all. Just a bare URL with no image, no title, no description. The post gets ignored because on social media, the preview card is the first impression, and a broken card looks like spam.
This happens because social platforms don't read your HTML <title> and <meta name="description"> tags the way search engines do. Facebook, LinkedIn, and most social platforms use Open Graph (OG) tags. Twitter/X uses its own Twitter Card tags (though it falls back to OG if its own tags are missing). Each platform has specific requirements for image dimensions, title length, and tag structure, and they all cache aggressively. Fix a broken tag today and the old preview might stick around for days.
What actually needs to be in your HTML
At minimum, every shareable page needs four Open Graph tags:
<meta property="og:title" content="Your headline here">
<meta property="og:description" content="A compelling 150-200 char summary">
<meta property="og:image" content="https://yoursite.com/images/hero.jpg">
<meta property="og:url" content="https://yoursite.com/your-page/">
For Twitter/X, you also want:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Your headline here">
<meta name="twitter:description" content="A compelling summary">
<meta name="twitter:image" content="https://yoursite.com/images/hero.jpg">
The image is where most people get tripped up. Facebook requires at least 1200x630 pixels for a large card. Twitter wants at least 800x418 for summary_large_image. If your image is too small, the platform either crops it badly or falls back to a tiny thumbnail that nobody clicks. If the image URL is relative instead of absolute, some crawlers won't resolve it and you get nothing.
Common mistakes that break previews
Relative image URLs. og:image must be an absolute URL starting with https://. A relative path like /images/hero.jpg works in browsers but social crawlers often can't resolve it against your page URL. This is the single most common OG implementation error.
Wrong image dimensions. An image that's 400x300 renders as a tiny thumbnail on Facebook instead of a full-width card. LinkedIn has its own preferred size (1200x627). If you're only going to make one image size, target 1200x630, which works acceptably across all major platforms.
Missing og:url. Without this tag, Facebook might create separate share counts for different URL variations of the same page (with and without trailing slash, with and without www). The og:url tag tells the platform which URL is canonical for share counting.
Stale caches. After you fix a broken OG tag, the platforms won't see the update until their crawler refetches the page. Facebook lets you force a refetch at the Sharing Debugger. Twitter has a Card Validator. LinkedIn has its Post Inspector. If you don't manually flush these caches, the broken preview can persist for a week or more.
Duplicate or conflicting tags. Some WordPress themes output OG tags, and so do SEO plugins. If both are active, you get two og:title tags and the platform picks whichever it hits first, which may not be the one you intended.
What the audit checks
The Meta + OG Inspector fetches your page and extracts every meta tag related to search engines and social platforms. It checks for the presence and completeness of OG tags, Twitter Card tags, canonical URL, and standard meta description. It shows you a preview of what each tag says so you can spot truncation, missing images, and relative URL problems.
This works well alongside the noindex / X-Robots-Tag Conflict Audit since a page that's accidentally noindexed might also have OG issues that compound the invisibility. The Image Alt Audit covers accessibility for the same images you're referencing in your OG tags.
If you're building a site to promote a book or product launch, social share previews are your distribution mechanism. In The $97 Launch, I cover how a well-optimized launch page gets shared through personal networks. If the share preview is broken, the compounding effect of social sharing collapses before it starts.
Fact-check notes and sources
- Open Graph protocol specification: ogp.me, originally developed by Facebook and published in 2010.
- Twitter Card documentation: Twitter Developer Docs, Cards. Twitter falls back to OG tags when Twitter-specific tags are absent.
- Facebook minimum image size for large share cards: 1200x630 pixels recommended, 600x315 minimum. Source: Facebook Sharing Best Practices.
- LinkedIn recommended image size: 1200x627 pixels. Source: LinkedIn Marketing Solutions documentation.
- Facebook Sharing Debugger cache behavior: Facebook caches OG data for up to 7 days unless manually cleared via the debugger tool.
Related reading
- Meta Robots Conflict Audit — check the other half of your head tag setup
- Image Alt Audit — accessibility for the images you're referencing in OG tags
- SERP Snippet Preview — how your page looks in Google search results
- Remote Dependency Audit — if your OG images load from a third-party CDN, that's another dependency
- Trust Signal Surface Audit — social proof and trust signals beyond meta tags
This post is informational, not web-development advice. Mentions of Facebook, Twitter/X, LinkedIn, and WordPress are nominative fair use. No affiliation is implied.
