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

Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.

Use 1200 × 630 pixels (about 1.91:1) as a practical shared canvas, then export the smallest file that still looks sharp and meets each destination’s rules. It is not a universal Open Graph requirement. LinkedIn’s sharing specification, for example, requires at least 1200 × 627 pixels, recommends a 1.91:1 ratio, accepts JPG, PNG or GIF, and caps the image at 5 MB.

The Open Graph Protocol only defines og:image as an image URL representing the object. Pixel dimensions and byte limits are imposed by the services that fetch and display the preview, so optimization is a compatibility exercise as much as a compression exercise.

Two different limits are involved

Developers often search for “the Open Graph image limit” as if one number governed every network. There are two layers:

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
  • Protocol layer: Open Graph defines the og:image property as “An image URL which should represent your object within the graph.” The protocol documentation does not establish one universal width, height, file-size ceiling or format policy.
  • Platform layer: LinkedIn, Facebook, X, WhatsApp and other services fetch that URL and apply their own dimension, ratio, format and byte rules. Those rules can change independently of the protocol.

Therefore, 1200 × 630 is a useful broad-compatibility starting point, not a guarantee that every crawler will accept every file.

#1 Best Overall
Sale
HTML and CSS: Design and Build Websites
  • HTML CSS Design and Build Web Sites
  • Comes with secure packaging
  • It can be a gift option

Recommended dimensions and safe composition

Start with a 1200 × 630 canvas

A current cross-platform design guide (last updated July 2026) recommends 1200 × 630 pixels, approximately 1.91:1. LinkedIn’s documented minimum is 1200 × 627 at the same approximate ratio; the three-pixel height difference is a reminder that “1.91:1” is a target, not an exact universal crop.

Keep critical content away from the edges

Social previews may crop or resize the source differently. Place the headline, logo and essential subject inside a generous inner margin rather than touching the 1200-by-630 boundary. Design for legibility when the image is reduced to a small card, not only when viewed at full resolution.

Use one master and create exceptions only when needed

For a site sharing to several destinations, maintain the 1200 × 630 master and make a platform-specific derivative only when a documented requirement demands it. Do not distort the master to satisfy an unverified number from a secondary chart.

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

Platform requirements you can state confidently

Destination or source Dimensions and ratio Maximum size Formats Evidence and qualification
LinkedIn sharing module Minimum 1200 × 627; recommended 1.91:1 5 MB JPG, PNG or GIF LinkedIn Help, accessed 2026; these are sharing-module requirements, not necessarily its separate image-ad specifications.
General cross-platform starting point 1200 × 630; approximately 1.91:1 Varies by service Verify per destination OG Image Design guide, last updated July 2026; secondary guidance, not a protocol rule.
Open Graph Protocol No universal pixel requirement stated No universal byte cap stated Property is an image URL Protocol metadata model; consumer services decide what they accept.
X Not stated here Not stated here Not stated here A current first-party X specification was not verified; do not present secondary-guide figures as authoritative.

Use the first-party help page for the service that matters to your audience before you freeze an export preset. A number copied from a general comparison can become stale or refer to advertising rather than organic sharing.

Choose the file format from the artwork

Photographs and gradients

Lossy JPEG, WebP or AVIF can reduce photographic images substantially while preserving a convincing preview. Export several quality levels, inspect them at the size users will see, and keep the smallest version without obvious banding, ringing or block artifacts.

Text, logos and hard edges

Sharp typography, flat color and line art expose compression defects quickly. Compare a suitable lossless export with a carefully tuned lossy version. A larger PNG can be the correct choice when a compressed alternative damages small type or a logo.

AVIF and compatibility

AVIF can be much smaller than JPEG, PNG, GIF or WebP at comparable visual quality, according to web.dev’s AVIF guidance. That does not make it a safe universal default: the crawler must understand AVIF before it can render the preview. If support is uncertain, publish a broadly supported fallback or maintain a platform-specific asset.

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

Do not optimize by file extension alone

Check the actual response Content-Type, dimensions and byte count. A file named .jpg but served with the wrong media type can fail a strict fetcher, while a correctly encoded image with an unexpectedly large byte count can exceed a platform cap.

Implement the metadata

Put the canonical page URL and image URL in the document head. The image URL should be publicly fetchable and stable for the time you expect previews to circulate.

<meta property='og:type' content='article'>
<meta property='og:url' content='https://example.com/guides/og-images'>
<meta property='og:title' content='Open Graph image optimization'>
<meta property='og:description' content='A practical guide to dimensions, formats and file-size limits.'>
<meta property='og:image' content='https://cdn.example.com/og/og-images-1200x630.webp'>
<meta property='og:image:alt' content='Diagram showing a 1200 by 630 social preview canvas'>

Use an absolute HTTPS image URL rather than a relative path. Keep the asset available without an interactive login, and make sure your deployment does not block the fetching user agent. If you replace an image at the same URL, a platform may continue showing a cached copy; using a versioned filename when you intentionally change artwork makes the change easier to propagate.

A repeatable optimization workflow

  1. Define the audience. List the services where the page will be shared and record each service’s current official minimum dimensions, ratio, maximum bytes and accepted formats.
  2. Compose at 1200 × 630. Use the broad default unless a verified destination requirement calls for another canvas. Keep text and logos inside an edge-safe area.
  3. Export candidates. For photos, compare JPEG, WebP and AVIF. For typography-heavy or flat artwork, include a lossless candidate. Preserve the original source so you can revise quality without repeated re-encoding.
  4. Measure the actual files. Record pixel dimensions, encoded byte size, media type and visual quality. The relevant target is the smallest file that remains readable at preview size and stays below every verified ceiling.
  5. Inspect at realistic scale. View the image as a small card and on a high-density display. Look specifically for text halos, posterization in gradients, muddy shadows and thin lines disappearing.
  6. Publish a compatible fallback. If a destination’s AVIF or WebP support is uncertain, serve a format that its documentation accepts, or route that platform to a separate asset.
  7. Test the complete page. Confirm that the HTML contains the intended og:image, that the image URL returns the expected bytes, and that the production response is not an old cached version.

Validate before you announce the page

Check the document

  • View the deployed page source and verify exactly one intended og:image URL is present for the page.
  • Confirm the URL is absolute, uses HTTPS, and does not require cookies, a JavaScript challenge or a session.
  • Check that the title, description and image belong to the same page; mismatched metadata can look like an image failure.

Check the image response

  • Fetch the image URL directly and record the HTTP status, Content-Type, dimensions and byte count.
  • Open the downloaded bytes with an image decoder. This catches a truncated response or an HTML error page saved with an image extension.
  • Compare the production file with the locally inspected file; CDNs can apply transformations or return a different variant.

Check the preview

Use the destination’s current sharing debugger or preview tool where available, then re-fetch after correcting metadata. A successful browser load is not proof that a social crawler can retrieve the same resource.

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

Common failures and fixes

Symptom Likely cause Fix
No image appears Missing or malformed og:image, relative URL, blocked fetch, or non-image response Inspect production source and fetch the absolute URL directly. Return the real image bytes with the correct media type and allow the platform’s crawler to reach it.
Image is rejected for size Encoded file exceeds the destination’s byte cap Re-export at a lower quality, resize only if the platform allows it, or choose a more efficient format. Recheck visual quality after every change.
Preview is cropped badly Important content sits on the edge or the destination uses a different crop Move critical elements inward and provide a derivative for the documented aspect ratio instead of stretching the master.
Text looks fuzzy Over-compressed JPEG/WebP, too-small source type or repeated re-encoding Start from the original, raise quality, increase type size in the composition, or compare a lossless export.
AVIF preview is blank The fetching service cannot decode AVIF Publish a broadly supported fallback or a platform-specific image; do not assume a smaller file is automatically more compatible.
Old artwork persists Preview or CDN cache still holds the previous response Use the platform’s refresh/debug function, verify cache headers and publish a versioned filename when replacing artwork deliberately.
LinkedIn rejects a valid-looking image It is below 1200 × 627, above 5 MB, or outside the documented JPG/PNG/GIF set Meet LinkedIn’s sharing-module requirements exactly, then request a fresh preview.

Performance, reliability and cost trade-offs

Every byte is downloaded by a crawler and potentially by users opening a preview. Smaller files reduce transfer work, but an aggressive quality setting can make a headline unreadable and force you to redesign the asset. Optimize the encoded image, not the HTML tag: changing metadata text does not reduce the image payload.

Rank #4
Sale
Web Design with HTML, CSS, JavaScript and jQuery Set
  • Brand: Wiley
  • Set of 2 Volumes
  • A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers

Keep the image host reliable and avoid expiring signed URLs unless you know the crawler can fetch them during the URL’s lifetime. If a CDN creates multiple variants, log which variant is returned so a platform-specific failure is reproducible. Re-run checks after changing image pipelines, CDN rules or access controls.

There is no single quality number that works for every illustration. Treat compression as an iterative comparison: export, inspect at preview size, measure bytes, and stop when the visual result and every verified platform limit are satisfied.

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

Or skip the browser setup

After publishing the metadata, you can use ScreenshotNeo to capture the rendered page for a quick visual check. It is a website screenshot API and MCP server: one request returns a PNG, JPEG, WebP or PDF, and options include full-page capture with lazy images loaded, a CSS-selector element capture, device presets or custom viewports, retina scale, waits for a selector, delay or network idle, custom CSS and JavaScript, hidden selectors, and blocking selected requests or resource types.

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

Use the API documentation at https://screenshotneo.com/docs/ for authentication and options. The following calls capture the page after deployment; replace the example URL with your article URL.

curl -G 'https://api.screenshotneo.com/v1/shot' -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com/guides/og-images -o og-preview.webp
import requests
r = requests.get('https://api.screenshotneo.com/v1/shot', params={'access_key': 'YOUR_API_KEY', 'url': 'https://example.com/guides/og-images'}, timeout=90)
r.raise_for_status()
open('og-preview.webp', 'wb').write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://example.com/guides/og-images' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const fs = await import('node:fs/promises');
await fs.writeFile('og-preview.webp', Buffer.from(await res.arrayBuffer()));

ScreenshotNeo accepts the cookie or consent banner like a visitor and removes more than 60 known consent platforms, newsletter popups and chat widgets before the capture; each cleanup step can be turned off. Bot checks and CAPTCHAs, blank pages, timeouts, failed loads and cache hits are not billed, and response headers identify the page verdict and whether the shot was billed. Its MCP server exposes take_screenshot, get_page_info and capture_pdf for Claude, Cursor and other MCP clients. The Free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000 shots, with every feature on every plan.

Create a free ScreenshotNeo account to check your published OG previews without setting up a browser.

Frequently Asked Questions

Does LinkedIn’s 5 MB figure also govern image advertisements?

No. LinkedIn’s help information distinguishes its sharing-module requirements from separate image-ad specifications. Confirm the rules for the product you are using.

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

Can an image pass a browser test and still fail social sharing?

Yes. A browser session may have cookies, JavaScript state or a challenge exemption that a social crawler does not. Validate the public image URL and the deployed metadata independently.

Quick Recap

SaleBestseller No. 1
HTML and CSS: Design and Build Websites
HTML and CSS: Design and Build Websites
HTML CSS Design and Build Web Sites; Comes with secure packaging; It can be a gift option
$15.74
SaleBestseller No. 3
SaleBestseller No. 4
Web Design with HTML, CSS, JavaScript and jQuery Set
Web Design with HTML, CSS, JavaScript and jQuery Set
Brand: Wiley; Set of 2 Volumes
$35.05

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.