Social SEO

OG Image Validator

Check og:image URL format, dimensions, aspect ratio, and file type so your social cards render correctly on Facebook, LinkedIn, Slack, and every other platform.

Content marketers, social media managers, and front-end developers rely on og:image to control how links appear when shared. A missing or misconfigured og:image means platforms scrape an arbitrary image — often a logo or sidebar ad — which hurts click-through rates and brand perception. When to use it: Before publishing a blog post, after redesigning social cards, when debugging why Facebook shows no image, or during a pre-launch checklist. What it solves: Verifies the URL is absolute and HTTPS, flags spaces and unsupported formats, checks dimensions against the 1200×630 minimum, and warns about aspect ratio drift from the recommended 1.91:1. Why it matters: Social platforms cache og:image aggressively. Catching a broken tag before sharing saves you from a stale or missing card that you cannot fix without re-scraping.

og:image URL

Width (px)

Height (px)

Image Type

How OG Image Validation Works

The validator takes the og:image URL and optional dimensions and runs a series of checks against the requirements that social platforms enforce. Each check maps to a real failure mode that causes platforms to drop or misrender the image.

URL checks confirm the value is an absolute URL with a protocol, uses HTTPS to avoid mixed-content issues, and contains no unencoded spaces that would break the fetch. Protocol-relative URLs are flagged because some scrapers mishandle them.

Dimension checks compare width and height against the 1200×630 minimum and compute the aspect ratio. A ratio far from 1.91:1 means platforms will crop the image, potentially cutting off text or key elements.

Format checks inspect both the og:image:type attribute and the file extension in the URL. Unsupported formats like BMP or SVG are flagged because most platforms will silently ignore them.

Before / After Examples

Example 1: Relative URL Fixed

❌ Before (Relative path)

<meta property="og:image" content="/images/og.jpg" />

<!-- Platform cannot resolve the URL -->

✅ After (Absolute URL)

<meta property="og:image"
      content="https://example.com/images/og.jpg" />

<!-- Fully qualified, fetchable -->

Example 2: Undersized Image

❌ Before (Too small)

Image: 600 × 315 px

<!-- Scaled up, blurry, cropped -->

✅ After (Recommended size)

Image: 1200 × 630 px  (1.91:1 ratio)

<!-- Clean render on all platforms -->

Example 3: Unsupported Format

❌ Before (BMP format)

og:image: https://example.com/cover.bmp

<!-- Platforms ignore BMP entirely -->

✅ After (JPEG format)

og:image: https://example.com/cover.jpg

<!-- Widely supported, small file size -->

Use Cases

Developer	Production	Workflow
Validate og:image in a component library	Fix missing images on shared blog posts	Pre-publish checklist for content team
Debug why LinkedIn shows no preview card	Standardize social card dimensions site-wide	Audit all post templates for og:image compliance
Test CMS-generated og:image tags	Verify images after a CDN migration	Weekly social sharing QA on top pages
Check og:image in a static site build	Verify HTTPS on all shared images	Client handoff with documented social image spec

Common Mistakes & Troubleshooting

Using a relative URL

Social platform crawlers fetch og:image without the context of your page URL. A relative path like /images/og.jpg cannot be resolved and the image is silently dropped.

❌ content="/images/og.jpg"
✅ content="https://example.com/images/og.jpg"

Image smaller than 1200×630

Undersized images get scaled up and appear blurry, or get cropped unpredictably. Platforms may also reject images below a minimum pixel threshold.

❌ 600 × 315  (too small, blurry when scaled)
✅ 1200 × 630  (recommended minimum)

Spaces in the URL

Unencoded spaces break the URL parse in many crawlers. Always percent-encode spaces as %20 or, better, use hyphens in filenames.

❌ content="https://example.com/my image.jpg"
✅ content="https://example.com/my-image.jpg"

Image behind authentication

If your og:image URL returns a 403 or redirect to a login page for non-browser user agents, platforms cannot fetch it. Host social images on a publicly accessible path.

❌ https://example.com/private/og.jpg  (403 for crawlers)
✅ https://example.com/public/og.jpg   (200 for all)

Forgetting to clear the platform cache

Facebook and LinkedIn cache og:image for a long time. After fixing the tag, use the Facebook Sharing Debugger or LinkedIn Post Inspector to force a re-scrape, or your changes will not appear.

❌ Fix tag, share link, expect immediate update
✅ Fix tag, run debugger scrape, then share

Best Practices

✓

Use 1200×630 as your standard size

This size and 1.91:1 ratio render cleanly on every major platform. Create one template and reuse it across all pages.

✓

Host images on your own domain

Third-party hosts can be slow, rate-limited, or go offline. Same-domain images are more reliable and easier to cache with your CDN.

✓

Prefer JPEG for photos, PNG for text

JPEG gives the best compression for photographs. PNG preserves sharpness for images with text overlays or transparency.

✓

Always use HTTPS URLs

HTTP images trigger mixed-content warnings and some scrapers refuse them. HTTPS is universally expected.

✓

Add og:image:alt for accessibility

A descriptive alt text improves accessibility and serves as a fallback when the image fails to load on a platform.

✓

Keep text in the safe zone

Platforms crop images differently. Keep important text in the center 80% of the image to avoid it being cut off.

✓

Validate before every major publish

Run this validator as part of your pre-publish checklist. It takes seconds and prevents a broken social card on a high-stakes post.

✓

Re-scrape after changing the image

Use Facebook Sharing Debugger and LinkedIn Post Inspector to force a fresh fetch after updating any og:image.

Frequently Asked Questions

What is og:image and why does it matter? +

og:image is an Open Graph meta tag that tells social platforms which image to show when someone shares your page. Without it, platforms fall back to scraping an arbitrary image from the page, which is often a logo, a sidebar ad, or nothing at all. A properly sized og:image dramatically improves click-through rates on shared links because visual cards attract attention in feeds and messaging apps. It is one of the highest-impact meta tags you can set for content distribution.

What size should an og:image be? +

The recommended minimum is 1200×630 pixels, which has a 1.91:1 aspect ratio. Facebook and LinkedIn display this cleanly across desktop and mobile. Images smaller than this get scaled up or cropped unpredictably. If you go larger, keep the same aspect ratio so platforms can crop from the center without cutting off text or key visual elements. Avoid extremely tall or square images unless you are targeting a platform that supports them specifically.

Which image formats work for og:image? +

JPEG, PNG, WebP, and GIF are the widely supported formats. JPEG is the best default for photographs because of its small file size. PNG works well for images with text or transparency. WebP is increasingly supported and offers the best compression, but some older scrapers may not handle it. Avoid BMP, TIFF, SVG, and ICO formats — most social platforms will ignore them entirely and your card will render without an image.

Why is my og:image not showing on Facebook or LinkedIn? +

The most common causes are: a relative URL instead of an absolute one, an image that is too small, the wrong file format, or caching. Facebook and LinkedIn cache og:image aggressively, so after fixing the tag you need to use their sharing debuggers to force a re-scrape. Also check that the URL actually loads without authentication — if your image is behind a login wall or returns a 403 to non-browser user agents, platforms cannot fetch it.

Does og:image need to be on the same domain as the page? +

It does not strictly need to be on the same domain, but hosting it there is strongly recommended. Third-party image hosts can be slow, rate-limited, or go offline, which breaks your social cards without warning. Same-domain images also avoid mixed-content warnings and are easier to cache with your existing CDN. If you must use a CDN, make sure it allows social media crawler user agents.

What is og:image:alt and should I add it? +

og:image:alt provides a text description of the image for screen readers and for cases where the image fails to load. It is optional but recommended for accessibility. Write a short, descriptive sentence that conveys the image content — do not just repeat your page title. Platforms like Facebook use the alt text when the image is unavailable, so a good alt text is a fallback for your social card.

How does this og:image validator work? +

You paste your og:image URL and optionally provide dimensions and file type. The tool checks that the URL is absolute, uses HTTPS, has no spaces, uses a supported file format, and meets the 1200×630 minimum with the correct aspect ratio. It flags issues that would cause platforms to ignore the image and warnings for suboptimal settings, so you can fix problems before sharing your page.