Мета-теги для SEO: виды, проверка и настройка
Проверка метатегов — первый шаг технического аудита любого сайта. Мета-теги передают поисковым системам важную информацию о странице: её заголовок, описание, правила индексации. Ошибки в мета-тегах приводят к проблемам с ранжированием и отображением в выдаче.
Мета-теги — часть технической оптимизации — подробнее об этом в статье Технический аудит сайта. Мета теги онлайн можно проверить за несколько секунд с помощью специальных сервисов. В этом материале разберём все виды мета-тегов, научимся их проверять, настраивать и избегать типичных ошибок.
Что такое мета-теги
Мета-теги — это HTML-элементы, которые содержат метаданные о веб-странице. Они не отображаются на самой странице, но читаются поисковыми роботами, браузерами и социальными сетями.
Мета-теги располагаются в секции <head> HTML-документа:
<!DOCTYPE html>
<html>
<head>
<title>Заголовок страницы</title>
<meta name="description" content="Описание страницы">
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
...
</body>
</html>
Как работают мета-теги:
- Поисковые роботы читают мета-теги при индексации страницы
- Title и Description формируют сниппет в выдаче
- Robots указывает правила индексации
- Viewport настраивает отображение на мобильных
- OG-теги определяют внешний вид при шеринге в соцсетях
Виды мета-тегов
Мета-теги делятся на несколько категорий по назначению.
| Мета-тег | Назначение | Влияние на SEO |
|---|---|---|
| Title | Заголовок страницы в выдаче | Высокое |
| Description | Описание в сниппете | Среднее (влияет на CTR) |
| Robots | Управление индексацией | Высокое |
| Canonical | Указание основной версии | Высокое |
| Viewport | Настройка мобильной версии | Высокое (Mobile-First) |
| OG-теги | Отображение в соцсетях | Низкое (косвенное) |
| Keywords | Ключевые слова | Нулевое (не учитывается) |
| Author | Автор страницы | Минимальное |
| Charset | Кодировка документа | Техническое |
Фокусируйтесь на Title, Description, Robots, Canonical и Viewport — они критичны для SEO. Keywords можно игнорировать.
Мета-тег Title
Title — важнейший мета-тег для SEO. Он отображается как заголовок страницы в поисковой выдаче и вкладке браузера.
<title>Мета-теги для SEO — проверка, генератор, примеры настройки</title>
Правила заполнения Title:
- Длина: 50-60 символов (до 600 пикселей в Google)
- Основной ключ в начале заголовка
- Уникальный для каждой страницы
- Отражает содержание страницы
- Привлекательный для кликов
Примеры хороших Title:
- «Купить iPhone 15 Pro — цена от 89 990 ₽ | Магазин»
- «Как выбрать ноутбук для работы — гайд 2025»
- «SEO-продвижение сайтов в Москве — агентство Site.ru»
Подробнее о Title — в статье Тег Title — как правильно заполнить.
Мета-тег Description
Description — описание страницы, которое отображается в сниппете под заголовком. Напрямую не влияет на ранжирование, но влияет на CTR.
<meta name="description" content="Проверка мета-тегов сайта онлайн. Виды мета-тегов: robots, viewport, og. Генератор мета-тегов. Как добавить метатег в код сайта.">
Правила заполнения Description:
- Длина: 150-160 символов (до 920 пикселей)
- Включает ключевые слова (они выделяются в выдаче)
- Содержит призыв к действию или УТП
- Уникальный для каждой страницы
- Раскрывает суть содержимого
Важно: Google может игнорировать ваш Description и сгенерировать свой из контента страницы. Это происходит, если описание нерелевантно запросу.
Подробнее о Description — в статье Мета-тег Description — как заполнить.
Мета-тег robots
Мета тег robots управляет поведением поисковых роботов: индексировать страницу или нет, переходить по ссылкам или нет.
<meta name="robots" content="index, follow">
Директивы robots:
index— разрешить индексацию (по умолчанию)noindex— запретить индексациюfollow— переходить по ссылкам (по умолчанию)nofollow— не переходить по ссылкамnone— эквивалент noindex, nofollownoarchive— не сохранять кэш страницыnosnippet— не показывать сниппет в выдаче
Примеры использования:
<!-- Стандартная страница -->
<meta name="robots" content="index, follow">
<!-- Закрыть от индексации -->
<meta name="robots" content="noindex, follow">
<!-- Полностью закрыть -->
<meta name="robots" content="noindex, nofollow">
<!-- Для конкретного робота -->
<meta name="googlebot" content="noindex">
<meta name="yandex" content="noindex">
Когда использовать noindex:
- Служебные страницы (авторизация, корзина)
- Дубли и страницы пагинации
- Страницы с тонким контентом
- Результаты внутреннего поиска
Мета-тег viewport
Метатег viewport настраивает отображение страницы на мобильных устройствах. Обязателен для мобильной оптимизации.
<meta name="viewport" content="width=device-width, initial-scale=1">
Параметры viewport:
width=device-width— ширина равна ширине экрана устройстваinitial-scale=1— начальный масштаб 100%maximum-scale=1— запрет увеличения (не рекомендуется)user-scalable=no— запрет масштабирования (не рекомендуется)
Стандартный viewport:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Без метатега viewport мобильный браузер отобразит десктопную версию в уменьшенном виде. Это критично для Mobile-First индексации Google.
Мета-теги Open Graph (og)
Мета теги og (Open Graph) определяют, как страница выглядит при публикации в социальных сетях: Facebook, VK, Telegram, LinkedIn.
<meta property="og:title" content="Мета-теги для SEO — полный гайд">
<meta property="og:description" content="Проверка, настройка и генерация мета-тегов">
<meta property="og:image" content="https://site.ru/images/meta-tags.jpg">
<meta property="og:url" content="https://site.ru/blog/meta-tegi-dlya-seo/">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Site.ru">
Основные OG-теги:
og:title— заголовок (может отличаться от Title)og:description— описание для соцсетейog:image— картинка превью (рекомендуется 1200×630 px)og:url— канонический URL страницыog:type— тип контента (article, website, product)
Twitter Cards:
Для Twitter используются отдельные теги:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Заголовок для Twitter">
<meta name="twitter:description" content="Описание">
<meta name="twitter:image" content="https://site.ru/image.jpg">
Мета-тег canonical
Canonical указывает поисковику основную версию страницы при наличии дублей. Технически это не мета-тег, а link-элемент, но его часто относят к мета-тегам.
<link rel="canonical" href="https://site.ru/page/">
Когда использовать canonical:
- Страницы доступны по нескольким URL (с www и без)
- Страницы с GET-параметрами (?sort=price, ?page=2)
- Печатные версии страниц
- Синдицированный контент
- Страницы с незначительными отличиями
Пример:
<!-- На странице site.ru/product/?color=red -->
<link rel="canonical" href="https://site.ru/product/">
Подробнее о canonical — в статье Тег canonical — как настроить.
Проверка мета-тегов сайта
Проверка метатегов — регулярная задача SEO-специалиста. Проверить метатеги можно несколькими способами.
Способ 1: Просмотр кода страницы
- Откройте страницу в браузере
- Правый клик → «Просмотреть код страницы» (Ctrl+U)
- Найдите секцию
<head> - Изучите мета-теги
Способ 2: DevTools
- Откройте DevTools (F12)
- Перейдите на вкладку Elements
- Раскройте секцию
<head> - Найдите нужные мета-теги
Способ 3: SEO-расширения для браузера
- SEO Meta in 1 Click — показывает все мета-теги в удобном виде
- MozBar — Title, Description, заголовки
- SEOquake — комплексный анализ страницы
Мета-теги онлайн — сервисы проверки
Мета теги онлайн можно проверить через специальные сервисы. Метатеги онлайн-сервисы анализируют и показывают ошибки.
Бесплатные онлайн-сервисы:
- Яндекс Вебмастер — раздел «Страницы в поиске» показывает, как Яндекс видит ваши мета-теги
- Google Search Console — отчёт «Эффективность» показывает отображаемые Title
- Metatags.io — проверка OG-тегов и превью для соцсетей
- OpenGraph.xyz — визуализация OG-тегов
- Facebook Sharing Debugger — как Facebook видит вашу страницу
Платные инструменты:
- Screaming Frog — массовая проверка всех страниц сайта
- Sitebulb — детальный аудит мета-тегов
- Netpeak Spider — российский аналог Screaming Frog
Как посмотреть мета-теги сайта
Как посмотреть мета теги сайта быстро и удобно? Вот пошаговая инструкция.
Через DevTools (рекомендуется):
- Откройте нужную страницу
- Нажмите F12 или правый клик → «Исследовать»
- Перейдите на вкладку Elements (Элементы)
- Найдите
<head>в дереве DOM - Раскройте и изучите мета-теги
Через расширение SEO Meta in 1 Click:
- Установите расширение из Chrome Web Store
- Откройте нужную страницу
- Кликните на иконку расширения
- Увидите все мета-теги в структурированном виде
Через curl (для разработчиков):
curl -s https://site.ru | grep -E '<(title|meta)'
Генератор мета-тегов
Генератор мета тегов помогает быстро создать правильную разметку. Генератор мета тегов для сайта особенно полезен новичкам.
Онлайн-генераторы:
- Metatags.io — генератор с превью для Google, Facebook, Twitter
- HEY META — простой генератор основных тегов
- SEOptimer Meta Tag Generator — генерация с рекомендациями
- Webcode.tools — комплексный генератор HTML-мета-тегов
Что генерируют:
- Title и Description
- OG-теги (Open Graph)
- Twitter Cards
- Canonical
- Viewport
- Favicon
Пример сгенерированного кода:
<!-- Primary Meta Tags -->
<title>Мета-теги для SEO — гайд</title>
<meta name="title" content="Мета-теги для SEO — гайд">
<meta name="description" content="Полное руководство по мета-тегам">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://site.ru/meta-tags/">
<meta property="og:title" content="Мета-теги для SEO — гайд">
<meta property="og:description" content="Полное руководство">
<meta property="og:image" content="https://site.ru/image.jpg">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://site.ru/meta-tags/">
<meta property="twitter:title" content="Мета-теги для SEO">
Как добавить мета-тег в код сайта
Как добавить метатег в код главной страницы своего сайта? Зависит от CMS или способа создания сайта.
Чистый HTML:
- Откройте HTML-файл страницы
- Найдите секцию
<head> - Добавьте нужные мета-теги перед
</head> - Сохраните файл
<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">
<link rel="canonical" href="https://site.ru/page/">
</head>
WordPress:
- Через SEO-плагин (Yoast, Rank Math): редактируйте поля в блоке SEO под редактором
- Вручную: редактируйте header.php темы или используйте хук wp_head
1С-Битрикс:
- Через административную панель: Контент → Структура сайта → редактирование страницы
- В коде: $APPLICATION->SetTitle(), $APPLICATION->SetPageProperty()
Tilda, Wix, конструкторы:
- В настройках страницы обычно есть поля SEO Title и Description
- Дополнительные теги — через раздел «HTML-код в head»
Парсинг мета-тегов
Парсинг метатегов — массовый сбор мета-тегов со всех страниц сайта. Необходим для аудита крупных сайтов.
Инструменты для парсинга:
Screaming Frog SEO Spider:
- Скачайте и установите программу
- Введите URL сайта и запустите сканирование
- После завершения откройте вкладки: Page Titles, Meta Description, Meta Keywords, Canonicals
- Экспортируйте в Excel для анализа
Используйте Screaming Frog — подробнее об этом в статье SEO-инструменты и сервисы — обзор.
Netpeak Spider:
- Аналогичный процесс
- Русскоязычный интерфейс
- Встроенные отчёты об ошибках
Python (для разработчиков):
import requests
from bs4 import BeautifulSoup
url = "https://site.ru"
response = requests.get(url)
soup = BeautifulSoup(response.text, 'html.parser')
title = soup.find('title').text
description = soup.find('meta', {'name': 'description'})['content']
print(f"Title: {title}")
print(f"Description: {description}")
Ошибки в мета-тегах
Типичные ошибки, которые вредят SEO.
- Дублирующиеся Title и Description. Каждая страница должна иметь уникальные мета-теги. Дубли — сигнал низкого качества
- Слишком длинные или короткие Title. Длинные обрезаются, короткие неинформативны. Оптимум: 50-60 символов
- Пустой Description. Поисковик сам выберет текст — часто неудачно
- Отсутствие viewport. Страница не адаптируется под мобильные устройства
- Неправильный canonical. Указывает на несуществующую страницу или создаёт петлю
- Noindex на важных страницах. Страницы выпадают из индекса
- Спам в keywords. Бессмысленно — тег игнорируется, но выглядит непрофессионально
- Нет OG-тегов. При шеринге в соцсетях страница выглядит непривлекательно
- Несоответствие Title содержанию. Кликбейт приводит к высокому показателю отказов
- Отсутствие charset. Могут быть проблемы с кодировкой
Как избежать ошибок:
- Регулярно проводите аудит мета-тегов
- Используйте шаблоны для генерации (но с уникальными элементами)
- Проверяйте отображение в выдаче через Search Console
- Тестируйте OG-теги перед публикацией
Часто задаваемые вопросы
Какие мета-теги важны для SEO?
Самые важные: Title (заголовок в выдаче), Description (описание в сниппете), robots (управление индексацией), canonical (указание основной версии). Также важны viewport для мобильной версии и OG-теги для соцсетей. Meta keywords Google игнорирует.
Как проверить мета-теги страницы?
Способы: правый клик → «Просмотр кода страницы» → найти в <head>. Или DevTools (F12) → вкладка Elements. Онлайн-сервисы: SEO Meta in 1 Click (расширение), Screaming Frog (массово). В Яндекс Вебмастере — отчёт «Страницы в поиске».
Как добавить мета-тег на сайт?
Мета-теги добавляются в секцию <head> HTML-документа. Формат: <meta name="название" content="значение">. В CMS (WordPress, Битрикс) — через SEO-плагины или поля в редакторе страницы. Для robots: <meta name="robots" content="noindex, nofollow">.
Что такое Open Graph теги?
OG-теги (Open Graph) — мета-теги для соцсетей. Определяют, как будет выглядеть ссылка при шеринге: og:title (заголовок), og:description (описание), og:image (картинка). Без них соцсети сами выберут контент, часто некорректно.
Нужен ли мета-тег keywords?
Нет, Google официально игнорирует meta keywords с 2009 года. Яндекс учитывает его как второстепенный сигнал для редких запросов. Заполнять необязательно, но если заполняете — не спамьте, укажите 3-5 релевантных слов. Время лучше потратить на Title и Description.
Нужна техническая оптимизация сайта?
Проверим и настроим все мета-теги для максимальной видимости в поиске. Закажите Технический аудит сайта.
Проверено экспертом
Статья прошла профессиональную проверку качества
Александра Хилова
SEO-специалист
Области экспертизы:
Теги:
Читайте также
Что такое битые ссылки и как их найти? Проверка сайта на битые ссылки онлайн бесплатно. Как исправить ошибки 404. Инструменты и сервисы.
Что такое noindex и как использовать? Тег meta robots noindex nofollow в HTML. Когда закрывать страницы от индексации. Как исправить ошибки noindex.
Что такое карта сайта sitemap.xml и зачем она нужна? Пошаговая инструкция по созданию. Онлайн-генераторы, примеры кода, настройка для Яндекса и Google.
Как ускорить индексацию сайта в Яндексе и Google? Ускорение индексации: переобход страниц, sitemap, API. Сколько индексируется сайт. Пошаговая инструкция.
Понравилась статья?
Закажите профессиональный SEO-аудит и мы применим эти знания для улучшения вашего сайта.
Заказать аудит