What is Open Graph and Why Does It Matter?
Open Graph tags control how your pages look when shared on social media. Here is what the tags are, how to write them, and how to preview your social cards.
16 May 2026 · 5 min read
Open Graph is a protocol that controls how a webpage appears when shared on social media platforms. When someone pastes a URL into Facebook, LinkedIn, X (Twitter), Slack, or WhatsApp, the platform reads the Open Graph tags on that page to determine what image, title, and description to display in the preview card.
Without Open Graph tags, platforms guess: they pull whatever image or text they can find on the page, often producing broken or unattractive previews that reduce click-through rates on social shares.
How Open Graph works
Open Graph tags are <meta> elements placed in the <head> of a page:
<head>
<meta property="og:title" content="How to Fix Redirect Chains" />
<meta property="og:description" content="Redirect chains waste crawl budget and dilute link equity. Here is how to find and fix every chain on your site." />
<meta property="og:image" content="https://www.example.com/images/redirect-chains.jpg" />
<meta property="og:url" content="https://www.example.com/learn/how-to-fix-redirect-chains" />
<meta property="og:type" content="article" />
</head>
When a user shares the URL, the platform crawls the page, reads these tags, and constructs the preview card using the values you specified.
The essential Open Graph tags
og:title
The title displayed in the preview card. This does not have to match the HTML title tag. You can write a more social-friendly version: slightly longer, more conversational, focused on shareability rather than keyword optimisation.
Keep it under 60 to 70 characters to avoid truncation on most platforms.
og:description
The description displayed below the title in the preview. Facebook and LinkedIn show approximately 200 characters. Write for curiosity and click-through, not SEO.
og:image
The image displayed in the preview card. This is the most important Open Graph tag for driving clicks on social. A compelling, relevant image dramatically increases click-through rates compared to a text-only or placeholder preview.
Image requirements vary by platform, but the safest dimensions are 1200 x 630 pixels. Use a JPG or PNG. Minimum recommended size is 600 x 315 pixels; images smaller than this may not display at all on some platforms.
og:url
The canonical URL of the page. This should be the clean, canonical version of the URL, not a UTM-tagged or parameter-heavy variant.
og:type
The type of content. Common values: website (for homepages and landing pages), article (for blog posts and editorial content), product (for product pages).
Platform-specific extensions
Twitter / X Card tags
X uses its own meta tags alongside Open Graph. The most important:
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="How to Fix Redirect Chains" />
<meta name="twitter:description" content="Redirect chains waste crawl budget. Here is how to find and fix them." />
<meta name="twitter:image" content="https://www.example.com/images/redirect-chains.jpg" />
summary_large_image displays a large image above the title and description. summary shows a small thumbnail beside the text. Large image previews consistently generate more engagement.
If Twitter Card tags are not present, X falls back to Open Graph tags.
LinkedIn uses Open Graph tags natively. The og:image should be at least 1200 x 627 pixels for LinkedIn to display the large format preview.
Does Open Graph affect SEO?
Open Graph does not directly affect Google rankings. Google does not use Open Graph tags as ranking signals.
The indirect effects are meaningful:
- More social traffic: better preview cards generate more clicks from social shares, increasing traffic from channels outside organic search
- More backlinks: content that gets shared socially is more likely to be seen by people who will link to it
- Brand perception: consistent, professional-looking preview cards contribute to brand credibility
Common Open Graph mistakes
Missing og:image
The most common and impactful mistake. Without an og:image, most platforms display nothing or pull a random image from the page. A missing image preview dramatically reduces click-through rates on social.
Image too small or wrong dimensions
Images below 600 x 315 pixels may not display. Images that are the wrong aspect ratio appear cropped or distorted. Create dedicated social share images at 1200 x 630 pixels.
og:url pointing to the wrong URL
If og:url points to a different URL than the canonical page, engagement metrics (shares, likes, comments) may be split across URLs rather than consolidated.
Stale cached previews
Social platforms cache Open Graph data aggressively. After updating tags, you need to clear the cache for each platform:
- Facebook: use the Sharing Debugger at developers.facebook.com/tools/debug
- LinkedIn: use the Post Inspector at linkedin.com/post-inspector
- X: paste the URL into a new tweet and wait for the preview to refresh
How to check your Open Graph tags
Crawly's free Open Graph preview tool shows exactly how your page will appear when shared on social media. Paste any URL to see the preview card, the tag values being read, and any issues with image dimensions or missing tags.
Open Graph tags are a five-minute implementation with a measurable impact on social click-through rates. Check any page's social preview with Crawly's Open Graph tool.