Open Graph tags are <meta> tags in a page’s <head> that set the title, image and description a social network or messaging app shows when someone shares your link. Facebook created the protocol, and LinkedIn, Slack, WhatsApp and many other apps read it. Without the tags, each app guesses, and a guessed preview can have the wrong image or none at all.
What are Open Graph tags?
The Open Graph protocol, published at ogp.me, defines four required properties for any page:
| Property | What it holds |
|---|---|
og:title |
The title of the page within the graph |
og:type |
The kind of object, such as website or article |
og:image |
The URL of an image that represents the page |
og:url |
The canonical URL, which acts as the page’s permanent ID |
The protocol also lists optional properties: og:description (one or two sentences), og:site_name, og:locale, and image details og:image:width, og:image:height and og:image:alt. It says a page with an og:image should also give an og:image:alt.
Do Open Graph tags help SEO?
Not directly. Google does not use Open Graph tags as a ranking signal. The link is indirect: Google’s title link guide lists og:title among the sources it may use when it builds a title link, and shared links bring visits, mentions and sometimes links. That is why this is a Low impact method for rankings and a worthwhile one for click-through from social posts and chats.
Social likes and shares are not a direct ranking signal either (see social signals). Treat the preview as packaging for your content distribution.
How do you add Open Graph tags, step by step?
- Write the tags once, in your template. Fill them from the page’s own fields, so every new page gets a preview without extra work.
- Set the four required tags. Use the real page title, the right type, a full image URL and the canonical address.
- Add a description. One or two sentences, written for a person who sees it in a chat window. It can match your meta description.
- Make the image. Use a dedicated picture, not a screenshot of text that is too small to read. The size most guides recommend is 1200 by 630 pixels (about 1.91 to 1). That is a common convention, not part of the protocol, so confirm it in each platform’s preview. Keep the file light (see image file size) and keep important words away from the edges, which apps crop.
- Use absolute HTTPS URLs for
og:imageandog:url. Relative paths fail in many scrapers. - Add X card tags. X (formerly Twitter) reads
twitter:*tags and falls back to Open Graph for title, description and image. Settwitter:cardyourself:summary_large_imageshows a big picture. - Test every template type. Check a blog post, a product page and the home page in a preview tool.
- Refresh the cache. Platforms store previews. After you change a tag, scrape the URL again in the debugger of the platform.
A complete block looks like this:
<meta property="og:title" content="Standing Desk Sizes: How to Pick the Right Width">
<meta property="og:type" content="article">
<meta property="og:url" content="https://example.com/standing-desk-sizes/">
<meta property="og:image" content="https://example.com/img/standing-desk-sizes-1200x630.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Three standing desks of different widths side by side">
<meta property="og:description" content="A size chart and a quick way to measure your space before you buy.">
<meta property="og:site_name" content="Northbrook Desks">
<meta name="twitter:card" content="summary_large_image">How do you measure the result?
- Preview check: paste the URL into the LinkedIn Post Inspector, the Facebook Sharing Debugger and a draft post on X, and confirm image, title and description are right.
- Click-through from social: in your analytics, filter traffic by source (LinkedIn, Facebook, X, Slack) and compare clicks per share before and after a preview fix. Tag your shares with campaign parameters so the numbers are clean (see GA4 setup).
- Spot checks: share a link in a private chat and see what your friends see.
What mistakes should you avoid?
- No
og:image. Platforms then show a blank card or pick a random picture such as a logo or an ad. - One image for every page. Every share looks identical, which kills curiosity.
- A tiny or low-contrast image that crops badly.
- Stale cache. Fixing the tag and not re-scraping leaves the old preview live.
- A wrong
og:url. It should be the canonical address, so shares of tracking-tag variants count together (see canonical tags). - Putting the tags in the body or loading them with JavaScript that scrapers do not run. Most scrapers read the raw HTML.
- Expecting a ranking boost. The reward is the click, not a Google position.
Where can you learn more?
The free social media module of the Fe/male Switch startup school covers how to share a startup’s pages so people click. Next steps on SEO100: match the preview to your title tag, and set up your social profiles so the shares come from accounts people trust.