SEO and Open Graph: what the og tags do, the full set to ship, and how to fix a wrong preview

Open Graph is a set of meta tags in the head of a page that tell other sites what to show when somebody shares your URL. It does not move your position in Google results. It decides the title, the description and the image on the preview card in social feeds, messaging apps, Slack, iMessage and most chat tools, and that card decides whether the link gets opened at all. So Open Graph is click work sitting on top of your search work, and five tags on every page cover almost all of it: og:title, og:description, og:url, og:image and og:type.

The protocol was introduced by Facebook in 2010 and the specification is published at ogp.me, which lists the four required properties and the optional ones. Every other platform that reads these tags reads that same vocabulary, which is why one correct set covers all of them.

This page covers Open Graph and the link preview. For every other tag in the head of a page, see the full HTML meta tag reference, and for the description that Google shows, see writing meta descriptions.

What Open Graph does, and what it leaves alone

Question	Answer
Does Open Graph affect ranking?	No. Google ranks on the page content and the signals around it. The og tags are not inputs to that.
Does it affect traffic?	Yes, through shares. A link with a clear title and a readable image gets opened more often than a bare URL, and every one of those opens is a visit.
Does Google read og:title or og:description?	Google uses the title element and the page content for the result it shows. Where a page has no description tag, Google writes a snippet from the body.
Who definitely reads them?	Facebook, LinkedIn, X, WhatsApp, Slack, Discord, Telegram, Pinterest, Reddit and most link preview services.
What happens with no og tags?	The platform guesses: usually the title element, the first readable text it finds, and whichever image on the page it picks. The guess is often wrong and it is always out of your hands.

The block to ship on every page

Absolute URLs with the protocol, one tag per property, and values that match what the page actually says.

<meta property="og:type" content="article">
<meta property="og:title" content="SEO and Open Graph: the tags that control your link preview">
<meta property="og:description" content="What the og tags do, the five every page needs, and how to fix a preview showing the wrong image.">
<meta property="og:url" content="https://example.com/seo-open-graph">
<meta property="og:image" content="https://example.com/img/open-graph-1200x630.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="A browser window showing a link preview card">
<meta property="og:site_name" content="Example">
<meta property="og:locale" content="en_GB">
<meta name="twitter:card" content="summary_large_image">

Four of those do the heavy lifting and the rest are polish:

• og:title. Write it for a feed, not for a results page. Around sixty characters stays whole in most cards. It can differ from your title element, and on a commercial page it usually should.
• og:description. One sentence that gives a reason to tap. Around 110 characters survives truncation on a phone.
• og:url. The canonical address of the page, absolute, with no tracking parameters. This is the URL platforms use as the identity of the content, so shares of three tracked variants all count toward one page.
• og:image. 1200 by 630 pixels, absolute URL, publicly reachable with no login or hotlink protection in front of it. Keep the file small so the card renders instantly, and put any text in the image at a size that survives a thumbnail.

og:type and the properties that come with it

The type tells the platform what kind of thing the page is, and each type accepts its own extra properties. Set the type first and only add the extras that are true.

og:type	Use it on	Properties worth adding
website	Home page, landing pages, category pages	og:site_name
article	Blog posts, news, guides	article:published_time, article:modified_time, article:author, article:section, article:tag
product	Product pages	og:price:amount and og:price:currency in ISO codes such as GBP or USD, plus product availability
video.other	Pages whose point is a video	og:video, og:video:width, og:video:height, og:video:type
profile	Author and team pages	profile:first_name, profile:last_name, profile:username

One type per page. Two conflicting type tags from a theme and a plugin is the most common cause of a card that renders in the wrong shape.

X cards, and why you rarely need a full second set

X reads its own twitter: tags and falls back to the Open Graph values for anything it does not find. So the practical minimum is a single twitter:card tag set to summary_large_image for pages with a wide image, or summary for pages with a square one. Add twitter:site and twitter:creator if you want the account credited. X publishes the current card reference in its own developer documentation, and that is the place to check before adding anything beyond those.

A preview showing the wrong thing: the order to check

Work down this list and stop at the first thing that is wrong. In most cases it is the cache or the rendering.

Check	What you are looking for	Fix
1. View the rendered source	Exactly one of each og property, with the values you expect	Remove the duplicate. Audit the rendered page, not the settings screen
2. Server rendered or injected by script	og tags present in the raw HTML response	Move them into the server rendered head. Most preview crawlers do not run JavaScript
3. The image URL on its own	Opens in a private window, returns an image, no redirect chain	Serve it from a public path with no authentication and no hotlink rule
4. The platform cache	The platform stored an older version when the link was first shared	Re-scrape the URL in that platform's own sharing debugger, which forces a refresh
5. og:url against the canonical	The two match, character for character	Make og:url the canonical URL. A mismatch sends shares to a different identity
6. Redirects	The shared URL resolves in one hop	Share the final URL. Each hop is a chance for the crawler to stop early
7. Relative paths	og:image and og:url both start with https	Use absolute URLs. Relative values are the second most common fault in this list

A ten minute check on any template

• Open the rendered source of one page of each type: home, category, product, article, author.
• Confirm one og:title, one og:description, one og:url, one og:image and one og:type on each.
• Confirm every page composes its own values from real fields rather than inheriting one site wide image.
• Paste each URL into a messaging app and look at the card on a phone screen.
• Check the image at thumbnail size. If the text in it is unreadable, the image is doing nothing.
• Build one default image for pages that have no natural one, so a share is never an empty grey box.

Questions buyers ask about SEO and Open Graph

Is Open Graph a ranking factor?

No. It controls the preview card on other platforms. Treat it as part of the click through work alongside your title and description, which is where it earns its keep.

What image size should I use for og:image?

1200 by 630 pixels covers every large card format and scales down cleanly to the small ones. Use an absolute URL, keep the file light, and declare the width and height so the platform can lay the card out before the file finishes loading.

Do I need Twitter card tags as well as Open Graph?

One twitter:card tag is enough for most sites. X falls back to your Open Graph values for the title, description and image, so a second full set is duplicated maintenance.

Why does my updated title still show the old preview?

The platform cached the card when the URL was first shared. Re-scrape the URL in that platform's own sharing debugger and the card refreshes.

Can I use different Open Graph values from my page title?

Yes, and on commercial pages it is the better choice. A title element is written for a search result and a question. An og:title is written for somebody scrolling a feed. Both can be true at once.

Does WhatsApp read Open Graph?

Yes. WhatsApp, Slack, Discord, Telegram, LinkedIn and iMessage all read the same og vocabulary, which is why one correct set covers the lot.

The preview you have not checked yet

Open Graph exists because platforms stopped trusting themselves to guess what a page was about and asked publishers to declare it. The same guessing now happens somewhere new. When a buyer asks ChatGPT, Gemini, Perplexity or Claude for a shortlist in your category, the assistant assembles a short description of your business from whatever it can read, and then hands that description to the buyer as a recommendation or leaves you out of the list. Nobody has a settings screen for that card.

It is worth knowing what it currently says. Ask two or three assistants the question your buyers would ask, with no brand name in the prompt, and read the answer you get. AI Knows Us runs that check across the main assistants, works out which sources the answer was built from, and shows what to change. A free scan takes no account: aiknowsus.com.