Главная / Маркетинг / SEO / Генератор мета-тегов

Генератор мета-тегов

Соберите title, description, Open Graph и Twitter Card — инструмент покажет живой предпросмотр в Google и соцсетях и выдаст готовый HTML-код для вставки в head. Всё в браузере.

Как это работает: заполните поля — увидите, как страница будет выглядеть в Google и соцсетях. Инструмент проверяет длину title и description, подсказывает, что исправить, и генерирует готовый блок <meta>-тегов для вставки в <head>. Ничего не отправляется на сервер.

Title — главный заголовок в поиске 0 / 60

Description — описание под заголовком 0 / 160

URL страницы

Название сайта

URL изображения — для соцсетей

Язык страницы

Тип страницы

Twitter / X — @аккаунт

Тип Twitter Card

Robots

📄 Готовый код для <head>

Зачем нужны шаблоны: разные типы страниц требуют разной структуры title и description. Выберите подходящий шаблон — он подставит пример, который вы адаптируете под свой контент. Шаблоны не заменяют ручную работу, а дают отправную точку.

💡 Совет: после выбора шаблона не забудьте подставить свою ключевую фразу из подбора ключевых слов — в начало title и в первое предложение description.

Зачем нужен чек-лист: мета-теги — это не только title и description. Полный набор включает Open Graph, Twitter Card, canonical, robots и валидацию. Прогресс сохраняется в браузере.

Выполнено

Осталось

Прогресс

Как собрать мета-теги

Четыре шага — от заполнения до вставки в код

Заполните поля

Введите title, description, URL, название сайта и картинку. Следите за счётчиками: title — до 60, description — до 160 символов.

Проверьте превью

Посмотрите, как страница будет выглядеть в Google и соцсетях. Если что-то обрезается или выглядит слабо — поправьте в полях.

Скопируйте код

Нажмите «Сгенерировать» — получите готовый блок <meta> для вставки в <head>. Скопируйте или скачайте файл.

Вставьте и проверьте

Добавьте код в <head> страницы. Проверьте результат в аудите сайта — все теги должны определиться.

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

Что важно знать о мета-тегах

Какие мета-теги обязательно нужны на странице?

Минимум: title, description, viewport, charset, canonical. Для соцсетей: og:title, og:description, og:image, og:url. Для Twitter/X: twitter:card, twitter:title, twitter:description, twitter:image. Дополнительно: robots (если нужно закрыть от индексации), og:type, og:locale, og:site_name.

Почему именно 60 и 160 символов?

Google обрезает title примерно на 580–600 пикселях, что в среднем соответствует 55–60 символам латиницы. Для description лимит — около 920 пикселей, или 155–160 символов. Кириллица шире латиницы, поэтому для русского текста часто ориентир: title — до 55, description — до 150. Счётчики в инструменте подсвечивают переход за границу красным.

Что важнее — title или description?

Title — важнее для ранжирования и кликов. Google использует его как один из ключевых сигналов о теме страницы и показывает в выдаче первой строкой. Description не влияет на позиции напрямую, но сильно влияет на CTR: хорошее описание повышает кликабельность на 5–15%. Оба поля нужно заполнять под каждую страницу.

Можно ли менять мета-теги через JavaScript?

Технически можно, но не рекомендуется. Google индексирует первоначальный HTML — без выполнения JS, если только страница не рендерится как SPA. Социальные сети (Facebook, Twitter, Telegram) вообще не выполняют JS и читают только статический HTML. Поэтому мета-теги должны быть в исходном коде страницы, а не догружаться скриптом.

Зачем нужны Open Graph и Twitter Card?

Когда пользователь делится ссылкой в соцсетях или мессенджерах — Telegram, Facebook, VK, LinkedIn — вместо «голой» ссылки появляется карточка: заголовок, описание, картинка. Это формирует доверие и повышает клики. Без OG-тегов соцсеть сама «угадывает» контент, часто неудачно. Twitter Card — то же самое, но для Twitter/X.

Где хранятся мои данные?

Всё хранится локально в вашем браузере через localStorage. Ничего не отправляется на сервер. Это важно, если вы готовите мета-теги для клиента под NDA или в конкурентной нише. Для сохранения используйте кнопки «Скачать .html» или «Скачать .txt».

Зачем нужны мета-теги

Мета-теги — это служебная информация о странице, которую читают поисковые системы и социальные сети. Они не видны пользователю в браузере, но определяют, как страница будет выглядеть в выдаче Google, в превью Telegram, во вкладке VK и в карточке LinkedIn. Правильно заполненные мета-теги — обязательное условие для продвижения.

Из чего состоит полный набор

Title — заголовок в выдаче и во вкладке браузера
Description — описание под заголовком в выдаче
Viewport — адаптация под мобильные устройства
Charset — кодировка страницы
Canonical — «главный» адрес страницы при дублях
Robots — управление индексацией страницы
Open Graph — превью в соцсетях и мессенджерах
Twitter Card — превью в Twitter/X

Правила хорошего title

Длина 30–60 символов: короче — мало информации, длиннее — обрежется
Ключевая фраза — в начале
Уникальный для каждой страницы
Без капса, без «!» в конце, без спама ключами
Читаемый для человека — не набор слов

Правила хорошего description

Длина 120–160 символов: укладывается в сниппет
Ключевая фраза в начале, но не «в лоб»
Отвечает на «что на странице и зачем туда идти»
Побуждает к клику: конкретная польза, цифра, вопрос
Уникальный для каждой страницы

Как работать с генератором

Шаг 1. Соберите семантику — подберите ключевую фразу через подбор ключевых слов.

Шаг 2. Заполните поля и сверьтесь с живым превью Google.

Шаг 3. Скопируйте готовый блок в <head> страницы или шаблона CMS.

Шаг 4. Проверьте страницу через аудит сайта — все теги должны определиться.

Шаг 5. Раз в 3–6 месяцев пересматривайте title и description по слабым страницам — по данным Search Console.

Типичные ошибки

Одинаковый title на всех страницах — поисковик не понимает, чем они различаются
Title длиннее 60 символов — обрезается с многоточием
Description короче 100 или длиннее 160 символов
Дублирование ключа в title и description «через запятую»
Отсутствие og:image — карточка в соцсетях без картинки
Мета-теги вставляются через JS — соцсети их не увидят
Забытый canonical — плодятся дубли страниц

Связка с другими инструментами

Мета-теги — часть SEO-цепочки. Сначала собирается семантика через подбор ключевых слов, затем готовятся теги — здесь, потом всё проверяется через аудит сайта. Когда база готова, можно планировать публикации в контент-плане. Регулярная работа с мета-тегами даёт заметный рост CTR — а значит, и трафика — без дополнительных ссылок.

Безопасность и приватность

Все данные — заполненные поля, шаблоны, прогресс чек-листа — хранятся в вашем браузере. Ничего не отправляется на сервер. Готовый код можно скачать в файл или скопировать в буфер — и вставить в редактор или CMS.