A/B-тест обложки без программиста: какая og-картинка даёт клики

Два варианта обложки, две ссылки с метками и неделя наблюдения — и вы точно знаете, какая og-картинка приносит клики. Без программиста: где собрать обложки, как разложить ссылки по каналам, что именно вставить на страницу и как проверить результат.

·7 мин

Вы сделали обложку для статьи. Отправили ссылку в Telegram — и тишина: открытий мало. Может, заголовок слабый? Может, картинка не зацепила? Угадать невозможно — это проверяют. A/B-тест обложки отвечает на вопрос цифрами: двум половинам аудитории показывают два варианта og-картинки, и через неделю вы точно знаете, какая из них приносит клики. Обложку человек замечает на долю секунды раньше заголовка — и в эту долю секунды решает, кликнуть или пролистать.

Почему обложки обычно не тестируют: кажется, что без разработчика не обойтись — обложка «зашита» в страницу, мессенджеры кэшируют превью, а клики по двум разным ссылкам будто бы не различить.

Все три барьера обходятся руками: страницу дублируем, ссылки помечаем, отчёт читаем готовый. Нужны конструктор обложек и немного терпения — программист не понадобится. Разбираем по шагам.

Шаг 1. Сделайте два варианта обложки

Правило честного теста: меняйте что-то одно. Если варианты отличаются и цветом, и заголовком, и фотографией — вы не узнаете, что именно сработало. Два рабочих подхода:

  • Один текст, разный стиль. Один и тот же заголовок на светлом и тёмном шаблоне — проверяется оформление.
  • Один стиль, разный текст. Например, «Как мы удвоили продажи» против «12 ошибок в ваших письмах» — проверяется формулировка.
Вариант А — светлый шаблон «Минимал»: тот же заголовок на белом фоне, спокойное деловое впечатление
Вариант А — светлый шаблон «Минимал»: спокойно и по-деловому
Вариант Б — тёмный шаблон «Графит»: тот же заголовок белым на чёрном, контраст выше и в ленте заметнее
Вариант Б — тёмный шаблон «Графит»: тот же текст, но контрастнее

Текст один и тот же — впечатление разное. Какой из вариантов соберёт больше кликов, заранее не знает никто: светлая карточка «чище» читается на тёмной теме телефона, тёмная — контрастнее в светлой ленте. Это и проверяем.

Где собрать обложки: в конструкторе OG Studio — 24 шаблона, формат 1200×630, смена шаблона в один клик, при этом ваш текст и фото остаются на месте. Скачали два PNG — материалы для теста готовы.

Шаг 2. Дайте каждой обложке свой адрес

Вот главный трюк всего теста. Мессенджер собирает превью по точному адресу ссылки: отличается хотя бы один символ — для него это «новая» ссылка, и превью он соберёт заново. Значит, код боевой страницы можно не трогать — достаточно сделать второй адрес, который отдаёт вторую обложку.

Без разработчика это решается дублированием страницы: в WordPress — «Дублировать» в списке записей, в Тильде — «Дублировать страницу». Дальше на копии поставьте вторую обложку в поле «изображение для соцсетей»:

  • WordPress + Yoast SEO — блок Yoast под текстом записи (или в боковой панели) → вкладка «Соцсети» (Social) → поле «Загрузить изображение»;
  • WordPress + Rank Math — блок Rank Math под записью → вкладка Social → «Add Image» («Добавить изображение»);
  • Тильда — «Настройки страницы» → вкладка «Соцсети» → загрузите картинку; если превью раньше не настраивали, появится кнопка «Настроить отображение в Соцсетях».

Опубликуйте копию — её адрес станет ссылкой варианта Б. После теста страницу проигравшего просто удалите, а победителя поставьте на боевую страницу (Шаг 4).

Названия полей сверены с официальными справками Yoast, Rank Math и Тильды на октябрь 2026. Если в вашей версии плагина вкладка называется чуть иначе — ищите слово «Соцсети» или «Social»: нужное поле всегда про «изображение для соцсетей».

Осталось научиться различать клики. В конец каждого адреса допишите UTM-метку — невидимую для человека пометку, которую видит счётчик аналитики:

Два адреса — две обложки; метка в адресе видна только счётчику

https://ваш-сайт.ru/statya      ?utm_content=a   — вариант А: боевая страница (светлая обложка)
https://ваш-сайт.ru/statya-kop  ?utm_content=b   — вариант Б: копия страницы (тёмная обложка)

Для человека ничего не меняется: открывается та же статья, метка невидима. Но счётчик посещений — Яндекс.Метрика или Google Аналитика — видит пометку и записывает, по какой из ссылок пришли переходы.

Для сравнения двух обложек достаточно одного параметра utm_content. Полные метки (utm_source, utm_medium, utm_campaign) нужны, когда отчёты собираются по всем кампаниям сразу, — про них у нас будет отдельный гайд.

Как разложить ссылки по аудитории, чтобы тест был честным:

  • пост в канале в понедельник — ссылка А, в среду — ссылка Б: одинаковое время суток, похожий состав онлайн-аудитории;
  • или две сопоставимые площадки: свой канал и чат клиентов, выпуск рассылки и сторис, гости на соседнем медиа и у себя;
  • текст самого поста держите одинаковым — иначе вы тестируете тексты, а не обложки.

Не публикуйте обе ссылки в одном посте подряд. Часть людей кликнет по обеим, и цифры замутнятся.

Если страница не ваша — чужая статья или партнёрский материал, — ни превью, ни обложку вы не контролируете. Единственный путь — вести трафик через свою промежуточную страницу со своей обложкой, но это уже история про лендинги, а не про A/B-тест.

Шаг 3. Подождите и прочитайте цифры

Сколько ждать: пока каждая ссылка не наберёт хотя бы 50–100 кликов. У небольшого канала это неделя-две, у большого — пара дней. Дальше открываете аналитику: и в Яндекс.Метрике, и в Google Analytics есть готовые отчёты по UTM-меткам в разделе «Источники трафика» — обе ваши ссылки там видны отдельными строками.

Сравнивайте не абсолютное число кликов, а кликабельность: сколько человек увидело пост — и сколько из них открыли ссылку. И помните, что статистика любит объём: 20 кликов против 23 — ещё лотерея, 200 против 230 — уже закономерность.

Не хочется разбираться в отчётах аналитики — есть путь проще: сокращатели ссылок со статистикой (clck.ru от Яндекса, bit.ly и подобные). Каждой обложке — свой короткий адрес; сколько раз по нему кликнули, видно в личном кабинете сервиса.

Шаг 4. Поставьте победителя на страницу

Тест закончился, победитель известен. Осталось показать его всему миру. Если сайт на CMS — поменяйте обложку на боевой странице в том же поле, где вы ставили вторую обложку для копии (см. Шаг 2). Если лендинг собран на голом HTML — вставьте Open Graph-меты: небольшой код в «шапке» страницы, который мессенджеры читают, когда собирают превью ссылки.

Что именно вставить. В HTML-код страницы, между тегами <head> и </head>, добавьте блок (значения — свои):

Минимальный набор OG-мет для страницы со статьёй

<meta property="og:title" content="Как выбрать обложку для статьи">
<meta property="og:description" content="Проверили на цифрах: что работает в og-картинках.">
<meta property="og:image" content="https://ваш-сайт.ru/cover.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Обложка статьи: светлый шаблон с крупным заголовком">
<meta name="twitter:card" content="summary_large_image">

Сам файл картинки положите в любое место сайта, доступное по прямой ссылке без авторизации — например, https://ваш-сайт.ru/cover.png. Размер — 1200×630: это стандарт, который одинаково хорошо показывают Telegram, VK, X, WhatsApp, Facebook и LinkedIn.

Лендинг на голом HTML — вариант с кодом выше, вставляется один раз. Если под рукой есть разработчик, попросите его автоматизировать это один раз и навсегда: чтобы обложка не была статичным файлом, а генерировалась из заголовка страницы. Тогда для следующего A/B-теста не понадобится ни правка кода, ни загрузка файлов — достаточно другого параметра в адресе картинки.

Как это выглядит на практике: у OG Studio есть публичный рендер-адрес вида https://og-studio.online/api/og/render.png?title=...&template=... — подставили другой title или template, и тот же адрес отдаёт мессенджерам уже другую обложку. Разработчик может подключить страницу к такому генератору за один вечер — и дальше вы меняете картинки хоть каждую неделю без единой строчки кода.

Проверка перед запуском

Прежде чем постить, прогоните страницу через OG-чекер: вставьте ссылку — увидите превью в Telegram, VK, X, WhatsApp, Facebook и LinkedIn ровно так, как их увидят читатели. Рядом — диагностика: реальный размер og:image, вес файла и список недостающих мет. Одна проверка — и ни одна из шести главных площадок не покажет вам сюрприз. Это касается и самого теста: проверьте оба адреса — у каждого должна подтянуться своя обложка — и только потом делитесь ссылкой.

Ловушки, о которых стоит знать

Кэш мессенджеров. Вы поставили новую обложку, а Telegram показывает старую? Соцсети запоминают превью при первом показе ссылки и потом долго держат его в кэше. Что делать: дебаггеры соцсетей, @WebpageBot в Telegram и трюк с параметром в адресе картинки — разобрали в отдельной статье «Заменил OG-картинку, а соцсети показывают старую?».

Размер и вес картинки. 1200×630 — тот случай, когда «больше» не значит «лучше»: квадратные и вертикальные картинки соцсети обрежут по краям, а файл тяжелее мегабайта будет грузиться медленно на мобильном интернете. И то и другое виден в диагностике OG-чекера — он подскажет и правильный размер, и разумный вес. Подробно про размеры — в гайде «Размер OG-картинки».

Победитель не навсегда. Обложка, которая сегодня собирает клики, через несколько месяцев «выгорает» — аудитория перестаёт её замечать. Раз в квартал-полгода повторяйте тест с новым претендентом против действующего чемпиона: конвейер вместо одной победной картинки.


A/B-тест обложки — самый дешёвый эксперимент в арсенале: две картинки, два адреса и неделя ожидания. Вывод каждого теста — не «картинка Б красивее», а знание о своей аудитории: например, «моим людям заходят обложки с цифрами и обещанием пользы, а не абстрактные градиенты». После трёх-четырёх тестов накапливается фирменный рецепт обложки — и угадывать становится незачем. Соберите варианты в конструкторе OG Studio — бесплатно и без регистрации, проверьте страницу OG-чекером — и в следующий раз вместо «мне кажется, эта картинка лучше» у вас будет цифра.