Метатеги размещаются в секции <head> и не видны в основном содержимом. Они хранят заголовок документа, описание, правила индексации, кодировку и параметры отображения на устройствах.
Не все метатеги одинаково полезны. Одни влияют на ранжирование в поиске, другие управляют внешним видом ссылки в соцсетях, третьи решают технические задачи. Из всего разнообразия практически значимыми остаются пять-шесть элементов.
Что в статье
Где в HTML-коде находится метатег
Все метатеги размещаются в служебной секции <head> HTML-документа. Браузер обрабатывает эту секцию до рендеринга видимой части страницы.
Базовые метатеги в секции <head> — браузер читает этот код до рендеринга видимой части страницы
Большинство метатегов используют два атрибута: name (имя тега) и content (его значение). Для отдельной группы тегов вместо name используется атрибут http-equiv. Тег <title> устроен иначе: содержит текст напрямую, без атрибутов.
Базовый набор метатегов выглядит так:
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Заголовок страницы — Название сайта</title>
<meta name="description" content="Краткое описание содержимого страницы.">
<meta name="robots" content="index, follow">
</head>Каждая строка несёт конкретную функцию. Первая задаёт кодировку документа, вторая управляет масштабом на мобильных устройствах, третья формирует заголовок в браузере и поисковой выдаче, четвёртая описывает страницу для сниппета, пятая управляет индексацией и переходом по ссылкам.
Какие метатеги влияют на SEO
Не все метатеги одинаково полезны для поискового продвижения. Title напрямую влияет на ранжирование и кликабельность в выдаче. Description не входит в факторы ранжирования, но формирует сниппет в результатах поиска и влияет на CTR. Google официально не использует keywords, а в Яндексе этот метатег имеет минимальный вес.
Из всего разнообразия метатегов практически значимыми для SEO остаются пять-шесть элементов. Остальные либо устарели, либо решают узкие технические задачи.
Title: заголовок для поисковика и человека
Title — важнейший метатег с точки зрения SEO. Поисковые системы используют его как один из основных сигналов при определении темы страницы и её релевантности поисковому запросу. Одновременно title отображается синей ссылкой в поисковой выдаче и в заголовке вкладки браузера.
Пример корректного title для страницы интернет-магазина: «Купить ноутбук Apple MacBook Air — цены, характеристики | Название магазина». Ключевой запрос стоит в начале, бренд в конце, длина не превышает 60 символов.
Title и description в поисковой выдаче — именно это видит пользователь при поиске
Никогда не доверяйте CMS автоматически генерировать title из названия категории или H1 без проверки шаблона. Я регулярно вижу сайты, где в выдаче стоит что-то вроде «Товары — Главная — Untitled» — просто потому что шаблон не был настроен после запуска. Проверяйте каждую группу страниц вручную до публикации.
— Алексей Ефимов, руководитель SEO «Ефремов Медиа»
Description: описание, которое работает на кликабельность
Description — метатег с кратким описанием страницы. Поисковые системы используют его для сниппета в выдаче, хотя оставляют за собой право использовать текст из контента страницы. Яндекс переписывает description примерно в 40–50% случаев, Google делает это ещё чаще.
Яндекс вправе заменить description на фрагмент текста, который лучше отвечает на запрос пользователя
Description не входит в факторы ранжирования, однако влияет на процент кликов из выдачи. Хороший сниппет увеличивает CTR.
Как правильно составить title и description
Правильный подход строится на трёх принципах: релевантность, уникальность и читаемость. Title должен точно отражать содержимое страницы и включать основной ключевой запрос ближе к началу. Description должен кратко объяснить, что найдёт читатель на странице и чем это ему полезно, без общих слов и повтора title.
Информационная статья. Для информационного контента title формулируется как чёткий ответ на поисковый запрос. Например: «Как составить title и description: правила и примеры». Description раскрывает угол подачи и побуждает прочитать, указывая, что именно найдёт читатель в статье. Хороший description для этой статьи: «Разбираем правила составления title и description для SEO, объясняем, почему они важны для ранжирования и CTR, и показываем реальные примеры».
Страница категории интернет-магазина. Title должен содержать название категории товара и географию, если это важно для поиска. Например: «Купить ноутбуки в Москве — цены и характеристики | ИМ». Description перечисляет ключевые параметры, по которым пользователь выбирает товар: бренды, ценовой диапазон, основные характеристики. Хороший description: «Ноутбуки от Apple, Dell, Lenovo. Цены от 25 000 до 150 000 ₽. Доставка по Москве за 1 день. Гарантия производителя на все модели».
Карточка товара. Title обычно содержит название модели товара и бренд, а также основной параметр, который отличает эту модель (объём, размер, цвет). Description описывает ключевые характеристики товара и его наличие. Например, title: «Ноутбук Apple MacBook Air 13 M2 256GB Silver», description: «Ноутбук от Apple с процессором M2, 8 ГБ памяти, экран 13 дюймов. В наличии, доставка завтра».
Чего избегать: дублировать title и description друг в друга, использовать одинаковые шаблоны для сотен страниц без переменных, добавлять ключевые фразы через запятую без связного текста, превышать рекомендуемую длину, оставлять поля пустыми.
Для крупных интернет-магазинов с тысячами карточек вручную прописать уникальные title и description нереально. Здесь работают шаблоны с динамическими переменными: [название товара], [бренд], [цена], [регион]. Главное — тестировать шаблон на десяти-двадцати страницах до массового применения и проверять, что итоговый текст не выглядит как машинно сгенерированный набор слов.
— Алексей Ефимов, руководитель SEO «Ефремов Медиа»
Meta robots: контроль над индексацией
Метатег robots сообщает поисковым роботам, как обращаться с конкретной страницей. Он размещается в <head> и содержит одну или несколько директив через запятую. Если метатег robots отсутствует, поисковик по умолчанию применяет index, follow, то есть разрешает индексацию и переход по ссылкам.
Noindex в метатеге работает только если страница доступна для сканирования (открыта в robots.txt). Если страница закрыта директивой Disallow в robots.txt, робот не посетит её и метатег не прочитает.
Canonical: сигнал о главном URL при дублях
Canonical размещается в <head> рядом с другими метатегами и указывает главный URL страницы
Тег <link rel="canonical"> формально не является метатегом в строгом смысле HTML-спецификации, но функционально работает в той же логике: размещается в <head> и сообщает роботу, какой URL считать основным при наличии дублей.
Google называет canonical «сигналом», а не директивой — в спорных ситуациях поисковик может его проигнорировать и выбрать другой URL самостоятельно, если считает это более обоснованным.
Технические метатеги: charset, viewport, http-equiv
Технические метатеги не влияют на ранжирование напрямую. Но без них страница некорректно отображается в браузере или на мобильных устройствах, показатель отказов растёт, пользовательские сигналы ухудшаются.
Charset задаёт кодировку документа. Стандарт для всех современных сайтов — UTF-8: эта кодировка корректно передаёт все языки, включая кириллицу. Запись выглядит так: <meta charset="UTF-8">. Без charset или при использовании устаревшей windows-1251 браузер неправильно интерпретирует символы — вместо русского текста пользователь видит нечитаемые знаки.
Viewport управляет масштабом и шириной отображения страницы на мобильных устройствах. Стандартная запись: <meta name="viewport" content="width=device-width, initial-scale=1.0">. Атрибут width=device-width устанавливает ширину viewport равной ширине экрана устройства, initial-scale=1.0 задаёт начальный масштаб без увеличения.
Google официально подтверждает: viewport сигнализирует о том, что страница оптимизирована для мобильных. Без него поисковик считает страницу неадаптированной, а с 2019 года именно мобильная версия приоритетна для индексации (mobile-first indexing).
Http-equiv имитирует HTTP-заголовок на уровне HTML. Чаще всего встречаются два рабочих варианта: refresh для автоматической переадресации через заданное число секунд и content-type для объявления типа документа (в HTML5 заменён более коротким атрибутом charset). Google поддерживает тег refresh, но рекомендует вместо него серверный редирект: он обрабатывается надёжнее и не вводит пользователей в заблуждение.
Author задаёт автора документа. Поисковые системы его не учитывают при ранжировании — он встречается в ряде CMS и корпоративных шаблонов как часть внутренней структуры метаданных.
Как поисковый робот читает секцию head
Процесс обработки метатегов устроен иначе, чем многие представляют, — и это порождает практические ошибки в работе.
JS-рендеринг и очередь обхода. Краулеры Google и Яндекса загружают HTML-документ и разбирают секцию <head> до начала рендеринга JavaScript. Это значит, что метатеги, которые добавляются динамически через JS, при первом обходе могут быть не считаны — особенно на сайтах, построенных на React, Vue или Angular без серверного рендеринга (SSR).
Google обрабатывает JS-рендер, но в очереди второго обхода — это занимает от нескольких дней до нескольких недель. Официальная документация Google прямо предупреждает: при изменении метатегов через JavaScript результат нужно внимательно проверять.
Дублирующийся title. Если на странице несколько тегов <title>, браузер отображает первый. Google по задокументированному поведению выбирает любой из них или формирует заголовок из H1. Дублирующийся title — источник непредсказуемых сниппетов в выдаче.
Регистр атрибутов. Атрибуты name и content обрабатываются без учёта регистра — это прямо зафиксировано в документации Google. Директивы NOINDEX и noindex работают одинаково. Об этом нужно помнить при ручном редактировании кода или выгрузке данных из сторонних систем.
Метатеги для социальных сетей: Open Graph и Twitter Card
Open Graph и Twitter Card — два протокола метаданных, которые управляют тем, как страница выглядит при публикации ссылки во ВКонтакте, Telegram, Facebook и других платформах. Без них сеть сама выбирает заголовок, изображение и описание, нередко с неудовлетворительным результатом.
Open Graph
Open Graph был разработан Facebook и поддерживается большинством современных платформ. Основные теги: og:title (заголовок превью), og:description (описание), og:image (изображение), og:url (канонический URL), og:type (тип контента: article, website, product). Изображение для превью рекомендуется использовать размером 1200×630 пикселей — это оптимальный формат для большинства платформ. Синтаксис Open Graph использует атрибут property, а не name, как в стандартных метатегах.
Twitter Card
Twitter Card использует собственный синтаксис через атрибут name: основные теги: twitter:card, twitter:title, twitter:description, twitter:image. Тип summary_large_image даёт крупное изображение под заголовком, summary — компактный вариант с миниатюрой.
Open Graph и SEO-метатеги — разные сущности, их нельзя смешивать. Я видел проекты, где разработчики прописывали og:title в расчёте на то, что Google его подхватит. Это не работает. Поисковые роботы читают <title> и <meta name="description">, а Open Graph предназначен исключительно для социальных платформ и мессенджеров. Оба блока нужны независимо друг от друга.
— Алексей Ефимов, руководитель SEO «Ефремов Медиа»
Типичные ошибки при работе с метатегами
Одни и те же ошибки воспроизводятся на разных сайтах независимо от их размера и тематики.
Дублирование title и description. Возникает, когда CMS генерирует метатеги по одному шаблону для целых разделов. Страницы пагинации, фильтров, тегов и архивов получают одинаковые заголовки. Поисковик воспринимает это как признак низкого качества и понижает позиции раздела.
Google Search Console фиксирует страницы с одинаковыми заголовками — это отправная точка для устранения дублей
Отсутствие метатегов на важных страницах. Это происходит со страницами, добавленными вне основного рабочего процесса. Если title пуст, Google сформирует его из URL или первого текста на странице — результат непредсказуем.
Переспам ключевых слов в title. Строка вида «Купить диван купить недорого диван Москва цена диваны» читается как спам и поисковиком, и пользователем. Google заменит такой title на свой вариант.
Конфликт между noindex и Disallow. Конфликт приводит к странному результату: страница может быть проиндексирована по URL без содержимого. Чтобы надёжно исключить страницу из индекса, нужно держать её открытой для сканирования и прописать noindex в метатеге.
Отдельно стоит упомянуть метатег keywords. Его заполнение не приносит пользы, потому что Google официально его не использует.
Как проверить метатеги сайта
Для проверки метатегов существует несколько надёжных инструментов, каждый из которых решает свою задачу.
Просмотр исходного кода страницы. Это самый быстрый способ проверить метатеги конкретного URL. В браузере нажимают Ctrl+U, ищут секцию <head> и проверяют наличие нужных тегов. Это подходит для точечной проверки, но не для полного аудита.
Google Search Console. Показывает, как Google видит title и description каждого URL. Предупреждает о дублях в разделах «Покрытие» и «Эффективность». Яндекс Вебмастер выполняет то же для Яндекса. Оба инструмента бесплатны.
Screaming Frog SEO Spider. Краулер сканирует весь сайт и выводит все метатеги с информацией о длине, дублях и пустых значениях. Бесплатная версия ограничена 500 URL, чего достаточно для большинства задач.
Screaming Frog показывает все метатеги в одной таблице — удобно для выявления пустых значений и дублей
Инструмент «Проверить URL» в Google Search Console. Показывает, как Google отрендерил страницу, включая HTML после выполнения JavaScript. Это важно для сайтов на React и Vue, где метатеги часто генерируются кодом и краулер может их пропустить.
Аудит метатегов нужно проводить при каждом крупном обновлении сайта, смене CMS или добавлении новых разделов. Для магазинов с динамическими каталогами — не реже раза в месяц, потому что автоматически созданные страницы фильтров и тегов часто появляются без корректных метатегов.
FAQ
Какой длины должен быть title?
Title рекомендуется делать 50–60 символов. Google обрезает заголовки, превышающие около 600 пикселей в выдаче.
Могу ли я использовать одинаковый description для нескольких страниц?
Нет. Одинаковые description — сигнал низкого качества. Каждая страница должна иметь уникальное описание, соответствующее её содержимому.
Влияет ли метатег keywords на ранжирование?
Google официально не использует keywords. В Яндексе этот метатег имеет минимальный вес. Его заполнение не обязательно.
Что делать, если забыл прописать title или description?
Google сформирует их из URL или первого текста на странице. Результат редко бывает удачным, поэтому лучше заполнять эти поля вручную.
Нужны ли Open Graph метатеги, если я не размещаю ссылки в соцсетях?
Open Graph улучшает внешний вид страницы при публикации ссылки во ВКонтакте, Telegram, Facebook и других платформах. Даже если автор не публикует ссылки, пользователи могут ими поделиться, поэтому рекомендуется прописать эти метатеги.
В чём разница между robots.txt и метатегом robots?
Robots.txt закрывает страницу для сканирования (краулер вообще её не посещает). Метатег robots даёт указания при сканировании (краулер посещает страницу и читает директиву). Для надёжного исключения нужны оба механизма.
Свежие статьи