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

Ещё одна классика: вы отправили ссылку в Telegram или постите её в соцсеть, а вместо красивой карточки с картинкой и заголовком выходит голый URL — синяя строчка текста и всё. На сайте и картинка есть, и заголовок прописан, а мессенджер делает вид, что ничего не видел.

Хорошая новость: в 90% случаев причина находится за две минуты. Плохая — причин целых семь, и они наслаиваются: например, og:image у вас есть, но картинка отдаётся с редиректом, а до этого вы успели закэшировать «пустую» версию ссылки. Ниже — все семь с проверкой и починкой для каждой, плюс быстрый чек-лист диагностики в конце.

Как соцсеть решает, показывать превью

Когда ссылка впервые попадает в чат или пост, соцсеть отправляет на страницу робота. Он не рендерит сайт как браузер — просто скачивает HTML и читает мета-теги: og:image, og:title, og:description. Есть теги — рисуется карточка. Нет тегов или робот не смог их прочитать — карточки не будет, и мессенджер честно покажет голую ссылку.

Из этого следует важное: превью собирается не из того, что видит человек в браузере, а из того, что видит робот в исходном HTML. Дизайн страницы, вставленная в текст картинка, JS-галерея — всё это робота не интересует. Поэтому «у меня же на сайте есть шапка с логотипом» не аргумент: нужна отдельная картинка, прописанная в og:image.

Причина 1: тега og:image просто нет

Самый частый случай. Конструкторы сайтов и самописные лендинги часто не добавляют og:image по умолчанию, а при уборке мета-тегов его легко задеть. Проверка: откройте страницу, нажмите Ctrl+U (исходный код) и поищите og:image. Тега нет или он пустой — вот и причина.

Починка: добавьте в <head> три строки — og:title, og:description и og:image. Картинку сделайте 1200×630: это тот размер, который Telegram, VK, Facebook и LinkedIn показывают без обрезки. Быстро собрать такую картинку можно в редакторе OG Studio — без Photoshop и возни с размерами.

Причина 2: относительный URL картинки

Соцсети не умеют «додумывать» адреса. Если в og:image написано /images/cover.png вместо https://site.com/images/cover.png — робот не поймёт, с какого домена качать файл, не найдёт его и молча покажет ссылку без превью. Браузеру такой относительный адрес ничего не стоит: он знает, на каком сайте вы находитесь. Робот — нет.

Починка: в og:image всегда полный адрес с протоколом и доменом, начиная с https://. Заодно проверьте, что протокол именно https: смешанный контент (страница на https, картинка на http) мессенджеры тоже не любят.

Причина 3: robots.txt не пускает робота

Бывает, что og:image на месте, но в robots.txt стоит что-то вроде Disallow: / «на время разработки» — а убрать забыли. Робот соцсети уважает robots.txt: не пускают — он не читает страницу вообще, и о ваших мета-тегах не узнает.

Тонкий момент, который всех путает: запрет индексации в мета-теге роботу соцсети не мешает, а запрет в robots.txt — мешает. Страница с <meta name="robots" content="noindex"> всё равно получит превью: робот скачает HTML и прочитает теги. А вот жёсткий Disallow в robots.txt закрывает дверь перед носом. Проверьте файл site.com/robots.txt — и если там закрыты целые разделы, где лежат картинки, робот не сможет скачать и их.

Если хочется закрыться только от поиска, но не от соцсетей, в robots.txt можно точечно разрешить роботов мессенджеров: User-agent: TelegramBot, Twitterbot, facebookexternalhit, LinkedInBot, Discordbot — с Allow: /.

Причина 4: сама картинка не открывается

Робот скачивает не страницу, а картинку по отдельному адресу — и на этом шаге всё ломается чаще, чем кажется. Откройте URL из og:image в режиме инкогнито: вместо картинки может оказаться 404 (страница не найдена), 403 (доступ запрещён — хотлинк-защита или права на файл), заглушка хостинга или… HTML-страница «файл не найдён» с кодом 200 (успешный ответ) — конструкторы любят такое, и робот честно пытается сделать превью из HTML.

Отдельно проверьте hotlink protection: некоторые хостинги отдают картинки только если запрос пришёл с вашего же домена. Браузер проходит, робот Telegram — нет. И посмотрите ответ сервера: редиректы вида «картинка → HTML» или вечная переадресация тоже ломают загрузку.

Причина 5: файл слишком тяжёлый или экзотический

Робот ждёт картинку пару секунд, не дождался мегабайтного PNG — показал ссылку без превью. Это особенно актуально для фото «прямо с камеры» по 5–8 МБ. Формат тоже важен: JPG и PNG понимают все, а более экзотические варианты — кто во что горазд. Если сомневаетесь — JPG.

Починка простая: OG-картинку держите в разумных пределах по весу — пары сотен килобайт более чем достаточно для 1200×630. В редакторе OG Studio выгрузка как раз оптимизирована под соцсети: лёгкий PNG без мегабайтных слоёв. И следите, чтобы CDN не подменял файл чем-то другим при первом запросе.

Причина 6: цепочка редиректов

Страница отдаёт 301 (постоянный редирект) на другой адрес, тот — ещё на один, и где-то в конце робот теряет путь или упирается в лимит переходов. Короткий редирект один-в-один почти все мессенджеры проходят спокойно, но с третьего-четвёртого шага начинаются проблемы — особенно если в цепочке смешаны http и https или домены с www и без.

Проверка: любой сервис проверки HTTP-заголовков (или curl в терминале) покажет всю цепочку ответов по вашей ссылке. Починка — сократить её до одного шага: финальный адрес в og:image, единый канонический домен, https везде.

Причина 7: соцсеть запомнила «пустую» карточку

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

Здесь начинается территория нашей статьи про кэш: в Telegram — @WebpageBot, у Facebook и LinkedIn — официальные дебаггеры, а там, где сброса нет, выручает параметр версии в URL. Полный разбор — в статье «Заменил OG-картинку, а соцсети показывают старую?».

Чек-лист: диагностика за 2 минуты

1. Исходный код страницы — Ctrl+U, ищем og:image. Нет тега → причина 1.
2. Адрес картинки — полный, с https:// и доменом? Относительный → причина 2.
3. robots.txt — не закрыты ли страница и картинки Disallow → причина 3.
4. URL картинки в инкогнито — открывается ли сама картинка, без 404/403/редиректа в HTML → причины 4 и 6.
5. Вес и формат файла — сотни килобайт, JPG/PNG → причина 5.
6. Постилась ли ссылка раньше — до появления og:image? Сбросить кэш → причина 7.
7. Финальная проверка — отправить ссылку себе в «Избранное» в Telegram и посмотреть, что получилось.

Обычно хватает первых трёх шагов: нет тега, относительный адрес или закрытый robots.txt покрывают подавляющее большинство случаев. Если все семь пунктов в порядке, а превью всё равно нет — прогоните ссылку через дебаггер соцсети: он покажет, что именно видит робот, и это сразу сузит поиск.

Сделать превью, которое точно покажется

Чтобы не диагностировать, проще сразу делать по правилам: картинка 1200×630, JPG или PNG, лёгкий файл, абсолютный адрес с https. Какие размеры нужны каждой соцсети — в руководстве по размеру OG-картинки, а как читать мета-теги конкретно Telegram — в гайде по обложкам Telegram.

В OG Studio карточка собирается за 30 секунд: заголовок предложит ИИ, шаблон — галерея, размер под нужную соцсеть выставится сам. Останется выгрузить PNG, положить на сайт и один раз проверить ссылку в мессенджере — дальше превью будет работать само.