A/B test your OG image without a developer

You made a cover for an article. You sent the link to Telegram, and silence: few opens. Maybe the headline is weak? Maybe the picture did not catch the eye? You cannot guess, you test. An A/B test of a cover answers the question with numbers: two halves of your audience see two variants of the og:image, and a week later you know exactly which one brings clicks. A person notices the cover a fraction of a second before the headline, and in that fraction of a second decides whether to click or scroll on.

Why covers are usually not tested: it seems you cannot do without a developer. The cover is “baked into” the page, messengers cache previews, and clicks on two different links supposedly cannot be told apart.

All three barriers can be bypassed by hand: we duplicate the page, tag the links and read a ready-made report. All you need is a cover builder and a little patience, no developer required. Let us go step by step.

The rule of an honest test: change one thing only. If the variants differ in color, headline and photo at once, you will not learn what actually worked. Two workable approaches:

• One text, different style. The same headline on a light and a dark template tests the design.
• One style, different text. For example, “How we doubled our sales” against “12 mistakes in your emails” tests the wording.

Variant A: the light “Minimal” template, calm and businesslike.
Variant B: the dark “Graphite” template, the same text but with more contrast.

The text is the same, the impression is different. Nobody knows in advance which variant will collect more clicks: a light card reads “cleaner” on a phone’s dark theme, a dark one has more contrast in a light feed. That is exactly what we are testing.

Where to build the covers: in the OG Studio builder, with 32 templates, the 1200×630 format and a one-click template switch that keeps your text and photo in place. Download two PNGs and the test materials are ready.

This is the main trick of the whole test. A messenger builds the preview from the exact address of the link: if even one character differs, it is a “new” link for the messenger, and it builds the preview from scratch. So you do not have to touch the code of the live page: it is enough to make a second address that serves the second cover.

Without a developer this is solved by duplicating the page: in WordPress, “Duplicate” in the post list; in Tilda, “Duplicate page”. Then, on the copy, set the second cover in the “social image” field:

• WordPress + Yoast SEO: the Yoast block under the post text (or in the sidebar) → the “Social” tab → the “Upload image” field;
• WordPress + Rank Math: the Rank Math block under the post → the Social tab → “Add Image”;
• Tilda: “Page settings” → the “Social networks” tab → upload the picture; if you have never set up the preview, a “Set up display in social networks” button appears.

Publish the copy: its address becomes the link of variant B. After the test, simply delete the loser’s page and put the winner on the live page (Step 4).

The field names were checked against the official Yoast, Rank Math and Tilda help pages as of October 2026. If the tab in your version of the plugin is named slightly differently, look for the word “Social”: the field you need is always about the “image for social networks”.

What is left is learning to tell the clicks apart. Add a UTM tag to the end of each address, a mark invisible to a person that your analytics counter can see:

Two addresses, two covers; the tag in the address is visible only to the counter

https://your-site.com/article       ?utm_content=a   — variant A: the live page (light cover)
https://your-site.com/article-copy  ?utm_content=b   — variant B: the page copy (dark cover)

Nothing changes for the person: the same article opens and the tag is invisible. But the visit counter, Yandex Metrica or Google Analytics, sees the mark and records which link the visits came from.

One utm_content parameter is enough to compare two covers. Full tags (utm_source, utm_medium, utm_campaign) are needed when reports are built across all campaigns at once; we will cover them in a separate guide.

How to spread the links across your audience so the test is fair:

• a channel post on Monday gets link A, on Wednesday link B: the same time of day, a similar online audience;
• or two comparable venues: your own channel and a customer chat, a newsletter issue and stories, guests on a neighboring media outlet and your own;
• keep the text of the post itself identical, otherwise you are testing texts, not covers.

Do not publish both links in the same post back to back. Some people will click both, and the numbers will get muddy.

If the page is not yours, such as someone else’s article or a partner’s material, you control neither the preview nor the cover. The only way is to send traffic through your own intermediate page with your own cover, but that is a story about landing pages, not about an A/B test.

How long to wait: until each link has collected at least 50–100 clicks. For a small channel that is a week or two, for a large one a couple of days. Then open your analytics: both Yandex Metrica and Google Analytics have ready-made reports on UTM tags in the “Traffic sources” section, and both of your links are visible there as separate rows.

Compare not the absolute number of clicks but the click-through rate: how many people saw the post and how many of them opened the link. And remember that statistics love volume: 20 clicks against 23 is still a lottery, 200 against 230 is already a pattern.

If you do not want to dig into analytics reports, there is a simpler path: link shorteners with statistics (clck.ru from Yandex, bit.ly and similar). Each cover gets its own short address, and you can see how many times it was clicked in the service’s dashboard.

The test is over and the winner is known. What is left is to show it to the whole world. If your site runs on a CMS, change the cover on the live page in the same field where you set the second cover for the copy (see Step 2). If the landing page is built on bare HTML, insert Open Graph meta tags: a small piece of code in the page “head” that messengers read when they build the link preview.

What exactly to insert. In the HTML code of the page, between the <head> and </head> tags, add a block (with your own values):

A minimal set of OG tags for an article page

<meta property="og:title" content="How to choose a cover for an article">
<meta property="og:description" content="Tested with numbers: what works in og images.">
<meta property="og:image" content="https://your-site.com/cover.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Article cover: a light template with a large headline">
<meta name="twitter:card" content="summary_large_image">

Put the image file anywhere on your site where it is reachable by a direct link without authorization, for example https://your-site.com/cover.png. The size is 1200×630: this is the standard that Telegram, VK, X, WhatsApp, Facebook* and LinkedIn all show equally well.

A landing page on bare HTML is the variant with the code above, inserted once. If you have a developer at hand, ask them to automate this once and for all: so that the cover is not a static file but is generated from the page title. Then the next A/B test needs neither a code edit nor a file upload, only a different parameter in the image address.

How this looks in practice: OG Studio has a public render address of the form https://og-studio.online/api/og/render.png?title=...&template=.... Substitute a different title or template, and the same address serves messengers a different cover. A developer can connect a page to such a generator in a single evening, and after that you change pictures as often as every week without a single line of code.

Before posting, run the page through the OG checker: paste the link and you will see the preview in Telegram, VK, X, WhatsApp, Facebook* and LinkedIn exactly as readers will see it. Next to it is the diagnostics: the real size of the og:image, the file weight and a list of missing tags. One check, and none of the six main platforms will spring a surprise on you. This applies to the test itself too: check both addresses, each should pull in its own cover, and only then share the link.

Messenger cache. You set a new cover, but Telegram shows the old one? Social networks remember the preview the first time a link is shown and then keep it in cache for a long time. What to do: platform debuggers, the @WebpageBot bot in Telegram and the trick with a parameter in the image address are covered in a separate article, “Changed the OG image, but social networks show the old one?”

Image size and weight. 1200×630 is the case where “bigger” does not mean “better”: square and vertical images get cropped at the edges by social networks, and a file heavier than a megabyte loads slowly on mobile internet. Both are visible in the OG checker diagnostics, which also suggests the right size and a sensible weight. For details on sizes, see the guide “OG image size”.

The winner is not forever. A cover that collects clicks today “burns out” in a few months, as the audience stops noticing it. Repeat the test every quarter or half a year, with a new challenger against the reigning champion: a conveyor belt instead of one winning picture.

An A/B test of a cover is the cheapest experiment in your arsenal: two pictures, two addresses and a week of waiting. The conclusion of each test is not “picture B is prettier” but knowledge about your audience, for example: “my people respond to covers with numbers and a promise of benefit, not abstract gradients”. After three or four tests you accumulate a signature cover recipe, and there is no need to guess anymore. Build the variants in the OG Studio builder, free and without sign-up, check the page with the OG checker, and next time, instead of “I think this picture is better”, you will have a number.