Мета-теги — это элементы HTML-кода, которые передают браузерам, поисковым роботам и другим сервисам дополнительную информацию о странице. Они размещаются в служебной части документа <head> и обычно не отображаются внутри основного содержимого страницы.
С помощью мета-тегов можно:
- кратко описать страницу;
- задать правила индексирования;
- указать кодировку;
- настроить отображение на мобильных устройствах;
- управлять отдельными элементами представления страницы.
В SEO вместе с мета-тегами часто рассматривают элемент <title>. Технически Title является отдельным HTML-элементом, а не мета-тегом, но в практической работе выражение «заполнить мета-теги Title и Description» используется очень широко.
Яндекс учитывает несколько видов метаданных, включая Description, Robots и Viewport. Они помогают системе интерпретировать страницу, управлять индексированием и формировать результат поиска.
Где находятся мета-теги
Мета-теги размещаются внутри элемента <head>:
<head>
<title>Разработка сайтов на 1С-Битрикс</title>
<meta name="description" content="Разрабатываем корпоративные сайты и интернет-магазины на 1С-Битрикс.">
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
</head>
В системах управления сайтом их обычно можно редактировать через административную панель. На крупных проектах часть значений формируется автоматически по шаблонам.
Какие мета-теги особенно важны для сайта
Для SEO и корректной работы страницы чаще всего используются несколько основных элементов.
Title
Title — это HTML-заголовок страницы, который отображается на вкладке браузера и может использоваться поисковой системой как заголовок результата в выдаче.
Title помогает понять:
- основную тему страницы;
- её отличие от других URL;
- соответствие поисковому запросу;
- название товара, услуги или материала.
Яндекс указывает, что Title даёт представление о содержании и релевантности страницы и может стать заголовком сниппета. При этом поисковая система способна сформировать другой заголовок на основе содержимого страницы.
Хороший Title обычно:
- точно описывает конкретную страницу;
- содержит основную тему;
- отличается от Title других страниц;
- читается как нормальная фраза;
- не состоит из повторяющихся ключевых слов;
- соответствует реальному содержанию.
Например:
Плохо:
Сайты, создание сайтов, заказать сайт, разработка сайтов
Лучше:
Разработка сайтов на 1С-Битрикс под задачи бизнеса
Description
Description — это краткое описание страницы, которое поисковая система может использовать при формировании сниппета.
Задача Description — помочь пользователю понять, что он найдёт после перехода.
Хорошее описание:
- передаёт содержание страницы;
- учитывает основную потребность пользователя;
- содержит конкретику;
- отличается от описаний других URL;
- не обещает того, чего нет на странице;
- читается естественно.
Поисковая система не обязана показывать заданный Description. Если другой фрагмент страницы лучше отвечает конкретному запросу, в сниппете может появиться текст из основного содержимого. Google прямо указывает, что формирует описание преимущественно из страницы и использует Description, когда считает его более подходящим.
Robots
Мета-тег Robots сообщает поисковым роботам, можно ли индексировать содержимое страницы и переходить по размещённым на ней ссылкам.
Примеры директив:
-
index— разрешить индексирование; -
noindex— запретить индексирование; -
follow— разрешить переход по ссылкам; -
nofollow— не переходить по ссылкам; -
noarchive— не показывать сохранённую копию; -
nosnippet— не показывать текстовый фрагмент в результате поиска в поддерживающих эту директиву системах.
Пример:
<meta name="robots" content="noindex, follow">
Директивы необходимо использовать осторожно. Случайный noindex на шаблоне раздела может исключить из поиска сотни страниц.
Кроме мета-тега, правила можно передавать через HTTP-заголовок X-Robots-Tag. Такой вариант особенно полезен для PDF-файлов и других документов, у которых нет HTML-раздела <head>.
Viewport
Мета-тег Viewport помогает браузеру правильно отображать страницу на мобильных устройствах.
Распространённый вариант:
<meta name="viewport" content="width=device-width, initial-scale=1">>
Он указывает, что ширина области просмотра должна соответствовать ширине экрана устройства.
Сам по себе Viewport не создаёт адаптивную версию. Для корректного мобильного отображения также нужны подходящая вёрстка, стили и логика интерфейса.
Charset
Charset задаёт кодировку документа:
<meta charset="utf-8">
Правильная кодировка необходима, чтобы браузер корректно показывал буквы, цифры и специальные символы.
Open Graph
Open Graph — набор мета-тегов, который помогает управлять отображением ссылки в социальных сетях и мессенджерах.
Через него можно задать:
- заголовок;
- описание;
- изображение;
- тип содержимого;
- адрес страницы.
Эти данные не заменяют Title и Description для поисковой выдачи. Их основное назначение — оформление публикации при распространении ссылки.
Нужен ли мета-тег Keywords
Keywords предназначен для перечисления ключевых слов страницы:
<meta name="keywords" content="разработка сайтов, 1С-Битрикс, интернет-магазин">
Google официально не использует meta keywords для индексирования и ранжирования. Яндекс по-прежнему перечисляет Keywords среди учитываемых тегов и отмечает, что он может влиять на соответствие страницы запросам. На практике этот тег не относится к приоритетным элементам современной оптимизации.
Заполнение Keywords не компенсирует:
- слабое содержание;
- неправильную структуру;
- технические ошибки;
- отсутствие полезной информации;
- неудачный Title.
Добавлять в него длинный перечень запросов и повторов не имеет смысла.
Чем Title отличается от H1
Title и H1 относятся к одной странице, но решают разные задачи.
- Title размещается в служебной части кода и может использоваться как заголовок результата поиска.
- H1 находится в видимой части страницы и сообщает посетителю название материала или раздела.
Они могут быть близкими по смыслу, но не обязаны полностью совпадать.
Например:
Title:
Мета-теги сайта — что это такое и как влияют на SEO
H1:
Мета-теги сайта: что это такое и для чего они нужны
Такое различие сохраняет единый смысл и позволяет адаптировать каждый элемент под его задачу.
Как правильно составлять Title
При подготовке Title желательно придерживаться нескольких принципов.
- Отразить основную тему страницы.
- Использовать понятные слова аудитории.
- Размещать важную информацию ближе к началу.
- Не перечислять все ключевые фразы.
- Не повторять название компании несколько раз.
- Не использовать одинаковые Title на разных страницах.
- Не добавлять год, цену или регион, если этих данных нет на странице.
- Учитывать, как заголовок будет выглядеть в выдаче.
Фиксированного универсального ограничения по количеству символов нет. Поисковые системы сокращают заголовок с учётом ширины экрана и формата выдачи. Поэтому важнее содержательность и понятность, чем попытка попасть в строгое число знаков.
Как составлять Description
Description должен давать пользователю дополнительную информацию, а не просто повторять Title.
В описание можно включить:
- основной предмет страницы;
- особенности услуги или товара;
- формат материала;
- значимое условие;
- ожидаемый результат;
- регион, если он действительно важен.
Например:
Title:
Техническая поддержка сайтов на 1С-Битрикс
Description:
Исправляем ошибки, обновляем модули, дорабатываем функциональность и контролируем стабильность сайтов на 1С-Битрикс.
Не следует превращать Description в набор фраз:
поддержка сайта, заказать поддержку, поддержка Битрикс, цена поддержки сайта
Такое описание плохо объясняет содержание страницы и выглядит неестественно.
Как мета-теги влияют на SEO
Мета-теги решают несколько задач:
- помогают поисковой системе понять содержание страницы;
- управляют доступностью для индексирования;
- влияют на представление результата в поиске;
- помогают пользователю выбрать подходящую страницу;
- поддерживают корректное мобильное отображение.
При этом одних мета-тегов недостаточно для продвижения. Хороший Title не заменит полезный материал, а Description не исправит медленную загрузку или неудобную страницу.
Мета-теги работают в сочетании с:
- содержанием;
- структурой;
- заголовками;
- внутренними ссылками;
- техническим состоянием;
- соответствием поисковому намерению.
Автоматические мета-теги на крупных сайтах
В интернет-магазине или каталоге невозможно вручную подготовить метаданные для каждой из десятков тысяч страниц. Поэтому используются шаблоны.
Например, Title карточки товара может собираться из:
- названия модели;
- категории;
- важной характеристики;
- региона;
- названия магазина.
Шаблоны должны формировать понятные и отличающиеся друг от друга значения. Иначе на сайте появятся тысячи одинаковых заголовков и описаний.
Приоритетные категории, услуги и популярные товары желательно дорабатывать вручную.
Ошибки при заполнении мета-тегов
К типичным проблемам относятся:
- одинаковые Title и Description;
- отсутствие основной темы;
- перегрузка ключевыми словами;
- слишком общие формулировки;
- несоответствие содержанию;
-
случайный
noindex; - устаревшие даты и цены;
- автоматические шаблоны с пустыми значениями;
- одинаковые метаданные для вариантов товара;
- полный повтор H1 без дополнительного смысла.
Поисковая система может заменить некорректный Title или Description собственным вариантом. Это не всегда ошибка: заголовок и описание могут меняться в зависимости от запроса пользователя.
Главное о мета-тегах
Мета-теги передают поисковым системам и браузерам служебную информацию о странице.
Наиболее важные элементы:
- Title — название и тема страницы;
- Description — краткое описание;
- Robots — правила индексирования;
- Viewport — настройка области просмотра;
- Charset — кодировка документа.
Грамотно заполненные метаданные помогают поисковым системам точнее интерпретировать страницу, а пользователям — выбирать подходящий результат.
