In short: Open Graph is a set of meta tags that Telegram, X and other platforms read to build a link card: image, headline and description. Five tags cover the basics: og:title, og:description, og:image, og:url and og:type. Use a 1200×630 image, keep the tags in server-rendered HTML, force a cache refresh after every change, and verify the card with our tool /og-preview.
What Open Graph is and why it matters
Open Graph is a page markup protocol introduced by Facebook in 2010 and documented at ogp.me. The idea is simple: a page exposes a handful of service meta tags, and any platform — Telegram, X, WhatsApp, LinkedIn, Slack, Discord, Facebook — reads them and assembles a link card out of them: a cover image, a headline, a short description and the domain name. Telegram shows the card while you are still typing the message, X renders it when the post is published, Slack and Discord expand the link right in the thread — all of them from the same set of tags.
For a site owner this is a direct lever on click-through rate. A bare URL with no preview looks like spam in a chat, and people are reluctant to tap it. A clean card with a readable cover and a clear headline multiplies the CTR of the very same link without touching the content behind it. Given how much traffic now arrives from Telegram channels, group chats and social feeds, Open Graph markup pays for itself faster than almost any other meta tag on the page.
The link card is your snippet for messengers. In search results the title and meta description do the selling; in Telegram and X it is Open Graph. These are two separate channels, and they are configured independently of each other.
The minimal set of tags
A working setup fits into five tags inside the head section. This is enough for every major platform to build the card correctly:
<meta property="og:title" content="Page headline for the link card"> <meta property="og:description" content="A short summary — one or two sentences"> <meta property="og:image" content="https://example.com/og/cover.png"> <meta property="og:url" content="https://example.com/page/"> <meta property="og:type" content="article">
- og:title — the headline of the card. It does not have to match the page title: you can use a punchier wording, ideally under 60–70 characters.
- og:description — one or two sentences shown under the headline. Platforms truncate the text differently, so put the essence into the first 100 characters.
- og:image — an absolute https URL of the cover image. Crawlers do not resolve relative paths.
- og:url — the canonical address of the page, without UTM parameters or session identifiers.
- og:type — the content type: website for the home page and sections, article for blog posts.
The tags must be present in the HTML response returned by the server. If your site is a single-page app and the meta tags are injected by JavaScript, platform bots will never see them — more on that in the troubleshooting section below.
og:image requirements
The cover is the most visible element of the card, and most mistakes happen exactly here. The universal recommendation is 1200×630 pixels (a 1.91:1 aspect ratio): this size survives cropping in Telegram, X, WhatsApp and Facebook without losing anything important.
| Platform | Recommended size | Format and limits |
|---|---|---|
| Telegram | 1200×630 (1.91:1) | JPG, PNG, WebP; up to 5 MB |
| X (Twitter) | 1200×630 with summary_large_image | JPG, PNG, WebP; up to 5 MB |
| Facebook, WhatsApp | 1200×630, minimum 600×315 | JPG, PNG; up to 8 MB |
| 1200×627 | JPG, PNG; up to 5 MB |
Practical advice: keep the file under 200–300 KB so the card renders instantly even on slow mobile networks; prefer JPG or PNG (WebP is supported by most platforms, but not by every corporate messenger); place the logo and any text in the central safe zone, because the edges may be trimmed on some clients. If you generate covers automatically, render the template at exactly 1200×630 and re-use the same file for twitter:image — one image serves every platform. For X you also need to declare the card type explicitly, otherwise the link falls back to a small side thumbnail:
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Headline for X"> <meta name="twitter:image" content="https://example.com/og/cover.png">
Common preview problems
The preview does not update. The most frequent complaint by far. Platforms cache the card the first time a link is posted: Telegram keeps it for a long time, X refreshes roughly once a week. Editing the og tags changes nothing by itself — the cache has to be purged explicitly, see the next section.
The image gets cropped. A cover with a non-standard aspect ratio is cut to fit: vertical images lose the top and bottom, wide panoramas lose the sides. The fix is to resize the cover to 1200×630 and move all meaningful elements towards the center of the frame.
The preview is empty. If the tags are added by JavaScript after the page loads, bots do not see them: they read the raw HTML and do not execute scripts. A single-page app needs SSR, prerendering, or og tags injected at the server or edge level.
The bot is blocked. Anti-bot protection, a firewall rule or robots.txt may serve a 403 to platform crawlers — then there will be no card at all. Make sure TelegramBot, Twitterbot and facebookexternalhit are not caught by your blocking rules.
How to refresh the preview cache
Telegram. The official way is the service bot @WebpageBot: send it the link and it will re-scrape the page and refresh the cached card for every chat at once. If the Telegram link preview does not change on the first try, send the URL again a minute later.
X (Twitter). The old Card Validator no longer forces a refresh: the cache expires on its own, roughly every seven days. To speed things up, append a neutral query parameter such as ?v=2 — the platform treats the URL as new and fetches fresh tags immediately.
Other platforms. Facebook and LinkedIn provide their own debugger tools that re-scrape a URL on demand; for messengers without such a tool, the query-parameter trick remains the universal workaround.
Preview caching is not a bug — it is how platforms protect themselves from redundant load. Whenever you plan an og tag change, put a "purge the preview cache" step on the checklist, or your subscribers will keep seeing the stale card for a week.
How to verify your Open Graph markup
Poking every platform bot by hand is slow. It is faster to run the link through our Open Graph validator — the tool /og-preview: paste a URL and it renders the card the way Telegram, X and other networks will show it, and highlights missing or broken tags. The whole check takes seconds and does not require posting the link into a real chat. Make it a habit to run the check after every deploy that touches page templates: a broken build can silently drop the tags, and you will only notice when someone shares a link.
While you are at it, check the page's structured data as well: the neighbouring tool /schema-checker validates Schema.org markup, and we covered how to read its report in the article on checking structured data.
FAQ
Why does the Telegram preview not update after I fix the tags?
Telegram caches the card the first time the link is posted and keeps it for a long time. Send the URL to @WebpageBot — it re-scrapes the page and updates the preview in every chat, usually within a couple of minutes.
Can I show different cards in Telegram and X?
Partially. Only X has its own tag namespace (twitter:*); every other platform reads the shared og tags. You could serve different tags per bot User-Agent on the server side, but that complicates maintenance and debugging and is rarely worth it.
What happens if a page has no og tags at all?
The platform improvises: it may pick up the title tag, the meta description and the first image it finds — or show nothing but the bare URL. The result is unpredictable, so the five basic tags belong on every public page.
Does Open Graph affect search rankings?
Not directly: search engines do not use og tags as a ranking factor. Indirectly — yes: a good preview increases clicks from messengers and social feeds. If your problem runs deeper and the site does not appear in search results at all, start with our guide on why a website is not in search.
Checklist
- Five core tags — og:title, og:description, og:image, og:url, og:type — on every public page.
- og:image is 1200×630, an absolute https URL, under 300 KB.
- twitter:card is set to summary_large_image for X.
- Tags are present in the server-rendered HTML, not injected by JavaScript.
- Platform bots are not blocked by the firewall or robots.txt.
- The cache is purged after every change: @WebpageBot for Telegram, a query parameter for X.
- The card is verified in /og-preview for all key pages.