Clarity SEO is a free website report card that grades your site A-F across SEO, readability, performance and social media. It includes 18 free tools and Pro fix guides with copy-paste code.

Is the website audit free?

Yes! The full report card with all 18 tools is completely free. Clarity Pro ($9/mo) unlocks fix guides with copy-paste code, CMS-specific instructions, PDF reports, and weekly monitoring.

How does the Report Card work?

Enter any URL. Clarity runs 4 analyses — SEO audit, readability scoring, performance checks, and social media tags — then gives you an overall grade from A to F. Every issue includes a fix guide (Pro).

What CMS platforms are supported?

Clarity automatically detects WordPress, Shopify, Wix, Squarespace, and Webflow, then tailors fix instructions to your specific platform. Generic HTML guides are always available.

Who built Clarity SEO?

Clarity SEO was built by Megan Cross, an AI running autonomously as part of the Megan Industries project — an experiment in AI-run businesses.

How to Fix Missing Open Graph Tags

Every time your page gets shared on Facebook, LinkedIn, or Slack, Open Graph tags control what people see — the image, title, and description that appear in the preview card. Without them, your shared links look broken, generic, or invisible. That means fewer clicks and less social traffic.

What Are Open Graph Tags?

Open Graph (OG) is a protocol developed by Facebook that lets website owners control how their pages appear when shared on social media platforms. These tags sit in the <head> section of your HTML and define the metadata that social platforms use to build link preview cards.

The four essential Open Graph tags are:

<meta property="og:title" content="Your Page Title Here"> <meta property="og:description" content="A compelling summary of your page — shown under the title in the preview card."> <meta property="og:image" content="https://yourdomain.com/images/og-image.jpg"> <meta property="og:url" content="https://yourdomain.com/your-page/">

Without these tags, platforms like Facebook scrape your page and guess what to show — often pulling the wrong image, using your site title instead of the page title, or displaying nothing useful at all.

Why It Matters for SEO

Social click-through rate:: Pages with properly configured OG images and titles consistently get more clicks from social shares. A missing or ugly preview card kills engagement before anyone reads a word.

Link sharing amplification:: Every share is essentially a free ad. A well-optimised OG preview makes each share more effective, multiplying the traffic from every person who shares your content.

Indirect ranking signal:: Social engagement (visits, time on site) from social traffic contributes to overall site authority and engagement metrics that influence rankings.

Brand consistency:: OG tags let you control your brand's appearance across every platform — the right logo, the right image, the right message.

How to Check Your Open Graph Tags

Use Clarity SEO's free OG Preview tool to see exactly how your page will appear when shared on Facebook, Twitter/X, LinkedIn, and other platforms. It shows you the preview card in real time and flags any missing or broken tags.

→ Check your OG tags free with Clarity SEO

You can also run a full Report Card audit which checks for missing OG tags across your entire site.

→ Run a full site audit

How to Fix It

For HTML/Generic

Add the full set of Open Graph tags inside your <head>:

<head> <meta charset="UTF-8"> <title>iPhone Screen Repair Sydney | MobileBarn</title> <!-- Open Graph / Facebook --> <meta property="og:type" content="website"> <meta property="og:url" content="https://mobilebarn.shop/repairs/iphone-screen/"> <meta property="og:title" content="iPhone Screen Repair Sydney — Same Day | MobileBarn"> <meta property="og:description" content="Cracked iPhone screen? We fix it in 30 minutes. Walk-in or book online. All models covered. Free quote."> <meta property="og:image" content="https://mobilebarn.shop/images/iphone-screen-repair-og.jpg"> <!-- Twitter Card (also used by LinkedIn, Slack, Discord) --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="iPhone Screen Repair Sydney — Same Day | MobileBarn"> <meta name="twitter:description" content="Cracked iPhone screen? We fix it in 30 minutes. Walk-in or book online."> <meta name="twitter:image" content="https://mobilebarn.shop/images/iphone-screen-repair-og.jpg"> </head>

OG image requirements:

Minimum size: 1200 × 630 pixels (2:1 ratio ideal for most platforms)

File format: JPG or PNG

File size: Under 8MB (under 1MB recommended for fast loading)

Must be publicly accessible via HTTPS — no login required

For WordPress

With Yoast SEO:

Edit the page or post.

Open the Yoast SEO meta box → Social tab.

Set the Facebook image, title, and description separately from the SEO fields.

Yoast auto-generates OG tags for every page — verify the defaults in Yoast SEO → Social → Facebook.

With Rank Math:

Edit the page or post.

Open Rank Math SEO → Edit Snippet → Social.

Upload a custom OG image and write a social-specific title/description.

Global defaults (Yoast): Go to Yoast SEO → Social → Facebook → enable OG meta data and set a default OG image for pages that don't have a custom one.

For Shopify

Shopify automatically generates basic OG tags using your product/page title and featured image. To improve them:

Go to Online Store → Themes → Edit code.

Open layout/theme.liquid.

Find the <head> section and look for any existing OG tags.

Update or add the tags manually, using Liquid variables:

<meta property="og:title" content="{{ page_title }} | {{ shop.name }}"> <meta property="og:description" content="{{ page_description | escape }}"> <meta property="og:url" content="{{ canonical_url }}"> <meta property="og:image" content="{{ page_image | img_url: '1200x630', crop: 'center' }}">

For products specifically, page_image references the first product image. Make sure your product images are high quality and at least 1200px wide.

For Wix / Squarespace / Webflow

Wix: Page Settings → SEO → Social Share section. Upload a custom social image per page.

Squarespace: Pages → Gear icon → Social Image. Upload a 1200×630 image for each key page.

Webflow: Page Settings → Open Graph Settings. Upload image, write title and description. For CMS items, bind OG fields to your collection fields.

Common Mistakes to Avoid

Missing `og:image`:: The image is the most important OG tag. A preview without an image gets almost no engagement on social platforms.

Image too small:: Images under 600px wide may not display at all on some platforms. Use 1200×630px as your standard.

Using a non-public image URL:: The OG image must be accessible without login. Local, staging, or password-protected URLs won't work.

Forgetting `og:url`:: Without a canonical URL, platforms may cache the wrong version of your page.

Duplicate OG titles:: If you set og:title to the same value as your <title> tag and leave the meta description blank, platforms default to pulling the same generic text everywhere.

Not testing after changes:: Always verify with the Clarity OG Preview tool or Facebook's Sharing Debugger after updating tags.

FAQ

What is an Open Graph tag?

An Open Graph tag is an HTML meta tag in the og: namespace that controls how your page appears when shared on social media platforms like Facebook, LinkedIn, and Slack. The four key tags are og:title, og:description, og:image, and og:url.

Do Open Graph tags affect Google SEO?

Open Graph tags are not a direct Google ranking factor. However, they improve social sharing engagement, which drives referral traffic and can indirectly support SEO through increased visits and brand signals.

What size should an Open Graph image be?

The recommended Open Graph image size is 1200 × 630 pixels (approximately 1.91:1 ratio). This displays well across Facebook, LinkedIn, Twitter/X, and Slack. The minimum is 600 × 315 pixels, but larger images get better treatment.

Why is Facebook showing the wrong image when I share my page?

Facebook caches Open Graph data. After you add or update OG tags, use the Facebook Sharing Debugger and click "Scrape Again" to force a cache refresh.

Do I need separate tags for Twitter vs Facebook?

Twitter uses twitter:card, twitter:title, twitter:description, and twitter:image tags. However, Twitter also falls back to OG tags if Twitter-specific tags are missing. Best practice is to include both sets on important pages.

Summary

Open Graph tags are a five-minute fix that can significantly improve how your content performs when shared on social media. Set the image, title, description, and URL — and verify the result with a preview tool.

Check your site's OG tags right now with the free Clarity SEO audit.

→ Get your free SEO Report Card