The launch-readiness audit

Open Graph tags: how your link looks when shared

When someone shares your link, the Open Graph card is the first impression. A bare URL gets scrolled past. Learn which og: tags Actuant checks and how to add a share card.

Last updated 2026-07-19

This weight-6 check looks for Open Graph tags — the metadata that turns a shared link into a rich card with a title, description, and image instead of a bare URL.

What Actuant checks

  • og:image present.
  • og:title present.
  • Both → pass. One → partial ("links share half-broken"). Neither → fail ("shared links look like bare URLs").

Two more checks in the same category grade the finish: Open Graph completeness (weight 3) looks for the full set including og:description, og:url, and og:type, and Twitter card (weight 2) looks for twitter:card.

Why it matters

Launch traffic comes from links — in tweets, DMs, Slack, Discord, Product Hunt. The OG card is your first impression in every one of those feeds. A missing image is the difference between a link people click and a grey rectangle they scroll past.

How to fix it

  1. 1

    Add og:title and og:description

    Usually the same as your page title and meta description.

  2. 2

    Add a 1200×630 og:image

    One good screenshot with your tagline beats a designed banner. Next.js can generate one dynamically with the OG image API.

  3. 3

    Test it

    Paste your URL into a social debugger, or just DM it to yourself.

add to <head>html
<meta property="og:title" content="Weekly meal plans from your pantry" />
<meta property="og:description" content="Tell it what's in your fridge; get a 7-day plan." />
<meta property="og:image" content="https://yourapp.com/og.png" />
<meta name="twitter:card" content="summary_large_image" />