Understanding the Open Graph Protocol (OGP)
The Open Graph protocol was created by Facebook to standardize how web pages present rich objects across social networks. When a user pastes a URL into Facebook, LinkedIn, Discord, Telegram, or WhatsApp, their web scrapers read the document's <head> for standardized og:* properties rather than guessing titles and body imagery from arbitrary DOM elements.
The 1200 x 630 Ratio Rule
The standard aspect ratio for Open Graph banners is 1.91:1 (ideally 1200 x 630 px). Providing images smaller than 600 x 315 px causes social platforms to downgrade the preview from a high-engagement full-width card to a small square thumbnail.
Explicit Dimensions Pre-Caching
Declaring og:image:width and og:image:height allows scrapers to render your social preview immediately on the first share without having to asynchronously download and inspect the image file.
Core Open Graph Properties Reference
| Property | Status | Recommended Value | Implementation Details |
|---|---|---|---|
| og:title | Required | 40 – 60 chars | The title of your object as it should appear in the graph |
| og:type | Required | website / article | Defines how the schema is mapped (e.g. article includes author info) |
| og:image | Required | 1200 x 630 px URL | Must be an absolute HTTPS URL accessible to social web scrapers |
| og:url | Required | Canonical HTTPS URL | The canonical address that unifies all likes, shares, and reactions |
| og:description | Optional | 50 – 65 chars | A short 1-2 sentence overview of the content |
| og:site_name | Optional | Brand / App Name | Overall site name displayed above or below the title in snippets |
Frequently Asked Questions
What are the recommended dimensions and file size for an og:image tag?
The optimal dimensions for standard Open Graph images across Facebook, LinkedIn, and Discord are 1200 x 630 pixels (an aspect ratio of 1.91:1). Keep the file size under 5 MB (or under 1 MB for faster mobile rendering) in PNG, JPEG, or WebP format.
What are the four mandatory Open Graph properties every webpage needs?
Under the official Open Graph protocol, the four baseline properties required for every page are og:title, og:type, og:image, and og:url.
Why do social platforms show an outdated image or title after I update my Open Graph tags?
Social platforms aggressively cache scrapers. To force an immediate refresh after updating your meta tags, use the platform's official debugging tool (e.g., Facebook Sharing Debugger, LinkedIn Post Inspector, or Twitter Card Validator) to purge the cached response.