What Open Graph tags do
When someone pastes your link into X, LinkedIn, Facebook, Slack or a messaging app, the app fetches the page and builds a card from a few meta tags in its head. The Open Graph protocol defines most of them: og:title, og:description, og:image and og:url. X adds its own twitter: tags and falls back to the Open Graph ones. Without them, the app guesses from the title tag and the first image it finds, or shows a bare link.
That card is often the first thing people see of your product, long before your page. A wide image, a clear title and a one-line description earn more clicks than a plain address. This checker shows the card each network is likely to draw and lists what to change.
The tags that matter
og:title is the headline of the card. Keep it close to your title tag, around 60 characters, without the site name repeated. og:description is the line under it: one sentence that says what the page offers. og:url is the canonical address of the page. If it points somewhere else, Facebook reads the tags of that other address instead, which is a common reason a page seems to ignore its own tags.
og:type is required by the protocol; "website" fits most pages and "article" fits posts. Use property= on og: tags, as the protocol does. Put every tag inside the head and give each one a single value: when a tag appears twice, networks usually keep the first, and it is rarely the one you edited.
Image size and format
Make the image 1200 x 630 pixels. Facebook’s image guidance recommends at least that size at a 1.91:1 ratio, accepts files up to 8 MB, ignores images under 200 x 200 and shows images under 600 x 315 as small thumbnails. X accepts large card images from 300 x 157 up to 4096 x 4096 pixels and under 5 MB, in JPG, PNG, WEBP or GIF, but not SVG.
The checker downloads the image and reports its real type, weight and pixel size, and compares them with og:image:width and og:image:height when you declare them. Use an absolute https address: a relative path or an http image may not load inside an app. Add og:image:alt with a short description of what the image shows.
X cards and the twitter: tags
X needs one tag of its own, twitter:card. summary_large_image gives the wide image card; summary gives a small square thumbnail beside the text. For the title, description and image, X reads twitter:title, twitter:description and twitter:image first, then the og: versions, so you do not need to repeat them unless the text should differ on X.
The X preview here follows that order. When twitter:image points to a different file than og:image, the checker measures the og:image and leaves the X image out rather than guess.
Why a real preview can differ from this check
Networks cache cards. A preview fixed on your site can stay wrong in a feed until the network fetches the page again; the Facebook Sharing Debugger and the LinkedIn Post Inspector force that refresh. Layouts also change: the previews here are approximations of each card, not screenshots.
Crawlers do not run scripts, so tags injected by JavaScript are invisible to them and to this checker. Some sites also serve a different page to crawlers, or block them; the checker identifies itself as a bot, which helps prerendering services serve the right version. It reads public pages only, up to 1 MB, and stores nothing but an anonymous daily count for its limits.
Once the card looks right, the SERP simulator checks the same title and description as a search snippet, and the launch checklist lists what else to prepare before you share the link widely.
