4 мин чтения
Почему ваши превью ссылок выглядят сломанными (и как это исправить)
Пустое или неправильное превью при вставке ссылки в Slack, iMessage или X почти всегда сводится к горстке тегов Open Graph. Вот проверочный список.
Вы публикуете страницу, вставляете ссылку в Slack — и получаете голый URL без картинки или, что хуже, заголовок месячной давности. Превью ссылок формируются мета-тегами Open Graph и Twitter, и когда их нет или они неверны, каждая платформа откатывается к чему-то неприглядному.
Теги, которые определяют превью
<meta property="og:title" content="Your page title" />
<meta property="og:description" content="One clear sentence." />
<meta property="og:image" content="https://yoursite.com/og.png" />
<meta name="twitter:card" content="summary_large_image" />Обычные виновники
- og:image указан относительным путём — а должен быть абсолютным URL.
- Изображение слишком маленькое; ориентируйтесь на 1200×630.
- Теги подставляются на стороне клиента, поэтому краулеры их никогда не видят.
- Кэш отдаёт старое превью — пересканируйте страницу, чтобы обновить его.
Инструмент «OG Image» отрисовывает фирменную карточку для каждой страницы и показывает, как ссылка развернётся в Slack, iMessage, X и LinkedIn, ещё до публикации, — а затем навык прописывает теги в ваш репозиторий, чтобы они рендерились на стороне сервера.