Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Open Graph (OG) is a set of HTML metadata tags that tells social networks and other link-preview tools how to present a webpage when someone shares its URL. It can shape a shared link’s title, description, image, and destination—but adding OG tags is not a documented direct way to improve Google rankings. For Google Search, manage your search title, description, content, and structured data separately.

What Open Graph does—and what it does not do for SEO

The Open Graph protocol describes a webpage as an object that other services can represent in a social graph. In practice, its tags give a sharing platform or other preview consumer suggested information to display: usually a title, image, description, and URL. The tags live in the page’s HTML <head> and use the form <meta property="..." content="...">.

That makes Open Graph useful to SEO indirectly, not as a documented Google ranking switch. More informative, appealing previews can help people understand a shared link and decide whether to visit it. Google’s documented Search metadata controls are separate, and its guidance says Google systems process the meta tags they support and ignore unsupported tags. Open Graph title and description are not listed as Google Search indexing controls.

Google can use page-title and meta-description information when generating title links and snippets, but it generates those Search presentations automatically and may choose different text. Write and maintain those fields for Search independently of OG values. Google also documents og:image as one way to specify a preferred image for image previews; a relevant, representative, high-resolution image is preferable to a generic logo or an image with an extreme aspect ratio.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Which Open Graph tags should a page have?

The protocol defines four required properties for each page: og:title, og:type, og:image, and og:url. Other common properties give preview consumers more context.

Property What to put in it Practical note
og:title The page’s share-preview title. Make it specific to the page and consistent with what the visitor will find there.
og:type The kind of object, such as an article or website. Choose a value appropriate to the page; do not use a site-wide value if an individual page is a different kind of object.
og:image An absolute URL to the intended preview image. Use an image that represents the page, not merely the site in general.
og:url The page’s canonical, absolute URL. Use the preferred URL for that page, not a temporary or tracking URL.
og:description A concise description of the page for previews. Describe the linked page accurately; it is distinct from a guarantee of Google’s Search snippet text.
og:site_name The name of the publishing site. Useful context when the preview consumer displays it.
og:locale The page’s locale, commonly formatted like en_US. Set it to match the page’s language and locale when relevant.

The protocol also defines structured image properties: og:image:secure_url, og:image:type, og:image:width, og:image:height, and og:image:alt. Supply accurate dimensions and media type when available. The alt value describes the image; it is not a caption. Audio and video properties are also available when a page’s shared object includes those media types, but they are not necessary for an ordinary article preview.

Example: add Open Graph tags to a page

Place the tags in the server-rendered document head. Replace the example title, canonical URL, image URL, and site details with values specific to the page. The image should be publicly accessible to the services that fetch previews.

<head prefix="og: https://ogp.me/ns#">
  <title>Example article title | Example site</title>
  <meta name="description" content="A concise description for Google Search.">
  <link rel="canonical" href="https://example.com/example-article">

  <meta property="og:title" content="Example article title">
  <meta property="og:type" content="article">
  <meta property="og:url" content="https://example.com/example-article">
  <meta property="og:image" content="https://example.com/images/example-article.jpg">
  <meta property="og:description" content="A concise description for link previews.">
  <meta property="og:site_name" content="Example site">
  <meta property="og:locale" content="en_US">
  <meta property="og:image:alt" content="Description of the preview image">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
</head>

The dimensions in this illustration describe the example image only; they are not a universal platform requirement. The available evidence does not establish one image-size limit that applies across preview consumers. Use an image that is clear and representative, and check the result with the services where the link will be shared.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Keep share metadata and Search metadata aligned, not necessarily identical

A page can have a Search-oriented <title> and meta description as well as OG title and description. They may be the same when that best represents the page in both contexts. If you write different versions, neither should misrepresent the page or promise content it does not contain. og:url should correspond to the canonical page URL so that preview consumers are not directed to a duplicate or temporary address.

Multiple values and image order

The protocol permits multiple instances of a property when it can have multiple values. For example, a page can declare more than one og:image. Since preview consumers may parse later values differently, put the intended default image first and verify the actual result in the target service’s preview tool.

How to implement OG tags in a CMS or framework

For a hand-built site, add the tags to the HTML template that renders each page’s head. For a content-managed site, use its SEO or social-sharing fields if they produce the required tags in the final HTML. The key is not the editor screen: it is the markup that a crawler receives for the particular URL.

For example, Yoast documents separate SEO-title and Facebook-title fields and controls for Open Graph descriptions. A plugin can make per-page editing easier, but verify the output rather than assuming a setting is active. In any implementation, check that the canonical URL, OG URL, title, description, and image resolve to the intended page and are not accidentally reused across every page.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Validate a preview and diagnose a wrong one

Preview crawlers do not always see the same content as a person using a browser. Review the response they can fetch, then ask the target platform or a preview tool to re-fetch the page. The Open Graph project references a Facebook parser/debugger, and OpenGraph.dev describes preview generation. A screenshot can help inspect how a rendered page looks, but it does not replace checking the raw OG tags or the platform’s own parsed preview.

  1. Inspect the server-rendered source. Open the page’s HTML source and locate the OG tags. Confirm they are inside <head> and present in the response before relying on browser-only changes.
  2. Check values and reachability. Confirm the title, description, and image belong to that page; use absolute URLs; and verify the page and image are publicly reachable. Use HTTPS where available.
  3. Check canonical and redirects. Compare og:url with the canonical URL and follow the page’s redirect destination. A redirect to a different canonical page can lead the preview consumer to show metadata for another URL.
  4. Inspect the image properties. Confirm the image URL loads without access restrictions. Add accurate alt text, dimensions, and type when available.
  5. Re-fetch in the target preview tool. Use the relevant platform debugger or an Open Graph preview tool to see what that consumer parses. If the metadata was corrected but the old preview remains, use the platform’s re-scrape or debugger workflow where available.

There is no single cache duration established for every platform. A successful re-fetch in one tool does not prove that another service has refreshed its cached preview.

Common symptoms, likely causes, and fixes

Symptom Likely cause What to do
The preview uses an old or unrelated title or description. Tags are absent, duplicated, malformed, or attached to a different URL; the platform may also have a stale preview. Inspect the response source, correct the tags for the exact shared URL, then re-fetch using the platform’s available debugger workflow.
The expected image is missing. The image URL is inaccessible to the crawler, points somewhere else, or is not the first declared image. Test the absolute image URL without a logged-in session, correct the URL, and put the intended default first.
The browser shows the right tags, but a preview tool does not. The tags may be added only after client-side JavaScript runs, while the preview crawler reads the original HTML response. Render OG metadata server-side or otherwise ensure it is present in the HTML response delivered to the crawler.
A shared URL previews as a different page. A redirect or canonical mismatch can send the crawler to another URL whose metadata differs. Follow redirects, verify the canonical destination, and make the OG URL reflect the intended canonical page.
The markup looks correct but parses inconsistently. Malformed HTML in the head, duplicate values, or differences in how consumers handle multiple values can affect parsing. Keep the head valid, remove unintended duplicate tags, and test with the target platform’s own parser.

Do not assume a fixed image limit or cache expiration from another platform’s behavior: the specifications summarized here do not establish universal values for either.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Or skip the browser setup

If the remaining task is to inspect how the page itself renders, a screenshot can provide a visual check. ScreenshotNeo is a website screenshot API and MCP server; it captures a rendered page, but it is not an OG-tag validator and cannot tell you which metadata a social crawler parsed. The cURL request below saves a screenshot of the example page. For API parameters and response details, see the ScreenshotNeo documentation.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com/example-article -o shot.webp

ScreenshotNeo accepts cookie or consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; each of those steps can be turned off. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and responses identify the page verdict and billing status in headers. An MCP server provides take_screenshot, get_page_info, and capture_pdf tools for AI agents. The Free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000. Every feature is available on every plan.

Sign up for 1,000 free screenshots a month—no card required.

Separate the preview job from the Search job

Use Open Graph to describe the page to services that build shared-link previews, and use Search-specific title, description, content, and structured data practices for Google Search. After publishing, validate the actual head markup and the preview parsed by the service where the URL will be shared. If the preview is wrong, debug the page response, URL, image access, and that platform’s cache rather than expecting the tags to change Google rankings.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.