Что такое мета-теги
Мета-теги — это HTML-элементы, которые содержат информацию о странице для поисковых систем и браузеров. Они не отображаются на странице, но используются поисковиками для индексации и отображения в результатах поиска.
Мета-теги помогают: поисковым системам понимать содержание страницы, улучшать отображение в результатах поиска (SERP), увеличивать кликабельность (CTR), управлять индексацией, контролировать поведение поисковых роботов.
Основные мета-теги для SEO
Title (заголовок страницы)
Тег `
` — это заголовок страницы, который отображается во вкладке браузера и в результатах поиска. Это один из важнейших факторов ранжирования.</p>
<p><strong>Требования к Title:</strong></p>
<ul>
<li>Длина: 50-60 символов (оптимально 55)</li>
<li>Содержит ключевое слово в начале</li>
<li>Уникален для каждой страницы</li>
<li>Описательный и привлекательный</li>
<li>Содержит бренд (в конце)</li>
</ul>
<p><strong>Примеры хороших Title:</strong></p>
<ul>
<li>✅ "SEO-продвижение сайтов в Москве | EVARIS"</li>
<li>✅ "Создание сайта под ключ: разработка и дизайн | EVARIS"</li>
<li>❌ "Главная" (слишком общий)</li>
<li>❌ "Страница 1" (неинформативный)</li>
</ul>
<h3>Description (описание страницы)</h3>
<p>Мета-тег `<meta name="description">` — это краткое описание страницы, которое отображается в результатах поиска под заголовком. Хотя Description не влияет напрямую на ранжирование, он критически важен для кликабельности.</p>
<p><strong>Требования к Description:</strong></p>
<ul>
<li>Длина: 150-160 символов (оптимально 155)</li>
<li>Содержит ключевые слова естественным образом</li>
<li>Привлекательный и информативный</li>
<li>Содержит призыв к действию</li>
<li>Уникален для каждой страницы</li>
</ul>
<p><strong>Примеры хороших Description:</strong></p>
<ul>
<li>✅ "SEO-продвижение сайтов от агентства EVARIS. Увеличиваем трафик, улучшаем позиции в Google и Яндекс. Результаты за 3 месяца. Закажите консультацию!"</li>
<li>❌ "Описание страницы" (неинформативный)</li>
</ul>
<h3>Keywords (ключевые слова)</h3>
<p>Мета-тег `<meta name="keywords">` больше не используется поисковыми системами для ранжирования. Google и Яндекс официально заявили, что не учитывают Keywords при ранжировании. Однако некоторые системы всё ещё могут его использовать, поэтому можно добавить для полноты.</p>
<h3>Robots (управление индексацией)</h3>
<p>Мета-тег `<meta name="robots">` управляет поведением поисковых роботов на странице.</p>
<p><strong>Основные значения:</strong></p>
<ul>
<li>`index, follow` — индексировать страницу и переходить по ссылкам (по умолчанию)</li>
<li>`noindex, follow` — не индексировать, но переходить по ссылкам</li>
<li>`index, nofollow` — индексировать, но не переходить по ссылкам</li>
<li>`noindex, nofollow` — не индексировать и не переходить по ссылкам</li>
</ul>
<h3>Canonical (канонический URL)</h3>
<p>Мета-тег `<link rel="canonical">` указывает поисковым системам, какая версия страницы является основной. Это помогает избежать проблем с дублями контента и правильно распределять ссылочный вес.</p>
<p>Canonical критически важен для правильной <a href="/blog/seo/struktura-url-dlya-seo/">структуры URL</a> и предотвращения дублей контента.</p>
<h2>Мета-теги для социальных сетей</h2>
<h3>Open Graph (Facebook, LinkedIn)</h3>
<p>Open Graph теги используются для красивого отображения ссылок в Facebook, LinkedIn и других социальных сетях.</p>
<p><strong>Основные теги:</strong></p>
<ul>
<li>`og:title` — заголовок</li>
<li>`og:description` — описание</li>
<li>`og:image` — изображение (1200x630px)</li>
<li>`og:url` — канонический URL</li>
<li>`og:type` — тип контента (website, article и т.д.)</li>
</ul>
<h3>Twitter Cards</h3>
<p>Twitter Cards используются для красивого отображения ссылок в Twitter.</p>
<p><strong>Основные теги:</strong></p>
<ul>
<li>`twitter:card` — тип карточки (summary, summary_large_image)</li>
<li>`twitter:title` — заголовок</li>
<li>`twitter:description` — описание</li>
<li>`twitter:image` — изображение</li>
</ul>
<h2>Мета-теги для мобильных устройств</h2>
<h3>Viewport</h3>
<p>Мета-тег `<meta name="viewport">` управляет отображением страницы на мобильных устройствах. Критически важен для мобильной версии сайта.</p>
<p><strong>Стандартное значение:</strong></p>
```html
<meta name="viewport" content="width=device-width, initial-scale=1.0">
```
<h3>Theme Color</h3>
<p>Мета-тег `<meta name="theme-color">` задаёт цвет панели браузера на мобильных устройствах.</p>
<h2>Как правильно настроить мета-теги</h2>
<h3>1. Анализ ключевых слов</h3>
<p>Перед созданием мета-тегов проведи анализ ключевых слов: какие запросы использует целевая аудитория, какая конкуренция по запросам, какие ключевые слова релевантны странице.</p>
<h3>2. Создание уникальных Title и Description</h3>
<p>Создавайте уникальные Title и Description для каждой страницы. Используйте ключевые слова естественным образом, делайте заголовки привлекательными, добавляйте призывы к действию в Description.</p>
<h3>3. Оптимизация длины</h3>
<p>Следите за длиной мета-тегов: Title — 50-60 символов, Description — 150-160 символов. Слишком длинные теги обрезаются в результатах поиска.</p>
<h3>4. Тестирование отображения</h3>
<p>Используйте инструменты для проверки отображения мета-тегов: Google Search Console, инструменты для предпросмотра SERP, валидаторы Open Graph и Twitter Cards.</p>
<h2>Инструменты для работы с мета-тегами</h2>
<h3>1. Google Search Console</h3>
<p>Показывает, как ваши страницы отображаются в Google, позволяет проверить мета-теги, видеть проблемы с индексацией.</p>
<h3>2. SERP Preview Tools</h3>
<p>Инструменты для предпросмотра того, как страница будет выглядеть в результатах поиска: Screaming Frog, Ahrefs, SEMrush.</p>
<h3>3. Open Graph Validator</h3>
<p>Валидаторы Open Graph: Facebook Sharing Debugger, LinkedIn Post Inspector — проверяют, как ссылки отображаются в социальных сетях.</p>
<h2>Частые ошибки в мета-тегах</h2>
<h3>1. Дублирование Title и Description</h3>
<p>Использование одинаковых Title и Description на разных страницах — это ошибка. Каждая страница должна иметь уникальные мета-теги.</p>
<h3>2. Переоптимизация</h3>
<p>Слишком много ключевых слов в Title и Description выглядит неестественно и может привести к санкциям. Используйте ключевые слова естественно.</p>
<h3>3. Игнорирование длины</h3>
<p>Слишком длинные Title и Description обрезаются в результатах поиска, что снижает кликабельность. Следите за длиной.</p>
<h3>4. Отсутствие Open Graph</h3>
<p>Без Open Graph тегов ссылки на ваш сайт в социальных сетях выглядят некрасиво. Это снижает кликабельность и трафик из соцсетей.</p>
<h2>Мета-теги и технический SEO</h2>
<p>Мета-теги — это часть технического SEO-аудита. Правильная настройка мета-тегов вместе с улучшением <a href="/blog/seo/core-web-vitals-polnoe-rukovodstvo-po-metrikam-google/">Core Web Vitals</a> и <a href="/blog/seo/vnutrennyaya-perelinkovka-dlya-seo-polnoe-rukovodstvo/">внутренней перелинковкой</a> создаёт прочную основу для успешного SEO-продвижения.</p>
<h2>Заключение</h2>
<p>Мета-теги — это основа SEO-оптимизации. Правильно настроенные мета-теги улучшают отображение в результатах поиска, увеличивают кликабельность, помогают поисковым системам понимать содержание страницы.</p>
<p>Начните с основных мета-тегов: Title, Description, Robots, Canonical. Затем добавьте Open Graph и Twitter Cards для социальных сетей. Регулярно проверяйте и оптимизируйте мета-теги для улучшения результатов.</p>
<p>EVARIS помогает компаниям правильно настроить мета-теги: анализируем текущие мета-теги, оптимизируем Title и Description, настраиваем Open Graph и Twitter Cards, обеспечиваем регулярный мониторинг и оптимизацию.</p> </div>
<!-- Блок автора -->
<div class="blog-detail__author-box">
<div class="blog-detail__author-avatar">
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="24" cy="24" r="24" fill="#F36049" fill-opacity="0.1"/>
<path d="M24 24c3.315 0 6-2.685 6-6s-2.685-6-6-6-6 2.685-6 6 2.685 6 6 6zm0 3c-4.005 0-12 2.01-12 6v3h24v-3c0-3.99-7.995-6-12-6z" fill="#F36049"/>
</svg>
</div>
<div class="blog-detail__author-info">
<span class="blog-detail__author-label">Автор статьи</span>
<span class="blog-detail__author-name">Evaris</span>
</div>
</div>
</article>
<!-- Навигация между статьями -->
<nav class="blog-detail__nav">
<a href="/blog/security/owasp-top-10-uyazvimosti-veb-prilozheniy/" class="blog-detail__nav-item blog-detail__nav-item--prev">
<span class="blog-detail__nav-label">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 12L6 8l4-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Предыдущая статья
</span>
<span class="blog-detail__nav-title">OWASP Top 10: уязвимости веб-приложений</span>
</a>
<a href="/blog/seo/mobile-first-indeksatsiya-optimizatsiya-dlya-mobilnykh/" class="blog-detail__nav-item blog-detail__nav-item--next">
<span class="blog-detail__nav-label">
Следующая статья
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 12l4-4-4-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</span>
<span class="blog-detail__nav-title">Mobile-First индексация: оптимизация для мобильных</span>
</a>
</nav>
<!-- Похожие статьи -->
<section class="blog-detail__related">
<h2 class="blog-detail__related-title">Похожие статьи</h2>
<div class="blogblock__wrapper blogblock__wrapper--related">
<div class="blogblock__item itemblog">
<div class="itemblog__textwrap">
<a href="/blog/seo/core-web-vitals-polnoe-rukovodstvo-po-metrikam-google/">Core Web Vitals: полное руководство по метрикам Google</a>
<p>Core Web Vitals — ключевые метрики производительности, которые напрямую влияют на ранжирование в Google. Разбираемся, чт...</p>
<div class="itemblog__footer">
<span class="itemblog__date">24.01.2026</span>
<a href="/blog/seo/core-web-vitals-polnoe-rukovodstvo-po-metrikam-google/" class="itemblog__read-more">Читать →</a>
</div>
</div>
</div>
<div class="blogblock__item itemblog">
<div class="itemblog__textwrap">
<a href="/blog/seo/sitemap-xml-dlya-seo-polnoe-rukovodstvo/">Sitemap.xml для SEO: полное руководство</a>
<p>Sitemap.xml — это файл, который помогает поисковым системам находить и индексировать страницы вашего сайта. Правильно на...</p>
<div class="itemblog__footer">
<span class="itemblog__date">24.01.2026</span>
<a href="/blog/seo/sitemap-xml-dlya-seo-polnoe-rukovodstvo/" class="itemblog__read-more">Читать →</a>
</div>
</div>
</div>
<div class="blogblock__item itemblog">
<div class="itemblog__textwrap">
<a href="/blog/seo/e-commerce-seo-prodvizhenie-internet-magazina/">E-commerce SEO: продвижение интернет-магазина</a>
<p>SEO для интернет-магазинов имеет свои особенности: оптимизация каталога товаров, товарных страниц, фильтров, категорий. ...</p>
<div class="itemblog__footer">
<span class="itemblog__date">24.01.2026</span>
<a href="/blog/seo/e-commerce-seo-prodvizhenie-internet-magazina/" class="itemblog__read-more">Читать →</a>
</div>
</div>
</div>
</div>
</section>
<section class="seo-crosslinks">
<h2 class="seo-crosslinks__title">Материалы по теме</h2>
<ul class="seo-crosslinks__list">
<li class="seo-crosslinks__item">
<a href="/glossary/" class="seo-crosslinks__link">
Глоссарий digital-терминов </a>
<span class="seo-crosslinks__label">Глоссарий</span>
</li>
<li class="seo-crosslinks__item">
<a href="/checklists/" class="seo-crosslinks__link">
Все чеклисты по SEO и разработке </a>
<span class="seo-crosslinks__label">Чеклисты</span>
</li>
<li class="seo-crosslinks__item">
<a href="/obuchenie/" class="seo-crosslinks__link">
Бесплатные уроки по веб-разработке </a>
<span class="seo-crosslinks__label">Обучение</span>
</li>
<li class="seo-crosslinks__item">
<a href="/checklists/seo/" class="seo-crosslinks__link">
SEO: чеклисты </a>
<span class="seo-crosslinks__label">Чеклисты</span>
</li>
<li class="seo-crosslinks__item">
<a href="/glossary/meta-tags/" class="seo-crosslinks__link">
Мета-теги </a>
<span class="seo-crosslinks__label">Термин</span>
</li>
<li class="seo-crosslinks__item">
<a href="/glossary/title-tag/" class="seo-crosslinks__link">
Title Tag </a>
<span class="seo-crosslinks__label">Термин</span>
</li>
</ul>
</section>
<div class="blog-detail__footer">
<a href="/blog/" class="blog-detail__btn">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.5 15L7.5 10L12.5 5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span>Все статьи</span>
</a>
</div>
</div>
</section>
</main>
<footer class="footer">
<div class="container footer__con">
<div class="footer__wrapper">
<div class="footer__logo">
<img src="/local/templates/quantaunit/images/logotyp10.svg" alt="Evaris">
<span class="footer__logo-text">Digital агентство</span>
<a href="/karta-sajta/" class="footer__sitemap-link">Карта сайта</a>
<button class="footer__scroll-top" id="scrollToTop" title="Наверх">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 19V5M12 5L5 12M12 5L19 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span>Наверх</span>
</button>
</div>
<div class="footer__left">
<div class="footer__menu">
<div class="footer__menu__title">Услуги</div>
<ul>
<li><a href="/uslugi/tematika/kafe/">Сайт для кафе</a></li>
<li><a href="/uslugi/razrabotka-saytov/prostoy-sayt/">Простой сайт</a></li>
<li><a href="/uslugi/tematika/avto/">Сайт для автобизнеса</a></li>
<li><a href="/uslugi/tematika/klining/">Сайт для клининговой компании</a></li>
<li><a href="/uslugi/tematika/kosmetologiya/">Сайт для косметологии</a></li>
<li><a href="/uslugi/tematika/massazh/">Сайт для массажного салона</a></li>
<li><a href="/uslugi/tematika/dostavka-edy/">Сайт для доставки еды</a></li>
<li><a href="/uslugi/razrabotka-saytov/lichnyy-sayt/">Личный сайт</a></li>
<li><a href="/uslugi/tematika/okna/">Сайт для оконной компании</a></li>
<li><a href="/uslugi/razrabotka-saytov/landing-page/">Landing page</a></li>
<li><a href="/uslugi/tematika/psiholog/">Сайт для психолога</a></li>
<li><a href="/uslugi/tematika/logistika/">Сайт для логистики</a></li>
<li><a href="/uslugi/">Все услуги →</a></li>
</ul>
</div>
<div class="footer__menu">
<div class="footer__menu__title">Агентство</div>
<ul>
<li><a href="/portfolio/">Портфолио</a></li>
<li><a href="/o-komande/">О команде</a></li>
<li><a href="/blog/">Блог</a></li>
<li><a href="/obuchenie/">Обучение</a></li>
<li><a href="/checklists/">Чеклисты</a></li>
<li><a href="/glossary/">Глоссарий</a></li>
<li><a href="/voprosy-otvety/">Вопросы и ответы</a></li>
<li><a href="/otzyvy/">Отзывы</a></li>
<li><a href="/kontakty/">Контакты</a></li>
<li><a href="/brief/">Заполнить бриф</a></li>
<li><a href="/calculator/">Калькулятор стоимости</a></li>
<li><a href="/servisy/">Онлайн сервисы</a></li>
<li><a href="/products/">Шаблоны и плагины</a></li>
<li><a href="/politika/">Политика конфиденциальности</a></li>
</ul>
</div>
</div>
<div class="footer__right">
<div class="footer__contacts">
<ul class="footer__contacts-list">
<li>
<a href="tel:+7(966) 124-51-60">+7(966) 124-51-60</a>
</li>
<li>
<a href="mailto:hello@evaris.ru">hello@evaris.ru</a>
</li>
</ul>
<ul class="footer__soc">
<li>
<a target="_blank" href="https://t.me/qamos" title="Telegram">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm4.64 6.8c-.15 1.58-.8 5.42-1.13 7.19-.14.75-.42 1-.68 1.03-.58.05-1.02-.38-1.58-.75-.88-.58-1.38-.94-2.23-1.5-.99-.65-.35-1.01.22-1.59.15-.15 2.71-2.48 2.76-2.69.01-.03.01-.14-.07-.2-.08-.06-.19-.04-.27-.02-.12.03-1.99 1.27-5.62 3.72-.53.36-1.01.54-1.44.53-.47-.01-1.38-.27-2.06-.49-.83-.27-1.49-.42-1.43-.88.03-.24.37-.49 1.02-.74 3.98-1.73 6.64-2.88 7.97-3.44 3.8-1.57 4.59-1.85 5.1-1.86.11 0 .37.03.53.17.14.12.18.28.2.45-.02.07-.02.27-.04.42z" fill="#F36049"/>
</svg>
</a>
</li>
<li>
<a target="_blank" href="https://wa.me/79661245160" title="WhatsApp">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C6.48 2 2 6.48 2 12c0 1.82.49 3.53 1.34 5L2 22l5.14-1.34A9.94 9.94 0 0012 22c5.52 0 10-4.48 10-10S17.52 2 12 2zm.02 17.5c-1.63 0-3.23-.44-4.61-1.26l-.33-.19-3.06.8.82-2.98-.22-.34A7.47 7.47 0 014.5 12c0-4.14 3.36-7.5 7.5-7.5s7.5 3.36 7.5 7.5-3.36 7.5-7.48 7.5zm4.11-5.61c-.23-.11-1.33-.65-1.54-.73-.21-.08-.36-.11-.51.11-.15.23-.58.73-.71.88-.13.15-.26.17-.48.06-.23-.11-.95-.35-1.81-1.12-.67-.59-1.12-1.33-1.25-1.55-.13-.23-.01-.35.1-.46.1-.1.23-.26.34-.39.11-.13.15-.23.23-.38.08-.15.04-.28-.02-.39-.06-.11-.51-1.24-.7-1.69-.18-.45-.37-.38-.51-.39h-.44c-.15 0-.39.06-.6.28-.21.23-.79.77-.79 1.88s.81 2.18.92 2.33c.11.15 1.59 2.43 3.86 3.4.54.23.96.37 1.29.48.54.17 1.04.15 1.43.09.44-.07 1.33-.54 1.52-1.07.19-.53.19-.98.13-1.07-.06-.09-.21-.15-.44-.26z" fill="#F36049"/>
</svg>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<!-- Модальное окно заявки -->
<div class="modal" id="applicationModal">
<div class="modal__overlay"></div>
<div class="modal__content">
<button class="modal__close js-modal-close" aria-label="Закрыть">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 6L6 18M6 6L18 18" stroke="#2C3035" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</button>
<div class="modal__header">
<h2 class="modal__title">Оставить заявку</h2>
<p class="modal__subtitle">Заполните форму и мы свяжемся с вами в ближайшее время</p>
</div>
<form class="modal__form" id="applicationForm">
<div class="modal__field">
<label for="modalName" class="modal__label">Имя *</label>
<input type="text" id="modalName" name="name" class="modal__input" required placeholder="Ваше имя">
</div>
<div class="modal__field">
<label for="modalPhone" class="modal__label">Телефон *</label>
<input type="tel" id="modalPhone" name="phone" class="modal__input" required placeholder="+7 (___) ___-__-__">
</div>
<div class="modal__field modal__field--checkbox">
<label class="modal__checkbox-label">
<input type="checkbox" id="modalAgree" name="agree" required class="modal__checkbox">
<span class="modal__checkbox-text">Я согласен на обработку <a href="/politika/" target="_blank">персональных данных</a> *</span>
</label>
</div>
<button type="submit" class="modal__submit">Отправить заявку</button>
<div class="modal__message" id="modalMessage"></div>
</form>
</div>
</div>
<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebPage","name":"Мета-теги для SEO: полное руководство | Блог — EVARIS","description":"Полное руководство по мета-тегам для SEO. Title, Description, Keywords, Open Graph, Twitter Cards. Как правильно настроить мета-теги для улучшения ранжирования.","url":"https://evaris.ru/blog/seo/meta-tegi-dlya-seo-polnoe-rukovodstvo/","isPartOf":{"@type":"WebSite","name":"Evaris — Digital-агентство полного цикла","url":"https://evaris.ru"}}</script>
<!-- Schema.org Organization Markup -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "Evaris",
"alternateName": "Evaris Digital Agency",
"url": "https://evaris.ru",
"logo": "https://evaris.ru/local/templates/quantaunit/images/logotyp10.svg",
"description": "Digital-агентство полного цикла. Создаём сайты на 1С-Битрикс и WordPress, продвигаем в поисковых системах, автоматизируем бизнес-процессы.",
"address": {
"@type": "PostalAddress",
"addressCountry": "RU"
},
"contactPoint": [
{
"@type": "ContactPoint",
"telephone": "+7-966-124-51-60",
"contactType": "customer service",
"availableLanguage": "Russian",
"email": "hello@evaris.ru"
}
],
"sameAs": [
"https://t.me/qamos",
"https://wa.me/79661245160"
]
}
</script>
<!-- Уведомление о cookies -->
<div class="cookies-notice" id="cookiesNotice">
<div class="cookies-notice__content">
<div class="cookies-notice__text">
<p>Мы используем файлы cookie для улучшения работы сайта и персонализации контента. Продолжая использовать сайт, вы соглашаетесь с использованием cookies в соответствии с нашей <a href="/politika/" target="_blank">Политикой конфиденциальности</a>.</p>
</div>
<div class="cookies-notice__buttons">
<button class="cookies-notice__btn cookies-notice__btn--accept" id="acceptCookies">Принять</button>
<button class="cookies-notice__btn cookies-notice__btn--decline" id="declineCookies">Отклонить</button>
</div>
</div>
</div>
</body>
</html>
