Metadata comparisons
Your current page · 89 experimental cases
Open a case in its own tab to check favicons. Compare shows it beside your current page and displays the fixture head. HTML opens the complete fixture as plain text.
These include deliberately invalid controls. Automated checks verify the fixtures; browser and social-app behavior needs observation. The build includes Cloudflare Pages rules for HTTP headers, redirects and a real 404.
Use the production deployment URL when comparing indexing headers: Cloudflare adds its own noindex header to preview deployments. Share each case's own URL when testing link previews.
Observations recorded so far
- Brave: blue in both cases for
icons/ico32-svg, icons/svg-ico32. User reported observation; not an automated test or screenshot. Browser version and operating system were not recorded. - Firefox: blue in both cases for
icons/ico32-svg, icons/svg-ico32. User reported observation; not an automated test or screenshot. Browser version and operating system were not recorded.
Mobile browser icons and previews in LinkedIn, Discord, X, WhatsApp, Instagram and Facebook direct messages still need testing. Record the browser or app version, OS, exact URL, date and screenshot separately for each client.
metadata
- html-only · Compare · HTML
Which consumers use HTML title, description and canonical without Open Graph?
- html-plus-og-image · Compare · HTML
Does adding only og:image preserve the desired preview?
- explicit-og · Compare · HTML
Reference: explicit Open Graph values equal HTML metadata.
- no-og-type · Compare · HTML
Does removing og:type affect the chosen clients?
- no-og-url · Compare · HTML
Does canonical substitute for og:url on each client?
- no-og-title · Compare · HTML
Does HTML title substitute for og:title on each client?
- no-og-description · Compare · HTML
Does HTML description substitute for og:description on each client?
- no-description · Compare · HTML
How does an absent description behave?
- no-image · Compare · HTML
What remains without any image metadata?
- empty-og-title · Compare · HTML
Does empty OG title prevent HTML title fallback?
- whitespace-og-title · Compare · HTML
Does whitespace OG title prevent fallback?
- conflicting-titles · Compare · HTML
Which distinct HTML and OG title is selected?
- duplicate-og-title · Compare · HTML
Which duplicate OG title is selected?
- twitter-before-og · Compare · HTML
Does a conflicting Twitter title before OG change selection?
- twitter-after-og · Compare · HTML
Does a conflicting Twitter title after OG change selection?
- duplicate-twitter-values · Compare · HTML
Can identical Twitter fields be omitted?
- no-twitter-card · Compare · HTML
What layout results without twitter:card?
- summary-card · Compare · HTML
How does summary differ from summary_large_image?
- image-without-dimensions · Compare · HTML
Can image dimensions be omitted without changing the result?
- image-relative · Compare · HTML
Which clients accept root-relative OG images?
- image-svg · Compare · HTML
Which clients accept an SVG social image?
- image-missing · Compare · HTML
How does an unavailable social image fail?
- escaped-text · Compare · HTML
Are literal entities, quotes and angle brackets preserved?
- unicode-text · Compare · HTML
Are accented, Greek, Cyrillic, CJK, Arabic and emoji text preserved?
- long-title · Compare · HTML
What is truncated by each client, without an arbitrary build limit?
- image-without-alt · Compare · HTML
Is image alternative text exposed by the chosen clients?
- image-alt-twitter · Compare · HTML
Does Twitter image alternative text change accessibility in the X client?
- image-secure-url-duplicate · Compare · HTML
Does repeating an HTTPS image as secure_url change anything?
- image-two-candidates · Compare · HTML
Which image is chosen when two different OG images are advertised?
- image-fallback-candidate · Compare · HTML
Does a valid second image rescue a missing first image?
- title-with-site-suffix · Compare · HTML
Can a page title and a document title intentionally differ?
- og-locale-fr · Compare · HTML
Does og:locale add useful client behavior beyond an explicit French document language?
- redundant-index-follow · Compare · HTML
Does explicitly advertising the default index,follow change anything?
canonical
- canonical-absent · Compare · HTML
Does a missing canonical affect social previews?
- canonical-relative · Compare · HTML
How is a relative canonical resolved?
- canonical-cross-origin · Compare · HTML
Does a different canonical origin affect card identity or click target?
- canonical-duplicate · Compare · HTML
How do consumers resolve conflicting canonical links?
- base-element · Compare · HTML
How does an HTML base element affect relative metadata URLs?
- tracking-query · Compare · HTML
Does a tracking query reuse the canonical preview?
- canonical-clean · Compare · HTML
Reference for the intentional tracking-query alias.
icons
- icon-none · Compare · HTML
Is an implicit origin-root favicon requested?
- icon-svg-only · Compare · HTML
Does SVG alone work in tabs and bookmarks?
- icon-ico-only · Compare · HTML
Does a real single-entry ICO work alone?
- ico-svg-no-sizes · Compare · HTML
ICO before SVG without sizes.
- svg-ico-no-sizes · Compare · HTML
SVG before ICO without sizes.
- ico32-svg · Compare · HTML
Accurate ICO sizes before SVG.
- svg-ico32 · Compare · HTML
Accurate ICO sizes after SVG.
- ico-any-svg · Compare · HTML
Negative conformance control: bitmap ICO advertised as scalable.
- ico-false-size · Compare · HTML
Negative conformance control: single 32px ICO advertised as 16px.
- ico-multiple · Compare · HTML
Real 16, 32 and 48px ICO entries with accurate sizes.
- png-named-ico · Compare · HTML
PNG bytes with an .ico name, as found in the scaffold.
- svg-responsive · Compare · HTML
Does an SVG favicon change with system light/dark preference?
- svg-missing-fallback · Compare · HTML
Does an unavailable preferred SVG fall back to ICO?
- png32-png64 · Compare · HTML
Which bitmap size is used at different display densities?
- svg-any · Compare · HTML
Does an accurate sizes=any on SVG change selection?
- svg-type-omitted · Compare · HTML
Does omitting the correct SVG type hint change selection?
- ico-type-explicit · Compare · HTML
Does adding the ICO type hint change selection?
- png-equal-red-green · Compare · HTML
Tie control: two accurately described 32px PNGs, red then green.
- png-equal-green-red · Compare · HTML
Tie control: the same equally suitable PNGs in reverse order.
- apple-touch-icon · Compare · HTML
Which image is used when explicitly adding this page to an Apple home screen?
head
- charset-first · Compare · HTML
Reference: charset is serialized first.
- charset-after-ascii-padding · Compare · HTML
Negative control: charset after the first 1024 bytes.
- charset-after-unicode-padding · Compare · HTML
Negative control: character count under 1024 but byte count over it.
- metadata-after-invalid-head-element · Compare · HTML
Does invalid head content move following metadata into body?
- metadata-in-noscript · Compare · HTML
How do scripting-enabled and scripting-disabled HTML parsers differ?
- viewport-absent · Compare · HTML
What layout viewport results on a mobile browser?
- viewport-with-initial-scale · Compare · HTML
Is initial-scale=1 observably different from width=device-width alone?
theming
- scheme-absent · Compare · HTML
Reference browser defaults without color-scheme.
- scheme-meta-only · Compare · HTML
Does the meta declaration suffice for browser-native colors?
- scheme-meta-and-css · Compare · HTML
Does repeating the declaration in CSS add useful behavior?
- scheme-hardcoded-light · Compare · HTML
Negative control: meta does not adapt hardcoded light CSS.
- scheme-system-colors · Compare · HTML
Do Canvas and CanvasText follow system preference?
- scheme-duplicate · Compare · HTML
Negative conformance control: duplicate color-scheme metadata.
- theme-color-media · Compare · HTML
Do browser selection and social-preview accent selection differ?
manifest
- manifest-disabled · Compare · HTML
No manifest link, despite static icon assets being available.
- manifest-enabled · Compare · HTML
Online-only manifest discovery and launch settings.
- manifest-relative · Compare · HTML
Does a path-relative manifest resolve incorrectly on nested pages?
- manifest-duplicate · Compare · HTML
Negative conformance control: multiple manifest links.
json-ld
- jsonld-unsafe · Compare · HTML
Negative control: literal script end tag terminates raw JSON-LD.
- jsonld-escaped · Compare · HTML
Does escaping less-than preserve JSON while preventing extra HTML?
language
- lang-en · Compare · HTML
Reference explicit document language.
- lang-fr-no-og-locale · Compare · HTML
French document without an extra og:locale declaration.
- lang-ar-rtl · Compare · HTML
Explicit Arabic document language and direction.
- lang-mixed-content · Compare · HTML
Does an explicit language on an untranslated passage remain in the DOM?
indexing
- noindex-with-preview · Compare · HTML
Search exclusion and social metadata are separate inputs.
- noindex-no-image · Compare · HTML
Noindex page without auto-generated image metadata.
- http-noindex · Compare · HTML
Can indexing protection be delivered as an HTTP header?
- error-404 · Compare · HTML
Real 404 response without canonical or social image identity.
- redirect · Compare · HTML
Real redirect rather than a 200 HTML page.