Open Graph & Twitter Preview
Preview how a URL renders on Facebook, LinkedIn, X, and iMessage — before you ship.
Paste og:title, og:description, og:image, and canonical URL to see accurate social-card previews across Facebook, LinkedIn, X (Twitter), and iMessage-style unfurls. Flags missing tags and wrong aspect ratios.


The social card is often the only creative asset a link ever gets — most platforms strip your carefully-designed page down to a title, a description, and a single image the moment it's shared. If that image is the wrong aspect ratio, the description tag is missing, or the platform's crawler can't even reach your og:image URL (a surprisingly common failure when images sit behind auth or a CDN misconfiguration), the share renders as a blank grey box or falls back to a random image scraped from the page body.
This previewer renders your Open Graph and Twitter Card tags the way each platform's unfurl engine actually displays them — not identically, since Facebook, LinkedIn, X, and iMessage each apply their own cropping, title-length limits, and fallback logic. Testing across all four before you publish catches the platform-specific failure that a single-preview tool misses.
Open Graph vs Twitter Card tags
Open Graph (`og:title`, `og:description`, `og:image`, `og:url`) is the protocol Facebook originated and LinkedIn, Slack, iMessage, and most other platforms now use as the default fallback. X (formerly Twitter) has its own `twitter:card`, `twitter:title`, `twitter:image` tags, but importantly, X will fall back to Open Graph tags if Twitter-specific ones are absent — so in practice most sites don't need to duplicate every field, just set `twitter:card` to `summary_large_image` and let the rest inherit from Open Graph.
The two `twitter:card` types behave very differently: `summary` renders a small square thumbnail beside the text, while `summary_large_image` renders a full-width hero image above the text. Using the wrong type for your image's actual aspect ratio produces awkward cropping — a wide 1200×630 image submitted under `summary` gets squeezed into a square, cutting off key visual elements.
Image dimensions that actually work
The de facto safe standard across platforms is 1200×630px (a roughly 1.91:1 ratio) for `summary_large_image` and Open Graph generally. Facebook and LinkedIn will accept other ratios but crop unpredictably; X requires images at least 300×157px for `summary_large_image` but renders best near the 1200×630 standard as well. Keep critical text and faces away from the outer 10% of the frame on all sides, since different platforms crop slightly differently at render time.
- 1200×630px (1.91:1) is the universal safe size for og:image and summary_large_image.
- Keep file size under ~1MB — some crawlers time out or refuse to fetch larger images.
- Serve og:image over HTTPS with no auth wall — platform crawlers can't log in to fetch it.
- Set an explicit og:image:width and og:image:height to avoid layout-shift guessing on the platform's end.
- Absolute URLs only — relative paths in og:image frequently fail to resolve on the crawler's side.
Debugging a blank or stale preview
If a share renders blank or shows an old title after you've fixed the tags, the platform almost certainly cached the previous crawl. Facebook, LinkedIn, and X each maintain their own cache with different refresh triggers — Facebook's Sharing Debugger and LinkedIn's Post Inspector both offer a manual 'scrape again' action that forces a fresh fetch, which is essential after any Open Graph tag change on an already-shared URL. There is no equivalent public tool for X, so cache staleness there can take longer to clear.
Step-by-step workflow
- 1Set og:title, og:description, og:image, and canonical URL
These four cover the default fallback for nearly every platform.
- 2Paste them into the previewer
Check the rendered card, not just whether the fields are technically present.
- 3Compare across all four platform previews
Facebook, LinkedIn, X, and iMessage each crop and truncate slightly differently.
- 4Fix any flagged aspect-ratio or missing-tag warnings
A 1200×630px image resolves most cross-platform cropping issues.
- 5Force a re-crawl on already-shared URLs
Use Facebook's Sharing Debugger and LinkedIn's Post Inspector to clear stale cached previews.
- 6Spot-check a real share
Send the link to yourself in Slack or iMessage as a final confirmation before wide distribution.
Frequently asked questions
- Why does my Facebook preview show an old title after I updated the tag?
- Facebook caches Open Graph data per URL and only re-crawls on a trigger. Use the Facebook Sharing Debugger's 'Scrape Again' function to force a fresh fetch after any tag change.
- Do I need separate twitter:image and og:image tags?
- No — if twitter:image is absent, X falls back to og:image automatically. Only set twitter-specific tags if you genuinely want a different image or copy on X than elsewhere.
- What image size should I use if my platform only allows one og:image?
- 1200×630px is the safest universal choice, rendering acceptably on Facebook, LinkedIn, X, and iMessage without severe cropping on any of them.
- Why does my og:image show as blank even though the URL works in a browser?
- Check whether the image sits behind authentication, a bot-blocking CDN rule, or a robots.txt disallow on the image path — platform crawlers fetch images anonymously and can be blocked by protections aimed at scrapers.
- Does a good social card actually affect SEO rankings?
- Not directly — Open Graph tags aren't a ranking factor. They affect click-through and share rates on social platforms, which indirectly drive referral traffic and, at scale, brand-signal exposure.
- Should every page have unique og:title and og:description, or can I reuse the meta title?
- Reusing meta title/description is fine as a default, but for high-value pages expected to be shared often, writing social-specific copy (punchier, more conversational than SEO meta copy) tends to improve share engagement.
- ·Verifying share previews before publishing
- ·Debugging blank Facebook cards
- ·Comparing summary vs summary_large_image
SERP Preview Simulator
See how your title and meta description render on Google — with pixel-accurate truncation.
Schema Explorer
Browse the JSON-LD blocks we ship — and copy the ones you need.
Meta Length Checker
Bulk-check title and description length across dozens of pages at once.
Programmes that use this exact analysis.
Austin content strategy agency building topical authority that ranks on Google and gets cited by ChatGPT & Perplexity. Book a free audit.
Technical SEO agency in Austin fixing Core Web Vitals, schema, and crawl issues. We ship the fixes that get you ranked and cited by AI.
