Мета-тег

Оригинальное название: meta tag

Коротко

HTML-элемент meta внутри head, который передаёт сведения о странице — кодировку, описание, директивы для роботов — без отображения на самой странице.

Что такое «Мета-тег»

Элемент <meta> одиночный: у него нет закрывающего тега и содержимого, вся информация лежит в атрибутах. Размещают его в <head>, а тег кодировки — в самом начале: браузер ищет его в первых 1024 байтах документа. Какие теги нужны для продвижения и как они влияют на сниппет, разобрано на странице «Мета-теги». Здесь — техническая сторона: как элемент устроен и как его правильно выводить из кода.

Четыре формы записи

<meta charset="utf-8">
<meta name="description" content="Ремонт техники с выездом">
<meta property="og:title" content="Ремонт техники">
<meta http-equiv="refresh" content="5; url=/new/">
  • charset — кодировка документа, один тег на страницу.
  • name + content — пары «имя — значение»: description, robots, viewport, теги подтверждения прав.
  • property + content — разметка Open Graph для соцсетей и мессенджеров.
  • http-equiv + content — заменитель HTTP-заголовка. Пример выше — мета-редирект через 5 секунд. Если сервер может отправить настоящий HTTP-заголовок, обычно лучше использовать его.

Вывод из PHP без дублей

Значения тегов часто берутся из базы, поэтому их нужно экранировать: кавычка в описании товара иначе обрежет атрибут и сломает разметку. В WordPress теги выводят в хуке wp_head:

add_action('wp_head', function () {
    if (!is_singular()) {
        return;
    }
    $desc = get_post_meta(get_the_ID(), 'seo_desc', true);
    if ($desc) {
        printf('<meta name="description" content="%s">' . "\n", esc_attr($desc));
    }
}, 1);

Перед тем как добавлять такой код, проверьте, не выводит ли description тема или SEO-плагин (о них — в статье про SEO-настройку WordPress). Два тега с одним именем — частая находка при аудите: поисковик возьмёт один из них, и не обязательно нужный. В 1С-Битриксе значения задают через свойства страницы и $APPLICATION->SetPageProperty(), а выводятся они в шаблоне вызовом $APPLICATION->ShowHead().

Как проверить, что ушло в браузер

Инструменты разработчика показывают DOM после работы скриптов, а роботы в первую очередь смотрят исходный ответ сервера. Поэтому надёжнее смотреть сам HTML: «Просмотр кода страницы» в браузере или команда curl -s https://example.ru/ | grep -i '<meta'. Так сразу видно дубли, пустые значения и теги, которые добавляет JavaScript уже после загрузки.

Обновлено:

Все термины раздела «Backend»

Что будем искать? Например,Продвижение