Нажмите Ctrl+D, чтобы добавить страницу в закладки
Инструмент предпросмотра OG — это бесплатный онлайн-инструмент, который показывает, как теги Open Graph выглядят в социальных сетях.
Как использовать Предпросмотр Open Graph?
Введите информацию OG-тегов (заголовок, описание, URL изображения).
Выберите платформу для предпросмотра (Facebook, Twitter и т. д.).
Проверьте предпросмотр в реальном времени и оптимизируйте отображение.
Часто задаваемые вопросы о Предпросмотр Open Graph
Какой рекомендуемый размер OG-изображения?
Facebook рекомендует 1200×630px, а Twitter — 1200×628px. Создание изображений размером 1200×630px обычно хорошо работает на большинстве платформ.
Что произойдёт без OG-тегов?
Социальные сети будут произвольно извлекать заголовок, описание и изображения с вашей страницы, что может привести к отображению непреднамеренного содержимого. OG-теги дают вам точный контроль над тем, что появляется при шеринге.
Я исправил OG-теги, но при шеринге по-прежнему показывается старая картинка.
Потому что каждая площадка кеширует превью, прочитанное в первый раз, иногда на дни и недели. Sharing Debugger у Facebook, Post Inspector у LinkedIn и валидатор карточек у X позволяют запросить повторное считывание этого URL, и превью обновляется сразу. Для мессенджеров без такого инструмента обычно добавляют к ссылке что-то вроде ?v=2, чтобы она считалась новым адресом.
На что обратить внимание, размещая текст на OG-изображении?
Рекомендуемый размер — 1200×630 px, но площадки по-разному обрезают края, поэтому важные слова держите внутри центральных 80%. В ленте изображение сжимается примерно до 300 px по ширине, а значит в оригинале высота букв должна быть не меньше 60 px, чтобы они читались. И поскольку заголовок и так выводится под картинкой, внутри неё лучше поместить короткую фразу, подсказывающую тему, чем повторять сам заголовок.
Советы по эффективному использованию Предпросмотр Open Graph
Для og:image держитесь 1200x630 (1.91:1) — так карточку рисуют VK, Telegram и Facebook.
Ссылки кешируются: после замены картинки прогоните её через Facebook Sharing Debugger.
Без og:title подставляется <title>; отдельный текст для репоста обычно поднимает кликабельность.