Превью ссылки в мессенджерах: как работает и почему залипает

Превью ссылки в мессенджере — карточка с заголовком, коротким текстом и картинкой, которую клиент строит сам после того, как вы отправили URL. Он не «рисует сайт»: он запрашивает страницу, ищет метаданные и кладёт результат в кэш. Поэтому правка текста на лендинге не всегда сразу видна в чате: залипает старая карточка. Как собрать сами теги Open Graph — в Open Graph: превью ссылки; здесь разбор поведения мессенджера и кэша. Длину сниппета для поиска сверьте в длина title и description. Перед публикацией лендинга полезен SEO-чеклист. Код для шапки соберите в генераторе OG-тегов. Ниже: что запрашивает клиент, почему карточка пустая или старая, как обновлять превью и чем путь отличается от настройки тегов.

Как мессенджер получает карточку ссылки

Когда вы вставляете URL, клиент (или его сервер-превьюер) делает запрос к странице. В ответе ищет Open Graph и похожие поля: заголовок, описание, картинку, канонический адрес. Если полей нет, берёт эвристики: <title>, кусок текста, случайную картинку — или показывает почти пустой блок.

Telegram и другие площадки кэшируют результат. Повторная отправка того же URL часто подтягивает сохранённую карточку, а не свежий HTML. Отсюда ощущение, что «сайт уже новый, а в чате старый заголовок».

Карточка в ленте и сниппет в поиске — разные механизмы. Поиск смотрит на обычные title и description; мессенджер — на og:*. Путать их нельзя: правка только title не гарантирует новое превью в чате.

Что читают из HTML

Чаще всего достаточно og:title, og:description, og:image и абсолютного URL страницы. Картинка должна открываться по прямому адресу без авторизации. Относительный путь /img/og.png без домена в превьюер часто ломается.

Сборку строк тегов удобно сделать в генераторе OG-тегов. Смысл полей и проверка после публикации — в Open Graph: превью ссылки.

Почему «как сделать превью» ≠ «почему залипло»

«Как сделать» — про разметку на сайте. «Почему залипло» — про кэш площадки после того, как разметка уже верная. Эта статья про второй слой и про то, как устроен запрос. Первую половину закрывает Gen02 по ссылке выше.

Почему превью пустое, кривое или чужое

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

Кривая карточка — частый результат короткого og:description, обрезанного заголовка или картинки неверного размера. Слишком тяжёлый файл изображения иногда не подтягивается вовремя. Проверьте, что картинка реально отдаётся с кодом 200.

Чужое превью появляется, когда на странице остались чужие OG с шаблона, или редирект ведёт на другой URL с другими тегами. Смотрите конечный адрес после всех перенаправлений.

Редиректы и UTM

Превьюер может закэшировать промежуточный или конечный URL по-разному. Лучше держать стабильный канонический адрес без лишних параметров в «боевой» ссылке для шаринга. UTM для аналитики добавляйте осознанно и проверяйте, не ломают ли они отдачу OG.

Если короткая ссылка-обёртка не пробрасывает метаданные, карточка соберётся с домена сокращателя, а не с лендинга.

Мобильная и десктопная вёрстка

Мессенджеру нужна HTML-шапка с метатегами, а не «красивый экран». Отдельный мобильный сайт на другом домене без OG даст другую карточку. Один домен, одни теги, адаптив в CSS — спокойнее, чем два разных HTML.

Почему превью «залипает» и как его обновить

Кэш нужен площадкам, чтобы не дергать ваш сервер на каждое сообщение в каждом чате. Срок жизни кэша вы не контролируете полностью. Поэтому после смены заголовка или картинки старая карточка может жить часами или дольше.

Типичный путь обновления: исправить теги на сайте → убедиться в браузере «просмотр кода», что отдаётся новое → сбросить кэш через инструмент площадки, если он есть → отправить ссылку в тестовый чат. Для Telegram часто используют официальный бот @WebpageBot или повторную проверку URL в клиентских подсказках — актуальный способ смотрите в справке Telegram на момент работы.

Смена только текста в <h1> без смены og:title превью не спасёт. Меняйте именно метаполя карточки.

Когда сброс не помогает

Если превьюер по-прежнему видит старый HTML, виноват CDN или кэш на вашей стороне: отдаёте закэшированную шапку. Сбросьте кэш сайта, проверьте заголовки Cache-Control для HTML. Картинку OG иногда приходится публиковать под новым именем файла: og-v2.jpg, чтобы обойти кэш изображения.

Проверьте, что правите тот URL, который реально шарите. «Главная» и «лендинг с хвостом» — разные ключи кэша.

Тестовый контур

Держите закрытый чат для проверки ссылок. Не отлаживайте превью в общем канале с тысячей подписчиков: туда улетит промежуточная версия. После успешного сброса уже публикуйте анонс.

Сверьтесь с SEO-чеклистом для лендинга: OG там один из пунктов перед релизом, не «потом когда-нибудь».

Связь с title, description и лендингом

Обычные title и description влияют на вкладку и часто на поиск. Их длина и смысл — в длина title и description. Open Graph можно согласовать по смыслу с ними, но строки в HTML остаются отдельными.

На лендинге перед запуском пройдите короткий чеклист: уникальные мета, OG, лёгкие картинки. Разбор порядка — SEO-чеклист для лендинга. Генератор карточки: генератор OG-тегов.

Не ждите, что мессенджер «подтянет» красивый hero сам: без явной og:image результат непредсказуем.

Чем эта статья отличается от гайда по тегам

Гайд Gen02 отвечает: какие теги вставить и как проверить картинку. Здесь ответ: в каком порядке мессенджер ходит на сайт, почему кэш важнее вашей последней правки в редакторе и что делать, когда карточка залипла. Обе статьи нужны подряд: сначала разметка, потом поведение кэша.

Смежные материалы

Сборка тегов: Open Graph: превью ссылки. Релиз лендинга: SEO-чеклист для лендинга. Сниппет поиска: длина title и description.

На сайте: генератор OG-тегов, при необходимости проверка title и description.

Частые вопросы

Как сделать превью ссылки в Telegram?

Сначала разметьте страницу Open Graph: заголовок, описание, картинка с абсолютным URL. Код удобно собрать в генераторе OG-тегов. Затем отправьте ссылку в чат и при необходимости сбросьте кэш площадки. Пошаговая сборка тегов — в Open Graph: превью ссылки; эта статья про то, почему после правок карточка может не обновиться сразу.

Почему превью в Telegram не обновляется?

Чаще всего сработал кэш превьюера на старый ответ страницы. Проверьте, что по URL реально отдаётся новый HTML с новыми og:*. Сбросьте кэш сайта и кэш площадки, если инструмент сброса доступен. Иногда помогает новое имя файла картинки, если зависло только изображение.

Чем превью в мессенджере отличается от сниппета в поиске?

Поиск опирается на title, description и свои алгоритмы. Мессенджер читает Open Graph и кладёт карточку в свой кэш. Можно согласовать тексты по смыслу, но поля в коде разные. Длину для поиска смотрите в длина title и description.

Обязательна ли картинка og:image?

Для нормальной карточки — да, почти всегда. Без неё клиент угадывает изображение или оставляет пустое место. Файл должен открываться без логина и желательно быть достаточно лёгким. Абсолютный URL обязателен.

Почему в превью чужой заголовок?

На странице остались чужие метатеги шаблона, или редирект ведёт на другой документ. Откройте «просмотр кода» у конечного URL после всех редиректов. Сверьте og:title с тем, что видите в чате. Уберите дефолты CMS вроде «Home» и названия темы.

Нужно ли дублировать текст в title и og:title?

Часто берут одну мысль, но строки могут отличаться: в поиске — ключи и длина, в мессенджере — человеческий заголовок для чата. Полное совпадение не требуется. Главное — не противоречить друг другу. Проверка обычных мета: проверка title и description.

Влияет ли скорость сайта на превью?

Да, если превьюер не дожидается ответа и уходит с пустым результатом. Тогда в кэш может записаться «пусто». Держите HTML шапки лёгким и быстрым. Тяжёлые скрипты ниже по странице меньше мешают, чем долгий TTFB самого документа.

Как проверить превью до поста в канал?

Используйте тестовый чат и инструменты сброса/проверки площадки. Убедитесь в коде страницы, что теги на месте. Сверьте картинку отдельной вставкой URL в браузере. Только после этого публикуйте анонс подписчикам.

Хватает ли SEO-чеклиста вместо настройки OG?

Чеклист напоминает включить OG среди прочих пунктов релиза, но не заменяет понимание кэша. Пройдите SEO-чеклист для лендинга и отдельно проверьте карточку в мессенджере. Теги соберите в генераторе OG-тегов. После выкладки будьте готовы сбросить кэш.

С чего начать, если карточка уже залипла у аудитории?

Исправьте OG на боевом URL и подтвердите новый HTML. Сбросьте кэш CDN и кэш превьюера. При необходимости смените имя файла og:image. Подробная сборка полей — Open Graph: превью ссылки; длина мета для поиска — длина title и description; порядок релиза — SEO-чеклист для лендинга.