Содержание статьи

Мета-теги являются одним из основных инструментов работы с SEO-оптимизацией сайтов. WEDEX расскажет о том, как можно использовать мета-теги для улучшения видимости сайта.
Что такое мета-теги и для чего они нужны?
Мета-теги это элементы кода html страницы, которые используются для предоставления дополнительной информации поисковым системам о содержании страницы. Благодаря этой информации поисковые системы могут оценить то, насколько показанная страница на сайте соответствует запросу пользователя и следует ли ее продвигать выше в поисковой выдаче.
Если говорить более техническим языком, то все meta-теги расположены в пределах раздела <head> html кода страницы. Выглядит это следующим образом:
<head>
<title>Пример HTML документа</title>
<meta name=«description» content=«Это пример HTML документа с основными мета-тегами для SEO и соцсетей.»>
<meta name=«keywords» content=«HTML, мета-теги, SEO.»>
<meta name=«author” content=«Ваше имя.»>
</head>
В этом примере мы уже видим некоторые из самых распространенных мета-тегов, такие как:
- название,
- описание,
- ключевые слова,
- автор.
О каждом из них мы подробно поговорим далее.
Почему мета-теги важны для сайтов?
Качественное SEO в сочетании с качественно сформированными тегами повышают результативность страниц и смогут привлечь больше трафика на сайт.
Все дело в том, что метатеги и метаописание для SEO дают возможность контролировать вид сайтов на страницах результатов поисковой системы. Качественно прописанные теги и сформированное описание может ощутимо повысить органический рейтинг кликов, он же CTR.
Ваш сайт нуждается в качественной SEO-оптимизации?
Специалисты WEDEX знают как улучшить позиции сайта в поисковых системах, увеличить трафик и привлечь больше клиентов! Заполните форму и мы подберем эффективную SEO-стратегию именно для вашего бизнеса!
Основные мета-теги на любом сайте
Большинству людей, которые тем или иным образом имеют дело с SEO, html и настройкой сайтов, известно несколько основных мета-тегов, о которых мы писали выше. Это теги Title, Description и Keywords. Вот некоторые полезные советы для наполнения и корректировки этих мета-тегов на страницах.
О разнице мета-тегов и html-тегов
Наличие слова «теги» в словосочетаниях «мета теги» и «html теги» могут ввести в заблуждение. Это разные термины, разницу между которыми необходимо знать каждому сео-специалисту. Итак:
HTML теги это базовые элементы html разметки страницы на сайте, которые используются для структурирования содержимого веб-страницы. Благодаря этим тегам можно настроить заголовки, стиль абзацев, списков, таблиц, ссылок и изображений.
На языке разметки html пишется вся страница, начиная от «чердака» сайта (header) до «подвала» (footer).
Мета-теги отвечают за метаинформацию страницы. Эта информация невидима для пользователя, но очень важна для корректной индексации и ранжирования страницы и сайта в поисковиках.
Метатеги располагаются в <head> страницы и предоставляют информацию о наполнении страницы. Они относятся к html разметке, но выполняют другие задачи.
Что такое мета-тег Title и каковы его особенности
Мета-тег title содержит в себе заголовок вашей html страницы. Это тот заголовок, который можно увидеть при наведении курсора мыши на соответствующую вкладку, а поисковая система выдает его в результатах поиска.
Советы по созданию Title
Вот основные советы для корректного составления тега Title:
- Мета-тег Title должен быть уникальным для каждой страницы на сайте. Избегайте дублирования тайтлов для страниц в пределах одного сайта. Для поиска дубликатов можно использовать инструмент Google Search Console.
- При написании мета-тега заголовка используйте наиболее частотные фразы и слова из семантического ядра вашего сайта.
- Title должен быть оптимизированным, но самое главное – осмысленным. Простой набор ключевых слов не поощрит пользователя перейти по ссылке.
- Оптимальная длина title составляет 60 символов. Выход за пределы этого диапазона приведет к обрезанию заголовка в поисковой выдаче.
- Название страницы должно точно соответствовать содержанию страницы. От этого напрямую зависит результативность ее поиска пользователями. Например, если на странице есть видео, следует указать об этом в соответствующем мета-теге – такой ход повысит конверсию среди тех пользователей, кто ищет видеообзор или видеоинструкцию.
- Избегайте использования шаблонных текстов в содержимом мета-тега. Наличие лаконичного и уникального текста повысит качество страницы.
- Google рекомендует избегать использования в title конкретных цен на товары. Но указать, что в магазине действует акция до какого-то периода – хороший вариант.
В официальной документации Google для разработчиков есть перечень дополнительных особенностей работы с тегом Title.
Примеры Title
Ниже вы можете увидеть различные примеры заполнения содержимого Title:
✅ НотаМи – магазин музыкальных инструментов.
🆘 Электрические гитары дешево в Киеве, скидки на струны.
✅ Plumber.com.ua – сервис по сантехническим работам в городе Киев.
🆘 Ремонт труб / кранов / быстро и низкие цены / сантехник Plumber.com.ua.
✅ Заказать услуги копирайтера на Work.ua / удаленная работа.
🆘 Копирайт-работы любой сложности, самая дешевая цена за количество символов.
Эти простые примеры наглядно показывают разницу между условно хорошим с точки зрения оптимизации заголовком и плохим. Попробуйте самостоятельно попрактиковаться в написании различных заголовков!
Какие принципы работы с тегом Description
Суть метатега Description можно понять из названия – буквально «описание». Этот тег используется для краткого и емкого описания содержимого страницы на сайте. Самое главное, чтобы «дескрипшн» четко определял тему, а также был содержательным. Как и в случае с Title, описание не должно выглядеть как набор ключевых слов или фраз. Такой «дескрипшн» работать не будет.
Советы по созданию Description
Вот основные моменты написания описания, которые стоит иметь в виду:
- Аналогично Title, description должно быть уникальным для каждой страницы сайта.
- Оптимальная длина description – до 155-160 символов. Более длинные описания будут обрезаться поисковыми системами.
- Содержание описания должно соответствовать наполнению страницы. Также следует избегать общих описаний по типу «мой сайт» и «сайт о динозаврах».
- Предоставляйте четкую информацию о содержании статьи или страницы. Это поможет поисковым системам с большей вероятностью предложить страницу необходимому пользователю.
- Использование автоматических средств генерации описания допустимо в случае большого количества страниц сайта. Например, магазин розничных товаров разных видов, количество которых исчисляется тысячами. Придумывать уникальное описание под каждую позицию слишком долго, поэтому даже Google предлагает автоматизировать процесс.
Официальная документация Google содержит дополнительный перечень принципов работы с тегом Description.
Примеры описаний
Приведем несколько примеров того как надо и как не надо делать описания страницы вашего сайта.
✅ Интернет-магазин музыкальных инструментов НотаМи в Украине. Качественные электрогитары, фортепиано и многое другое. 0 (800) 800-800. Низкие цена и быстрая доставка.
🆘 Ремонт компьютеров на дому + комплектующие по почте. Делаем быстро, качественно, приезжаем к вам лично, крутой ремонт, доступно и дешево.
✅ Купить casual-одежду недорого в интернет-магазине HiGen. Более 10 лет на рынке. Заказывай одежду из Европы по лучшим ценам.
🆘 Игрушки / игрушки для детей / мягкие игрушки для детей / Лего / для любого возраста / +380 (099)9-9-8-8-00-4
✅ Заказать услуги сантехника на сайте Plumber.com.ua. Сантехнические работы любой сложности в городе Киев по доступным ценам. 0 (800) 800-800
🆘 Обмен валют наличными! Быстро! Качественно! В любой район города Одессы! ВЫГОДНЫЙ обмен по ТЕКУЩЕМУ КУРСУ. ЗВОНИ СЕЙЧАС (099)9-9-8-8-00-4
Как мета-тег Title связан с заголовками H?
Часто тег title ошибочно связывают с еще одним важным SEO-инструментом, который называется H или заголовок H. Этот тип html тегов отвечает за заголовки внутри страницы, то есть то, что видит пользователь на сайте. Заголовки делятся на основной (уровня H1) и подзаголовки (уровень h2-h6).
Не следует путать H1 и title. H1 это обычный html тег, который расположен в «теле» страницы, а title является мета-тегом, который отвечает за информацию о содержимом страницы.
Заголовки всех уровней влияют на ранжирование страницы, но наиболее весомое влияние имеет именно заголовок под html тегом H1. Не так давно поисковая система Google начала «подтягивать» содержимое тега H1 вместо тега Title. Поэтому для лучшего ранжирования страницы или сайта рекомендуется уделять внимание не только содержимому «тайтла», но и основному заголовку страницы.
Правила написания качественного заголовка H1 похожи на приведенные выше правила для Title. Разница заключается в том, что в большинстве случаев H1 может быть немного длиннее Title. В конце концов, по состоянию на сегодня, рекомендуется оптимизировать и H1, и «тайтл». Оба тега должны дополнять друг друга и не мешать ранжированию страницы на сайте.
Почему не все так просто с мета-тегом Keywords?
Один из самых известных тегов называется keywords, то есть «ключевые слова». Этот мета-тег раньше использовался для того, чтобы разработчик или владелец сайта мог указать конкретные ключевые слова или фразы, по которым поисковые системы проще находили бы страницу. Так было раньше.
Сегодня большинство поисковых систем игнорирует этот мета-тег. Вот некоторые основные моменты:
- Google – полностью игнорирует с 2009 года. Причиной стало использование тега для спама и манипуляций с SEO.
- Bing – полностью игнорирует тег, кроме случаев поиска спама. Если поисковая система обнаружит, что в теге keywords явное злоупотребление ключевыми словами, то это может повлиять на дальнейшее ранжирование сайта.
- DuckDuckGo – также не использует тег для ранжирования.
Существуют ли поисковики, которые все еще используют этот мета-тег? Да, среди них китайский Baidu и южнокорейский Naver. Но разработчики обеих поисковых систем уверяют, что keywords имеет минимальное влияние на ранжирование. Гораздо более важными остаются мета-теги Title и Description.
Инструменты работы с мета-тегами
Для того, чтобы иметь более комплексное представление о том, какие именно мета-теги используются на сайте, следует использовать специальные SEO-инструменты. Например, чтобы понять влезает ли написанный title и описание в сниппет, можно использовать следующие инструменты:
- Portnet’s Google SERP Preview Tool – бесплатный сервис, который покажет как будет выглядеть страница в поисковом запросе с учетом использованных мета-тегов.
- Google SERP Simulator – аналогичный предыдущему сервису инструмент, который предлагает несколько более широкие настройки.
Еще одним полезным дополнением к вашему SEO-инструментарию станет SEO META in 1 Click. SEO META – это расширение для браузера, которое собирает все мета-теги с сайта и отображает в удобном формате. Расширение пригодится при поверхностном анализе SEO сайтов, а также предоставит информацию об основных мета-тегах, включая Title, Description, заголовками разных уровней и тому подобное. Кроме SEO META in 1 Click существуют другие расширения, которые предлагают похожий функционал. Среди них:
В широком ассортименте представлены платные SEO-сервисы, например Octoparse, Scrape.do, Parsehub, Domo. Следует заметить, что функционал этих программ и сервисов гораздо шире и охватывает не только SEO-оптимизацию. Вероятно, среди бесплатных аналогов есть инструмент, который полностью закроет все потребности в анализе мета-тегов для сайта.
Какие еще существуют мета-теги?
Перечень мета-тегов не ограничивается тремя наименованиями. На самом деле их гораздо больше, а функционал, который они предлагают выходит за рамки исключительно SEO-оптимизации. Предлагаем ознакомиться с самыми полезными тегами для ваших сайтов и страниц.
Мета-теги robots и googlebot tags
<meta name=«robots» content=«index, follow»>
Поиск в той же системе Google происходит средствами так называемых роботов, которые и сканируют сайты и индексируют их. Благодаря meta-тегам мы можем сделать для них инструкцию относительно того, как именно следует сканировать и отображать сайт.
Благодаря этому тегу можно настроить, например видимость страницы или сайта для поисковых систем. По умолчанию тег robots делает страницу сайта доступной для поисковых систем и имеет параметры index и follow.
<meta name=«googlebot» content=«noindex, nofollow»>
Тег googlebot отвечает за индексацию и поиск страницы исключительно средствами системы Google. В приведенном выше примере мы запретили индексацию и показ страницы сайта в результатах поиска (параметр «noindex») и запретили роботу Google переходить по ссылкам на этой странице сайта (параметр «nofollow»).
Мета-тег viewport
<meta name=«viewport»>
С появлением мощных смартфонов встал вопрос просмотра сайтов и страниц сети Интернет в формате небольшого дисплея. Чтобы решить проблему адаптации страниц под мобильные устройства был создан тег viewport.
Наличие этого мета-тега поможет адаптировать страницу под меньший форм-фактор дисплея. Это сделает текст крупнее, элементы интерфейса станут удобными для управления через сенсорный дисплей и т.д. Отсутствие тега заставит страницу отображаться в desktop-формате.
Пример тега: <meta name=«viewport» content=«width=device-width, initial-scale=1.0»>
Параметры следующие:
- width=device-width – устанавливает ширину страницы относительно ширины экрана устройства. Страница является адаптированной.
- initial-scale=1.0 – определяет начальный масштаб страницы. «1.0» означает отсутствие изменения масштаба, то есть страница отображается по умолчанию.
Существуют и другие параметры, такие как:
- maximum-scale и minimum-scale – используются для задания максимального и минимального уровня масштабирования страницы.
- user-scalable – дает возможность запретить пользователю изменять масштаб страницы.
Почему мета-тег viewport важен, хотя каких-то манипуляций с текстом не делает? Потому что поисковые системы не ограничивают влияние SEO только текстом. Удобство пользования – еще один важнейший элемент пользовательского опыта. Поисковики также относят этот тег в перечень важных для SEO, ведь большинство пользователей посещает сайты с телефона.
Мета-теги Open Graph tags
Мета-теги Open Graph напрямую не влияют на SEO, но помогают увеличить трафик из соцсетей благодаря привлекательному виду ссылок. Open Graph (OG) – это набор тегов, которые позволяют оптимизировать внешний вид ссылок на вашу веб-страницу в соцсетях.
Почему следует использовать Open Graph? Потому что благодаря этому простому инструменту можно существенно повысить конверсию кликов через социальные сети.
Обычная ситуация: владелец сайта без настроенных мета-тегов Open Graph выкладывает ссылку на страницу в соцсеть Facebook. Соцсеть «подтягивает» данные по ссылке (изображение страницы, title, description), но без Open Graph они могут быть некорректными или не соответствовать вашим ожиданиям.
Для того, чтобы избежать проблем с отображением внешних ссылок на сайт следует использовать Open Graph tags. Мета-теги Open Graph легко внедрить с помощью плагинов для WordPress или других CMS благодаря четкой и понятной документации. Самостоятельная имплементация потребует дополнительных настроек.
Итоги
Мета-теги являются одними из важнейших элементов SEO-оптимизации вашего сайта. Целесообразное использование мета-тегов, в частности title, description, robots, микроразметки Open Graph поможет странице подняться выше в результатах поисковых запросов. Некоторые ключевые моменты, которые следует запомнить:
- Краткость и четкость – точная формулировка Title и емкий Description поможет не только поисковой системе, но и пользователю понять, что страница является полезной.
- Заголовки разных уровней также влияют на SEO – насыщайте заголовки и подзаголовки разных уровней ключевыми словами и фразами.
- Внедрение тех или иных meta-тегов лишь часть успеха – следует отслеживать динамику и эффективность внедренных тегов. Один из основных инструментов отслеживания эффективности тегов – Google Analytics.
- При наличии большого количества одинаковых страниц (например, товаров) использование SEO-шаблонов и похожих «тайтлов» является допустимым.
- Избегать злоупотреблений спамом ключевыми словами. Текст на странице должен быть «живым» и понятным пользователю.
Используйте предоставленные советы для качественной SEO-оптимизации и работы с мета-тегами. Оставайтесь с WEDEX и узнайте о других полезных инструментах интернет-маркетинга!




