Генератор Open Graph мета-тегов
Создание OG-тегов для корректного отображения страниц при шеринге в соцсетях и мессенджерах.
Что такое Open Graph мета-теги
Open Graph (OG) — это протокол разметки, который определяет, как ваша страница будет выглядеть при шеринге в социальных сетях и мессенджерах. Без OG-тегов платформы сами решают, какую картинку, заголовок и описание показать — и результат часто выглядит неаккуратно.
OG-теги поддерживают все основные платформы: ВКонтакте, Telegram, LinkedIn, Pinterest, Slack, WhatsApp и другие. Правильно настроенные теги увеличивают кликабельность ссылок при шеринге.
Основные теги
- og:title — заголовок страницы (может отличаться от HTML title)
- og:description — описание для соцсетей (обычно короче, чем meta description)
- og:image — изображение-превью (рекомендуемый размер: 1200x630 пикселей)
- og:url — канонический URL страницы
- og:type — тип контента (website, article, product)
- og:site_name — название сайта
- og:locale — язык контента (ru_RU для русского)
Рекомендации по изображению
- Минимальный размер: 600x315 пикселей
- Рекомендуемый размер: 1200x630 пикселей (соотношение 1.91:1)
- Формат: JPG или PNG, размер файла до 5 МБ
- Текст на изображении не должен занимать более 20% площади
Частые вопросы
Обязательны ли OG-теги?
Нет, они не обязательны для работы сайта или SEO. Но без них при шеринге ссылки в соцсетях и мессенджерах будет показан случайный контент со страницы — часто с неподходящей картинкой или обрезанным текстом. OG-теги позволяют контролировать, как выглядит ваша ссылка.
Какой размер картинки нужен для og:image?
Рекомендуемый размер — 1200x630 пикселей (соотношение сторон 1.91:1). Минимальный — 600x315. Формат JPG или PNG. Файл не должен превышать 5 МБ. Если картинка слишком маленькая, некоторые платформы могут показать её в виде маленькой миниатюры вместо полноразмерного превью.
Чем og:title отличается от HTML title?
HTML title используется поисковыми системами для отображения в выдаче, а og:title — соцсетями для превью при шеринге. Они могут совпадать, но часто лучше сделать og:title короче и более цепляющим, потому что контекст шеринга отличается от поисковой выдачи.
Как проверить OG-теги на сайте?
Используйте расширения браузера вроде Open Graph Preview или онлайн-валидаторы OG-тегов. Эти инструменты покажут, как ваша ссылка будет выглядеть при шеринге, и укажут на ошибки в разметке.