О мета-тегах для сайта простым языком

09 октября 2023

Чтобы ваш сайт не терялся среди миллионов других в интернете, нужно ответственно подходить к его поисковой оптимизации (Search Engine Optimization, SEO). Продвижение в поиске зависит от сотен факторов, каждый из которых учитывается при определении позиции веб-страницы в результатах выдачи. Владелец сайта может влиять лишь на некоторые показатели — и для этого необходимо помнить о множестве мелких нюансов. Метатеги — один из немногих эффективных инструментов, позволяющих оптимизаторам гарантированно улучшать ранжирование сайта. В статье простым языком рассказываем, чем полезны метатеги страниц, какие теги наиболее важны в SEO и как их правильно заполнять.

Что такое мета-теги

Начнем с основ. В языке гипертекстовой разметки (HyperText Marker Language, HTML) тегами называют элементы программного кода, заключенные в знаки «<>»: например, тег . Как правило, они используются парами, то есть следом за открывающим link-тегом стоит закрывающий — . Текст между двумя такими тегами отображается на странице в соответствии со свойствами, которые прописываются в первом из них. Это помогает разработчику структурировать контент на веб-странице и правильно его отображать.

Изображение от pikisuperstar на Freepik.

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

<meta name="robots" content="noindex"/> // Метатег сообщает поисковой системе, что контент не нужно индексировать, вносить в базу.
<meta http-equiv="Cache-Control" content="public, max-age=31536000"> // Метатег говорит браузеру и промежуточным серверам, что контент нужно кэшировать и как долго его хранить.

Все метатеги встраивают внутрь тега <head>, в самом начале страницы. Они играют важную роль в оптимизации, ведь могут быть использованы краулерами для индексации и ранжирования сайта.

Функции мета-тегов

Правильное использование метатегов может улучшить видимость вашего сайта в поисковых результатах. А чем выше в выдаче стоит ссылка, тем чаще пользователи по ней переходят. Другими словами, метатеги положительно влияют на SEO и помогают привлекать трафик. Но это не единственная их функция. Рассмотрим основные задачи, которые обычно решаются метатегами:

Определение языка и кодировки символов. Метатеги могут указывать, какой язык используется на странице и что за кодировка. Это нужно для корректного отображения контента в браузерах.
Описание содержимого. Самые важные для SEO метатеги содержат данные о тематике веб-страницы: название, заголовки, краткие описания, ключевые слова. Благодаря им роботы лучше понимают, чему посвящен контент.
Настройка индексации. Если от внимания поисковиков требуется скрыть отдельную страницу или часть контента на ней, без метатега «robots» не обойтись.

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

Основные мета-теги в SEO

Все метатеги так или иначе влияют на положение сайта в поиске — опосредовано, как тег «viewport» (нужен для правильного отображения адаптивного дизайна), или напрямую, как «robots». Однако, когда речь заходит об оптимизации, больше всего внимания уделяют метатегам Title и Description. Наряду с ними применяют Keywords и Content-type, хотя метатег «кейвордс» практически потерял актуальность, а «контент-тайп» адресован, скорее, браузеру, чем краулерам. Тем не менее четыре этих тега играют важную роль в SEO. Давайте кратко поясним каждый.

Тег Title

Метатег <title> — это заголовок страницы, ее название, которое отображается на вкладке в верхней части браузерного окна, когда посетитель просматривает сайт. Также «тайтл» виден в сниппете — кратком информационном блоке о вашей веб-странице в результатах поисковой выдачи. Если метатег не заполнен, Google и Яндекс отдадут предпочтение более оптимизированным ресурсам, и в выдачу вы не попадете.

Заголовок — это первое, что пользователи видят о вашем сайте в результатах поиска. Необходимо уделять этому элементу особое внимание, чтобы привлечь больше посетителей.

Тег Description

Метатег <meta name="description"> — это краткое описание веб-страницы, которое помогает поисковым роботам понять, о чем на ней говорится. Не всегда, но зачастую «дескрипшн» используется поисковиками для отображения информации в сниппете, под заголовком. Если тег не прописан или заполнен некорректно, система может «подтянуть» описание из текста на самой странице — то, что сама посчитает подходящим. Иногда это происходит и с правильно прописанным Description, но всегда лучше перестраховаться.

Тег Keywords

Метатег <meta name="keywords"> ранее применяли для указания ключевых слов, связанных с содержанием страницы. Однако в современном SEO этот тег уже не имеет большого значения. Google полностью игнорируют его, так как недобросовестные владельцы сайтов много злоупотребляли им, спамили ключами, чтобы обмануть поисковик. Вместо «кейвордс» Гугл сейчас сосредотачивается на анализе реального наполнения страницы и других метатегов.

Тем не менее Яндекс заявляет, что тег может учитываться их системой, чтобы определить соответствие страницы поисковым запросам.

Тег Content-type

Метатег <meta http-equiv="Content-Type"> — это способ указать браузеру, как правильно интерпретировать и отобразить содержимое вашей веб-страницы. Через «контент-тайп» вы сообщаете веб-браузеру, на каком языке написан текст на странице и какие символы (буквы, цифры и знаки) он должен использовать для его правильного отображения. Если не прописать язык и кодировку в этом теге, сайт будет похож на инопланетную скрижаль, что отпугнет пользователей и сведет на нет все остальные усилия по оптимизации.

Как просмотреть мета-теги

Чтобы проверить метатеги на собственном сайте, воспользуйтесь бесплатным сервисом Яндекс.Вебмастер. Он в любом случае понадобится вам для оптимизации ресурса под этот поисковик. Узнать о проблемах с заполнением (или незаполнением) тегов можно в разделе «Диагностика сайта» — «Возможные проблемы». Это самый простой и удобный способ. Кроме того, читать метатеги и находить ошибки умеет программа Screaming Frog SEO Spider. В ней можно проанализировать как собственный проект, так и сторонний.

Если же вас интересуют метатеги на конкретной странице — не важно, вашей или чужой, — быстрее всего будет просмотреть ее исходный код. Для этого откройте веб-страницу, нажмите правой кнопкой мыши в пустой области, чтобы вызвать контекстное меню. Выберите пункт «Просмотреть код» и изучите информацию после тега <head>. Все метатеги будут прописаны там.

Изображение от pch.vector на Freepik.

Title

Заголовок страницы играет ключевую роль: он должен коротко и ясно описывать, о чем именно эта страница. Когда пользователи видят Title в поисковых результатах, они решают, стоит ли им перейти на ваш сайт. Поэтому важно, чтобы этот метатег был информативным и привлекательным.

Пример хорошего метатега Title для главной страницы:

<title> «Макхост» — платный хостинг для сайта | Регистрация доменов </title>

Ниже дадим несколько рекомендаций по заполнению тайтла.

Как заполнить тег Title

Будьте информативны. Заголовок должен ясно передавать основную тему страницы. Если она посвящена продаже обуви, отразите это в тайтле («Купить женскую обувь 2024 со скидками до 75%»).

Уберите лишнее. Заголовок не должен быть слишком длинным. Обычно рекомендуется ограничиться 50-60 символами, чтобы весь Title корректно отображался на разных устройствах.

Внедрите ключевые слова. Это главное правило, несоблюдение которого ведет к сильному ухудшению видимости сайта. Используйте в заголовках высокочастотные ключи, чтобы привлекать больше трафика.

Следите за уникальностью. Тайтлы внутри одного ресурса не должны повторяться. Иначе поисковым системам будет сложнее правильно индексировать и ранжировать сайт.

Description

Этот метатег выполняет роль краткого анонса или рекламного текста страницы. Его цель — заинтересовать пользователей и сказать им, почему они должны кликнуть именно на вашу ссылку и посетить ваш сайт. Хороший Description привлекает больше посетителей, потому что позволяет им сразу понять, подходит ли ваш контент для их запроса.

Как заполнить тег Description

Раскройте тему. Описание должно быть более информативным, чем заголовок, поэтому не стоит повторять то, что сказано в тайтле. Добавьте деталей.

Следите за объемом. Максимальная длина «дескрипшн» составляет 150-160 символов в Google и около 300-350 в Яндекс.

Не спамьте ключами. Кейвордсы лучше размещать ближе к началу, но использовать в меру. Вместо этого сообщите важную информацию: уникальное предложение, действующие скидки и акции, условия доставки и пр.

Добавьте эмодзи. Они сделают описание более привлекательным.

Keywords

Если вы все же используете метатег «кейвордс», следует заполнять его правильно. Конструкция выглядит следующим образом:

<meta name="keywords" content="ключ"/>

Где «ключ» — это слово или фраза, под которую оптимизирована страница. Ключи перечисляются через запятую. Рекомендуемый объем — 5-10 штук. Помните, что если ключ не встречается в видимой части веб-страницы, поисковик не будет его учитывать.

Как заполнить тег Keywords

Соблюдайте релевантность. Включайте только те слова и фразы, что действительно связаны с содержанием вашей страницы.

Не перегружайте тег. Увлекаться ключами не стоит, иначе поисковики воспримут это как спам.

Сохраняйте уникальность. Каждая страница вашего сайта должна иметь уникальный набор ключевых слов.

Content-type

Метатег «контент-тайп» можно представить как языковую настройку веб-страницы. Бывает, что страницы использую разную письменность или специфические символы, поэтому могут возникнуть проблемы в их интерпретации машинами. Тег content-type гарантирует, что браузер отобразит текст правильно.

Как заполнить тег Content-type

Сегодня разработчики сайтов предпочитают кодировку UTF-8, поскольку она поддерживает множество символов и широко используется для отображения текста на веб-страницах. Заполнить тег проще простого: добавьте в -тег страницы следующую строчку:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

Как мета-теги помогают в продвижении сайта

Частично мы рассказали о том, как метатеги влияют на поисковую оптимизацию, но давайте подведем итоги:

Улучшают видимость в поиске. Правильно заполненные теги Title и Description привлекают внимание пользователей в результатах выдачи, что может увеличить кликабельность ссылки.

Повышают релевантность. Ключевые слова и фразы, включенные в метатеги, помогают поисковым системам понять содержание страницы. Это приводит к лучшему ранжированию.

Обеспечивают корректное отображение контента. Некоторые теги помогают браузерам корректно интерпретировать и отображать контент, что очень существенно для юзабилити.

Заключение

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

Автор: Макхост

Оцените статью