Open Graph Tag Previewer

A social share card is assembled from metadata in a page’s HTML, not from the page’s visible headline or hero image. When a crawler finds a clear title, description, image, and permanent URL, a shared link is more likely to have the intended identity. Missing or conflicting values can instead produce a blank card, an old image, the wrong destination, or a platform-specific fallback.

Open Graph defines four basic properties: og:title, og:type, og:image, and og:url. A concise og:description and descriptive og:image:alt add context. X card tags can override some of these values for X, while ordinary HTML title and description fields may serve as fallbacks elsewhere.

Declared value

The title, description, image, or URL explicitly supplied for a social protocol.

Fallback value

A lower-priority value used when a platform-specific declaration is absent.

Canonical identity

The permanent public URL that should represent the shared page after redirects and alternate URLs are considered.

Preview cards are approximations. Each platform fetches pages on its own schedule, may cache an older response, and can crop or truncate content differently. A good preview therefore supports a launch check but cannot guarantee the card that every recipient will see.

The most consequential mistake is checking a CMS field or local template while ignoring the final public response. Relative image paths need the final page address to resolve correctly, redirects can change the canonical context, and a crawler must be able to retrieve the same public content that was reviewed.

How to Use This Tool:

Choose the source that most closely matches the page state you need to review.

1. Select an Input mode. Use Fetch public URL for a live public page, or Paste HTML for source text and HTML or TXT files up to 1 MB.
2. Provide the page context. For a public fetch, enter the final public address and choose Fetch page. For pasted source, add a Base URL when image or canonical values are relative.
3. Choose an Audit profile. Launch QA applies the tighter description and large-image review lines, while Quick preview treats some omissions more lightly.
4. Add fallback dimensions only when known. Enter both width and height if the markup omits them. A single dimension is not enough to assess aspect ratio.
5. Review the cards, platform scores, and audit findings. Fix errors and warnings in the source page, then fetch or paste the updated HTML again.

Interpreting Results:

Start with the audit findings. Missing core Open Graph properties, an absent image, a non-HTTPS image, mismatched canonical URLs, or duplicate core tags describe concrete metadata problems. The card previews then show which fallback chain supplied each platform’s title, description, and image.

• Ready means a platform’s advisory score is at least 85.
• Review means the score is at least 70 but below 85.
• Needs work means the score is below 70.

These labels measure the declared fields against local review rules. They do not prove that a platform fetched the page, accepted the image, refreshed its cache, or will render the same crop. Verify important launches with the platform’s own sharing debugger or a fresh real share after publication.

Technical Details:

Social preview resolution is an ordered lookup. Each platform checks its preferred fields first and then falls back to broader Open Graph or ordinary HTML metadata. Relative URL values are resolved against a document <base> address when present, otherwise against the supplied final page URL.

Transformation Core:

The source moves through four auditable stages before a result appears.

Formula Core:

Every platform starts at 100 and loses fixed points for missing or out-of-range fields. The overall score is the rounded mean of all eight platform scores.

Here, S_j is one platform score, p_j,k is an applicable penalty, and O is the displayed overall percentage. A missing title costs 24 points, a missing description 16, a missing canonical URL 10, and a missing image normally 22. Slack uses a 12-point missing-image penalty. Other fixed penalties cover long text, unknown image dimensions, undersized or unusually shaped artwork, and a few platform-specific declarations.

Rule Core:

Image requirements differ enough that one card can pass while another needs review. The table records the exact per-platform scoring baselines.

The score also subtracts 8 points when a title exceeds 95 characters. Descriptions above 200 characters lose 8 points for X; the other platform profiles use 240 characters. Image dimensions below the platform minimum cost 10 points, and an aspect ratio outside its interval costs 8. These are repo-authored review heuristics, not published platform guarantees.

The seven audit checks use a separate profile. Launch QA warns above 200 description characters and expects at least 1200 × 630 px; Standard review allows 240 characters but keeps the large-image baseline; Quick preview allows 240 characters and uses 600 × 315 px. All three treat ratios below 1.70 or above 2.10 as warnings.

Privacy Notes:

Pasted text and selected HTML or TXT files are parsed in the browser. Public URL mode sends the requested URL to a server-assisted fetcher, which follows up to three redirects, rejects embedded credentials and private or local network addresses, and returns public page HTML for review.

• The normal public fetch requests an 8-second timeout and a 900,000-byte response limit.
• Load remote preview images is off by default. Enabling it lets the browser request the public image URLs shown on the cards.
• A successful metadata check does not establish that a destination or image is safe. Treat unfamiliar URLs as untrusted.

Worked Examples:

References:

• The Open Graph protocol, Open Graph protocol.
• Cards markup, X Developer Platform.
• How to specify a canonical URL, Google Search Central.
• How to check Open Graph tags, Simplified Guide.