Мета-теги страницы: какие нужны сайту и как их заполнить

Мета-теги — служебные строки в разделе head, которые сообщают поисковику и браузеру, о чём страница и как с ней обращаться. Для SEO важнее всего title и мета тег description: из них Яндекс и Google собирают сниппет. Ещё нужны robots, viewport и charset, а keywords Google не читает вовсе.

Что такое мета-теги и где они стоят в коде

Мета-теги — элементы meta в разделе head HTML-кода. Посетитель их не видит, а робот читает при каждом обходе. Яндекс формулирует их роль прямо: метатеги задают метаданные страниц, и это влияет на то, как страница индексируется, ранжируется и показывается в результатах поиска.

Типичная «шапка» страницы выглядит так:

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Пластиковые окна в Новороссийске — производство и монтаж</title>
  <meta name="description" content="Окна ПВХ под заказ: замер, производство, монтаж. Расчёт по фото и выезд замерщика.">
  <meta name="robots" content="index, follow">
</head>

Формально title — отдельный элемент, а не meta, но в SEO его считают главным мета-тегом: он живёт рядом, заполняется в тех же настройках CMS и решает ту же задачу. Атрибут name говорит, что это за тег, атрибут content хранит значение.

Писать код руками обычно не нужно. В большинстве CMS у страницы есть поля «Заголовок окна браузера» и «Описание», а Google прямо советует искать в своей системе управления инструкцию, как изменять раздел head.

Мета-теги не видны посетителю, но именно по ним поисковик решает, как подписать вашу страницу в выдаче.

Какие мета-теги учитывают Яндекс и Google?

Списки поддерживаемых тегов у поисковиков почти совпадают, но есть важное расхождение — keywords. Яндекс пишет, что этот тег может влиять на соответствие страницы поисковым запросам. Google, наоборот, заявляет, что метатеги keywords не используются в его поиске и не влияют ни на индексирование, ни на ранжирование.

Остальные мета-теги поисковики пропускают. Google так и пишет: можно использовать любые теги meta для своих задач, но его роботы будут игнорировать неизвестные им теги. Это касается, например, author, copyright, generator и revisit-after, которые до сих пор вставляют некоторые шаблоны.

Мнение. Если сайт продвигается в обоих поисковиках, keywords можно заполнить двумя-тремя фразами без повторов: Яндекс его читает, а Google просто пропустит. Тратить время на подбор длинного списка не стоит.

Мета тег title: как написать заголовок страницы

Title — самый весомый из мета-тегов: Яндекс пишет, что информация в нём в основном влияет на решение пользователя перейти на сайт. Заголовок должен называть то, что есть на странице, и отличать её от соседних.

Рекомендации Яндекса и Google сходятся почти дословно:

• Конкретика вместо общего слова — не «Главная» и не «Контакты», а то, чем страница отличается от других.
• Без перечня ключей — несколько важных фраз без повторов. Оба поисковика предупреждают, что заголовок, набитый ключами, может быть расценён как спам.
• Шаблон только с реальными данными — «отзывы» и «фото» подставляются в заголовок карточки, только если они есть на странице.
• Бренд в начале или в конце — отделённый двоеточием, дефисом или вертикальной чертой.
• Тот же язык, что у текста — если title и основной текст на разных языках, Google может выбрать для заголовка другой текст.

Длину жёстко не ограничивает ни один поисковик. Яндекс пишет, что длина заголовка ограничена шириной экрана устройства пользователя. Google добавляет, что длина элемента title не ограничена, но ссылка-заголовок в выдаче обрезается под ширину экрана. Поэтому главное ставьте в начало: хвост может не поместиться.

Факт. Ни Яндекс, ни Google не задают предельную длину title: заголовок в выдаче обрезается под ширину экрана устройства.

Как составить мета тег description?

Description — короткий рассказ о странице, который может попасть в сниппет под заголовком. Задача описания — дать человеку больше информации, чем вмещает title, и убедить его перейти. Ни Яндекс, ни Google не обещают показывать его всегда: в выдачу идёт тот текст, который точнее отвечает на запрос.

Что советует Яндекс:

Google добавляет, что описание не обязано состоять из законченных предложений. Для записи блога уместны автор и дата, для товара — цена, производитель и возрастная группа. Важное ставьте в начало: длину описания поисковики тоже режут под ширину экрана, а Яндекс прямо называет «важное в конце» признаком плохого метаописания.

Пример для страницы услуги: «Разработка сайта на 1С-Битрикс в Новороссийске: корпоративные сайты и магазины, интеграция с 1С, поддержка после запуска». В нём есть услуга, город и состав работ, и ни одно слово не повторяет title дословно.

Почему поиск показывает не тот заголовок и описание?

Яндекс и Google собирают сниппет сами, а title и description для них — главная, но не единственная подсказка. Поэтому один и тот же сайт по разным запросам может выглядеть в выдаче по-разному, и это не ошибка.

Яндекс строит заголовок и описание из содержимого title, метатега description, текста страницы с учётом микроразметки, а также из данных Яндекс Маркета и текстов ссылок на страницу с других сайтов. Google перечисляет ещё больше источников: title, основной видимый заголовок, заголовки h1 и ниже, тег og:title, выделенный текст, текст ссылок и структурированные данные WebSite. А описания, по словам Google, чаще всего создаются на основе самой страницы.

Google объясняет, когда он заменяет title: заголовок пустой или заполнен частично, устарел, не соответствует содержанию, повторяется на многих страницах или на странице несколько одинаково заметных заголовков. Исправить ситуацию помогает сам title, а не попытка «уговорить» поиск: сделайте его точным и выделите основной заголовок страницы в первом h1.

После правки не ждите мгновенного результата. Google пишет, что изменения учтут после повторного сканирования, и на это может потребоваться от нескольких дней до нескольких недель.

Если поиск переписал ваш title, сначала проверьте, совпадает ли он с главным заголовком страницы и не повторяется ли на соседних страницах.

Meta robots, viewport и другие служебные теги

Служебные мета-теги не влияют на сниппет, но без них страница может выпасть из поиска или сломаться на телефоне. Их проверяют в первую очередь при техническом аудите.

• robots — управляет индексированием. Значение noindex убирает страницу из поиска, nofollow запрещает роботу переходить по ссылкам на ней. По умолчанию действуют index и follow, их можно не писать. Как закрывать от поиска целые разделы, разобрали в статье про файл robots.txt.
• viewport — подгоняет ширину страницы под экран. Без него мобильные браузеры по умолчанию показывают страницу в ширину экрана компьютера.
• charset — задаёт кодировку. Google рекомендует по возможности использовать UTF-8.
• refresh — переадресация через заданное время. Google советует применять вместо него серверную переадресацию 301.

У robots есть ловушка. Если страница запрещена в файле robots.txt, Яндекс не увидит метатег noindex на ней: робот просто не загрузит страницу, и директива не сработает. Поэтому страницы, которые нужно убрать из поиска, в robots.txt не закрывают, а помечают noindex.

Факт. Если страница запрещена в файле robots.txt, директива noindex в её метатеге robots для Яндекса не действует.

Шаблоны мета-тегов для каталога и карточек

На сайте с сотнями товаров писать title и description руками нереально, поэтому их собирают по шаблону из полей базы. Яндекс сам советует так делать: для магазина можно брать в описание размер, вес, доступность и другие свойства товара.

Шаблон работает, только если подставляет то, что отличает страницы. Вот как выглядит слабый и рабочий вариант для карточки:

Слабый вариант Яндекс прямо приводит как малоинформативный: в нём меняется одно название, а хвост одинаков на всех страницах. Google называет такие заголовки шаблонными и тоже советует подставлять слова «видео» или «отзывы», только когда этот контент на странице действительно есть.

Шаблоны не помогут, если у товаров пустые характеристики. Тогда все карточки получат почти одинаковые мета-теги, и Вебмастер покажет их дублями. Сначала заполните свойства в базе, потом стройте шаблон.

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

Как проверить мета-теги на сайте?

Быстрее всего проверить одну страницу через исходный код: нажмите Ctrl+U в браузере и найдите title и meta name="description". Но так видна одна страница, а ошибки обычно массовые — их ищут в кабинетах поисковиков.

В Яндекс Вебмастере откройте «Индексирование -> Заголовки и описания». Там видно число одинаковых заголовков и описаний, а на вкладках title и description — группы страниц с повторами. Если тегов нет или дублей много, Вебмастер предупредит об этом в «Оптимизация сайта -> Диагностика сайта». После исправления информация в Вебмастере обновится в течение недели после очередного визита робота. Как добавить сайт в кабинет, описано в инструкции как добавить сайт в Яндекс Вебмастер.

В Google мета-теги отдельной страницы проверяют инструментом проверки URL в Search Console. Он показывает, какой код получил робот, — это важно, если теги вставляет JavaScript. Google не рекомендует внедрять или менять мета-теги скриптом и после такой обработки советует внимательно проверить результат.

Для сайта целиком подойдёт любой SEO-краулер: он обойдёт страницы и выгрузит таблицу с title, description и robots по каждому адресу.

С чего начать, если мета-теги не заполнены

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

Затем проверьте служебные теги: viewport на всех страницах, noindex только там, где он нужен, кодировка UTF-8. Отправьте важные страницы на переобход и через неделю сверьте отчёт «Заголовки и описания».

Если на сайте тысячи страниц и мета-теги рождаются шаблонами CMS, правка обычно нужна в коде. Такие задачи мы закрываем в рамках SEO-аудита: находим, где шаблон даёт дубли и пустые теги, и настраиваем генерацию так, чтобы новые страницы получали правильные мета-теги сразу.

Источники

• Метатеги — Яндекс
• Как правильно написать title — Яндекс
• Как правильно составить description — Яндекс
• Одинаковые заголовки и описания (дубли) — Яндекс
• Заголовок и описание — Яндекс
• Метатеги и атрибуты, которые распознаются роботами Google — Google
• Как управлять выбором ссылок-заголовков в результатах поиска — Google
• Создание информативных описаний страниц для результатов поиска — Google