{{ card.description || 'No description provided.' }}
| Platform | Source tag | Host | Dimensions | Fit | Action | Copy |
|---|---|---|---|---|---|---|
| {{ row.platform }} | {{ row.sourceTag }} | {{ row.host }} | {{ row.dimensions }} | {{ row.fit }} | {{ row.action }} |
| Family | Tag | Value | Used by | Copy |
|---|---|---|---|---|
| {{ row.family }} | {{ row.tag }} | {{ row.value }} | {{ row.usedBy }} |
| Level | Check | Evidence | Action | Copy |
|---|---|---|---|---|
| {{ row.level }} | {{ row.check }} | {{ row.evidence }} | {{ row.action }} |
{{ headSnippet }}A shared web address usually becomes a preview before anyone clicks it. Messaging apps, social feeds, collaboration tools, and search-adjacent crawlers read metadata from the page head, choose a title, summary, image, and preferred URL, then render a card that may be cached for later shares. Open Graph is the broad shared vocabulary for that job; X card tags, canonical links, and ordinary HTML title and description metadata fill in platform-specific details or fallbacks.
The preview can fail even when the page looks correct in a browser. A crawler may see a redirect target instead of the page a human opened, reject a private or non-HTTPS image, choose the first duplicate tag, ignore a relative image path, or reuse an older cached scrape. These problems appear most often during launches, CMS migrations, documentation refreshes, product campaigns, and staging-to-production handoffs, because the final share card depends on both metadata quality and public crawler access.
Good preview QA separates three questions that are often blurred together. The first is whether the page declares the right facts. The second is whether those facts are public, absolute, and consistent. The third is whether a particular platform will actually render the same card after its own crawl, cache, image processing, and truncation rules. A clean local preview answers the first two questions well; the last question still needs the target platform's own crawler or a controlled share test.
The most useful terms are simple, but they carry different responsibilities. The Open Graph title and image describe the shared object for Open Graph-first consumers. The X card selector declares whether X should build a compact summary or a large-image card. A canonical URL gives crawlers one preferred identity when the same content is reachable through redirects, campaign parameters, alternate domains, or duplicate paths. Image dimensions and alt text do not make an image fetchable, but they help preview systems size the card and describe the artwork when it cannot be shown.
| Risk | What People Notice | What Usually Needs Checking |
|---|---|---|
| Missing image metadata | A plain text card, a tiny thumbnail, or a generic placeholder. | Open Graph and X image fields, public HTTPS access, and image dimensions. |
| Relative or staging URLs | The local preview works, but the public share cannot find the asset or canonical page. | Final base address, absolute image paths, and canonical identity. |
| Conflicting metadata families | One app shows a different title, description, or image from another. | Open Graph, X card, ordinary title, meta description, and duplicate tag order. |
| Poor image ratio or size | Soft artwork, cropped text, or a card shape that feels smaller than expected. | Large-card dimensions near 1.91:1, platform minimums, and text-safe image margins. |
| Cache or crawler differences | A corrected page still shares the old preview. | Redirects, cache age, bot access, and the target platform's own inspector. |
A preview check is best treated as launch evidence, not proof of final rendering. It makes the likely card visible, exposes missing or contradictory metadata, and helps teams fix the page before Facebook, X, LinkedIn, Slack, Discord, WhatsApp, Telegram, iMessage, or another consumer applies its own access and cache rules.
Use the input path that matches the page's real publication state, then compare the visual cards with the extracted tags and audit rows.
/share-card.png resolve as crawler-ready image or canonical URLs.twitter:card is absent, Image size override fills missing dimensions, and Load remote preview images lets the browser request the listed image URLs.A ready first pass has a specific title, a compact description, one public image, a stable canonical identity, and no unexpected Error rows. After that, test the deployed page through the platform debugger or share inspector that matters for the launch.
The platform fit percentage is a local readiness score, not a promise from the platform. It compares the extracted fields with profile rules for common share consumers, then summarizes which cards are likely to need fixes before a live crawler sees the page.
| Result Cue | Best Reading | Next Check |
|---|---|---|
| Preview needs crawler fixes | At least one required preview fact is missing, usually a title, image, or canonical identity. | Open Crawler Audit and fix Error rows before relying on any score. |
| Warning rows | The card may be incomplete, too long, too small, non-HTTPS, missing an explicit field, or dependent on a risky fallback. | Resolve warnings before a release page, paid campaign, product announcement, or high-visibility document share. |
| Review rows | The value exists but needs human judgment, such as a short title, duplicate tag, image-alt gap, or assumed X card type. | Decide whether the difference is intentional, then remove stale duplicates when the first value is not the intended one. |
| Platform Scores at 85% or above | The local profile sees enough metadata to label that platform as ready. | Still run a real platform check because cache state, redirects, and crawler access sit outside the local score. |
| Image Matrix | The selected image is compared against each platform profile for source tag, host, dimensions, protocol, and ratio fit. | Use it to find public image, HTTPS, size, and crop risks before sharing the page. |
| Tag Ledger | The ledger shows the discovered title, description, image, canonical, Open Graph, X card, icon, and fallback rows. | Use it when one app appears to choose a different value from another. |
The easiest mistake is treating the mockup as the final share card. A live crawler may see different HTML after redirects, reject a protected asset, crop a wide image differently, or keep an older scrape. Treat the local result as the checklist that should be clean before the platform-specific test.
Open Graph represents a page as a shareable object. The core object fields are title, type, image, and object URL; description, site name, image dimensions, secure image URL, and image alt text add context and reduce ambiguity. X cards use a related metadata family for card type, title, description, image, and image alt text, while ordinary HTML title and description fields remain important fallbacks.
Preview extraction is a precedence problem as much as a parsing problem. Each platform family prefers a slightly different order of fields, and duplicate or conflicting tags can produce different cards in different apps. Canonical identity is the stabilizer: it tells crawlers which public address should represent the object when tracking links, redirects, alternate domains, or duplicate paths point to the same content.
| Stage | Metadata Read | Preview Meaning |
|---|---|---|
| Head extraction | title, selected meta rows, and selected link rows. |
The ledger records title, description, canonical, Open Graph, X card, image, icon, article, and theme-color facts. |
| URL resolution | Image URLs, canonical URLs, Open Graph URLs, X URLs, the document base element, and the supplied base page address. | Relative paths become absolute public URLs when a reliable base address is available. |
| Field precedence | Platform-specific title, description, image, and card selectors, then Open Graph and ordinary HTML fallbacks. | Cards prefer explicit platform metadata but can still render from fallback values when some fields are absent. |
| Image checks | og:image, og:image:secure_url, twitter:image, dimensions, image alt text, and optional size overrides. |
The image matrix reports protocol, host, dimensions, aspect-ratio fit, and platform-specific follow-up action. |
| Audit profile | Launch QA, Standard review, or Quick preview. | The chosen strictness changes how missing descriptions, short text, small images, and missing X card fields are reported. |
Each platform profile starts at 100 points and subtracts penalties for missing or risky metadata. The final value is rounded and clamped from 0 to 100, then labeled Ready at 85 or above, Review from 70 to 84, and Fix below 70.
| Penalty Condition | Applies To | Points |
|---|---|---|
| Missing preview title | All platform profiles | 24 |
| Missing preview description | All platform profiles | 16 |
| Missing preview image | Most platform profiles; Slack uses a lighter image penalty | 22 or 12 |
| Missing canonical identity | All platform profiles | 10 |
Missing explicit twitter:card |
X / Twitter profile | 12 |
| Missing explicit Open Graph title | LinkedIn, WhatsApp, and Open Graph-first profiles | 10 |
| Title above 95 characters or description above the profile target | All platform profiles | 8 |
| Image dimensions missing, too small, or outside the common ratio range | All platform profiles | 8 to 18 |
Missing theme-color |
Discord profile | 4 |
| Check | Boundary | Review Meaning |
|---|---|---|
| Preview title | Blank is an error. Above 95 characters warns. Below 20 characters asks for review except in quick preview. | The useful phrase should appear before feed or chat truncation hides it. |
| Preview description | Blank is a warning in launch checks and a review item otherwise. Below 70 characters asks for review except in quick preview. Long text warns at 200 characters for X and 240 for lighter profiles. | The description should summarize the page without depending on every app to show the full sentence. |
| Preview image | Missing image metadata is an error. Non-HTTPS image URLs warn. | Rich cards need a public image URL that crawlers can fetch without cookies, private access, or mixed-content risk. |
| Image dimensions | Missing dimensions ask for review. Launch checks warn below 1200 by 627 pixels. Ratios below 1.7:1 or above 2.1:1 ask for crop review. | Dimensions help avoid soft large-card artwork, unexpected crops, and tiny thumbnails. |
| Open Graph object fields | og:title, og:type, og:image, and og:url are checked as the required object set. |
Fallback values can render a card, but explicit object fields reduce platform ambiguity. |
| Canonical identity | Missing canonical URL, og:url, and X URL metadata raise a warning or review item depending on the profile. |
The preferred public URL should be clear before share caches start grouping the page. |
| X card selector | If twitter:card is absent, the selected default card is used only as a preview assumption and the missing selector is reported. |
An explicit card type removes ambiguity for X rendering. |
| Duplicate and conflicting tags | Repeated title, description, image, canonical, Open Graph, or X card values are review items when duplicates are found. | Keep the intended value first and remove stale values when different consumers could prefer different fallbacks. |
The public fetch path accepts public HTTP and HTTPS pages, strips fragments, rejects embedded credentials and private network targets, follows up to three redirects, and inspects a bounded response. Pasted HTML avoids that network step, but it still depends on the supplied base address when relative paths need to become crawler-ready URLs.
Paste HTML parses the supplied markup in the browser. Fetch public URL sends the entered page address to a server-side fetch step so the public HTML can be retrieved from outside the browser. The fetched response can include page titles, metadata, headers, image URLs, canonical URLs, and head markup.
A product announcement includes og:title, og:type, og:url, og:description, a public HTTPS og:image, 1200 by 630 dimensions, image alt text, and twitter:card set to summary_large_image. The expected result is a believable large-card mockup, ready rows for the main crawler checks, and platform scores above the ready target.
A documentation article has a clear title, meta description, and canonical URL but omits og:image and twitter:image. Social Cards will use image placeholders, Image Matrix will mark the image as missing, and most platform scores will fall below ready. The text can still be useful, but the page is not ready for a rich social preview.
A staging page on localhost or a private network should not be checked with Fetch public URL. Copy the rendered head from the staging browser, switch to Paste HTML, set Base URL to the intended public page address, and use Tag Ledger plus Crawler Audit to clean up metadata before the deployed page is tested by live crawlers.
Base URL lets relative paths resolve the way they would on the final page. Without it, paths such as /images/share-card.png or /blog/post cannot be judged as absolute crawler-ready URLs.
Social Cards is a local mockup based on extracted metadata and platform profiles. A live app can use cached data, reject an image, crop differently, see different HTML after redirects, or prefer a platform-specific fallback.
Load remote preview images is off by default. Placeholders let you inspect image URLs and hosts without making browser image requests; enable the switch only when those image URLs are public and safe to request.
Fetch public URL is limited to public HTTP and HTTPS pages. Localhost, private IP ranges, unresolved hosts, embedded credentials, long redirect chains, timeouts, and oversized responses are rejected; paste rendered HTML when public fetching is not appropriate.
No. Default X card is only the assumed preview shape for pages that omit twitter:card. Crawler Audit still reports the missing selector so you can add the explicit tag before launch.
Head Snippet mirrors what was extracted from the supplied page. Use it as review evidence, then update the real metadata in the site or CMS that owns the final public page.
twitter: tag names to describe the card type, title, description, image, and image alt text for X previews.