SiteAudit.dev
Tools

Metadata and previews · Practical guide

How to check page metadata and social previews

Page metadata describes a document to browsers, search engines and services that build link previews. A tag appearing in an audit only proves that the scanner found a value. Check the page-specific copy, the response containing it, the image resource and the platform’s own preview before calling a metadata change complete.

Give one guide a consistent set of metadata

Suppose you publish a cache-control guide, but sharing it displays the homepage title and logo. Give the page its own metadata in the HTML head. This example assumes the guide is its own preferred canonical page and that you will publish a corresponding share image. Replace every example address and description before deployment.

The canonical link and og:url identify the same preferred page; og:image identifies a separate image resource. Open Graph and Twitter Card tags provide compatibility metadata, while each platform controls the eventual layout. When generating values dynamically, escape text and attribute values correctly in your template.

<head>
  <meta charset="utf-8">
  <title>Cache-Control guide | Example Docs</title>
  <meta name="description" content="Choose Cache-Control directives for public assets and private pages, then verify the response headers.">
  <link rel="canonical" href="https://example.com/guides/cache-control">
  <meta property="og:type" content="article">
  <meta property="og:title" content="Cache-Control guide">
  <meta property="og:description" content="Practical cache settings for public assets and private pages.">
  <meta property="og:url" content="https://example.com/guides/cache-control">
  <meta property="og:image" content="https://example.com/images/cache-control-card.jpg">
  <meta property="og:image:alt" content="Diagram comparing browser caching for public and private responses">
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Cache-Control guide">
  <meta name="twitter:description" content="Practical cache settings for public assets and private pages.">
  <meta name="twitter:image" content="https://example.com/images/cache-control-card.jpg">
  <meta name="twitter:image:alt" content="Diagram comparing browser caching for public and private responses">
</head>
  1. Update the page template and remove conflicting tags inherited from the homepage layout.
  2. Fetch the final public HTML and confirm the page address, copy and image URL are correct.
  3. Test the image independently and inspect a fresh preview on the platform where you will share the link.

Reference: Open Graph protocol: Basic and structured metadata

Inspect the response before JavaScript runs

In browser developer tools, open the final document request and read its Response tab. Compare that HTML with the Elements panel, which can include changes made by JavaScript. Publish essential metadata in the initial HTML so consumers do not need to execute your application to discover it.

SiteAudit reads the captured final HTML without running scripts. It takes the first matching title, description, canonical, robots meta, language and viewport value. Its social fields are og:title, og:description, og:url, og:image, twitter:card, twitter:title, twitter:description and twitter:image.

It does not assess og:type, image alt text, every other platform tag or duplicate declarations. A social pass means at least one supported field was found, not that a complete preview is valid. An unknown SEO result means suitable complete HTML was unavailable; investigate that before treating fields as missing.

Reference: MDN: Web page metadata

Write for the specific page

Make the title distinguish this page from adjacent guides, products or categories. Describe its useful content directly and keep repeated branding short. Write a description that helps someone decide whether the page answers their question. Avoid filling either field with repeated keywords or promises absent from the content.

Google can generate a title link from several sources and choose a snippet from page content instead of the description. There is no universal character count that guarantees a particular display: truncation depends on the result and device. Check clarity and accuracy before chasing a character counter.

Compare another page from the same template to catch accidental reuse. Keep the canonical and og:url consistent with your intended preferred URL, and open that target to verify it serves the right content. SiteAudit resolves canonical references but does not fetch their targets or establish which canonical Google selected.

Reference: Google Search Central: Search snippets and meta descriptions

Check the image as a separate resource

Use an absolute public HTTPS image URL. Verify it without an authenticated session: a login redirect, expired signed URL or HTML error page will not provide the expected image. The GET below follows redirects and shows response headers while discarding the downloaded body. Replace the address with your deployed image.

Check the final status and Content-Type, then open the image itself to confirm its content, readability and crop. A successful request from your computer does not prove that a platform crawler can fetch it; investigate platform fetch errors and relevant CDN or firewall rules separately.

SiteAudit resolves supported image references but does not download the images, measure their dimensions or check whether their content matches the page. Add descriptive image alt metadata and verify it in the source even though those fields are outside this scan.

curl -q -sS -L --max-redirs 5 --max-time 30 \
  -D - -o /dev/null \
  'https://example.com/images/cache-control-card.jpg'

Reference: Open Graph protocol: Image properties

Separate deployment from cached previews

If the preview stays old, first fetch the public page again. Your application or CDN may still serve yesterday’s metadata. Correct that response before trying to refresh a social platform’s separate cache. If the HTML points to an old image address, fix the metadata itself.

Use the platform’s current preview or inspection tool. For LinkedIn, enter the page URL in Post Inspector and confirm the retrieved content. LinkedIn documents that refreshed information affects new posts; existing posts keep their previous preview. Do not use an old published post as the only verification.

Finally, review a new draft preview where you intend to share the link. Confirm its destination, readable text and image. Platform presentation can differ, so a scanner result or a generic mockup cannot guarantee the exact card someone will see.

Reference: LinkedIn Help: Refresh a URL with Post Inspector

Keep reading

Related guides

All guides & reference
Quick reference

Indexing signals reference: robots, noindex, canonicals and sitemaps

Compare crawl access, indexing controls, canonical signals and discovery evidence when reviewing a public page.

Open reference