Open Graph & Social Share Preview

See how an image, headline and description work together when someone shares your link.

HeadlineDescriptionPage URLImage URL

Large-card preview

1200 × 630 image

example.com

A clear social headline for your page

Explain what someone will find after opening the link, using one concrete and useful sentence.

<meta property="og:title" content="A clear social headline for your page">
<meta property="og:description" content="Explain what someone will find after opening the link, using one concrete and useful sentence.">
<meta property="og:url" content="https://example.com/article">
<meta property="og:image" content="">
<meta name="twitter:card" content="summary_large_image">

A shared link has to make sense on its own

The reader may see your link without the surrounding article, menu or brand story. Give the image, headline and description separate roles instead of repeating the same sentence three times.

Image: Show the subject. Keep essential text and faces away from the edges; the large-card mockup is not a guarantee of every platform's crop.
Headline: Name the story, product or offer. “View our latest update” gives a reader less context than the update itself.
Description: Add the detail the headline leaves out: what changed, who it is for or what the page explains.
Page URL: Use the public address you want shared. This becomes og:url; it is not a replacement for the page's canonical link tag.

Why is the image missing?

Check that the image URL opens without a login and points to an image, not a page containing it. The preview loads that image from its host, so use a public asset you intend to share.

Why does an old card still appear?

A sharing service may have cached the previous metadata. Publish the tags first, then recheck the live URL with that service's debugger or refresh tool.

The generated tags follow the Open Graph fields shown above and request a large Twitter-style card. Platforms decide their final presentation.