Основы работы с мета-тегами – какие виды мета-тегов существуют и зачем они нужны, как составлять метатеги для Яндекс и Google
Мета-теги – важный элемент HTML-кода страницы (расположен в границах тега <head>...</head>), оказывающий прямое влияние на ранжирование сайта в поисковых системах. Прописываются для каждой страницы, игнорирование атрибутов влечет за собой неуспешную оптимизацию для последующего продвижения как в Яндекс, так и в Google. Рассказываем, как составить мета-теги для сайта и отдельных страниц, какие виды тегов существуют, как правильно их оформлять.
Что такое мета-теги
Мета-теги – служебные элементы кода, которые предоставляют поисковым роботам сведения о странице. При написании мета-тегов title, description и keywords пользователю не придется применять навыки кодинга: современные CMS и панели в конструкторах сайтов позволяют просто ввести текст, все необходимое для HTML-оформления выполняется автоматически без участия человека.
Что такое title, description и keywords
Если при наполнении страниц сайта мета-теги не используются, то поисковые системы смогут создать их автоматически, ориентируясь на контент. Однако лучше выполнять внесение атрибутов самостоятельно, чтобы обеспечить корректность и эффективность SEO, а также достичь достойного отображения в выдаче.
Например, мета-тег title – это поисковый заголовок, его не нужно путать с тегом Н1 (заголовок страницы, который пользователь видит после перехода на сайт из поиска Яндекс или Google). Именно title может отображаться в выдаче и входить в структуру сниппета, что косвенно влияет на кликабельность, общий уровень посещаемости и органический трафик. Мета-теги условно можно разделить на 2 группы:
- технические, за которые отвечает программист: Content-language сообщает о языке контента (современные браузеры определяют язык автоматически), а Robots показывает ботам, какие страницы включать и не включать в индекс. Существует много технических вариаций, без должного опыта не стоит пытаться настроить их самостоятельно;
- SEO-мета-теги, дающие представление о содержимом страницы – это вышеупомянутые title, description и keywords. Влияют на качество ранжирования сайта, а поисковик ориентируется на них, предлагая пользователям релевантный контент.
Виды мета-тегов, которые учитывает Яндекс + title (в этом разделе Справке не указан)
Мета-теги сегодня оказывают меньшее влияние на ранжирование и оптимизацию, чем несколько лет назад, однако поисковики их учитывают. Если атрибуты отсутствуют, отличаются низким качеством или заспамленностью – это негативно скажется на оценке сайта поисковыми ботами и позиции в выдаче.
Зачем используются мета-теги
Создание мета-тегов необходимо преимущественно для поисковых систем, хотя пользователи видят некоторые атрибуты. Когда человек выполняет поиск – система осуществляет считывание тегов, проверяет соответствие контента, который размещен на странице, и подбирает наиболее релевантные ресурсы под запрос. При наличии мета-тегов поисковику легче понимать, какой тематике посвящена статья или что предлагает пользователям страница. Благодаря алгоритмам, человек получает те результаты, которые удовлетворяют его интерес. Мета-теги влияют на:
- отображение страниц в выдаче и место, которое они занимают;
- продвижение по определенным ключевым запросам, которые соответствуют целевой аудитории;
- процесс индексации и дальнейшее включение ресурса в выдачу.
Правильные мета-теги – не гарантия быстрого и успешного продвижения в ТОП. Они эффективно работают в паре с другими СЕО-параметрами – это репутация домена, поведенческие факторы, скорость загрузки сайта и другие. Перечисленные факторы усиливают друг друга: качество каждого повышает общую оценку ресурса.
Какие виды мета-тегов существуют
Мета-тег title (поисковый заголовок)
Title – название (поисковый заголовок), которое указывается для каждой страницы. В выдаче отображается в виде анкорной синей ссылки, расположенной под URL-адресом. После открытия страницы title доступен в названии браузерной вкладки. В Яндекс.Справке указано, что элемент дает представление о релевантности страницы запросу пользователя и общем содержании. Дополнительно – использование в сниппете, в этом случае мета-тег выполняет функцию заголовка, который может создаваться на основе контекста страницы. В HTML-формате title выглядит так:
<head>
<meta name="example" content="..."/>
<title>Что такое разработка сайтов</title>
</head>
Содержание поискового заголовка прямо влияет на решение пользователя о переходе на ту или иную страницу. В связи с этим его написанию нужно уделить особое внимание.
Как выглядит title в поисковой выдаче
Как заполнять title
Длину заголовка определяет ширина экрана, слишком объемные формулировки в результатах выдачи поисковик обрезает. При составлении мета-тега нужно использовать ключевые запросы и преимущества, а также релевантную информацию – пользователь должен сразу понимать, на какой сайт его приглашают и почему он должен выбрать именно его. В Яндекс длина title составляет около 70 символов с пробелами, в Google – 60, в чем и заключается сложность: непросто вместить все важные параметры в строго лимитированный объем. При написании рекомендуется придерживаться следующие правил:
- использование ключевых слов, определенных еще на этапе составления семантического ядра сайта. Однако спам недопустим – 1-2 запросов будет достаточно, не рекомендуется использовать повторы, расходуя ограниченное количество символов на текст без полезной информации;
- удаление всего лишнего. В title не выносят номера телефонов и адреса электронной почты, аналогичные данные. Стоит стремиться к максимально емкому и SEO-оптимизированному поисковому заголовку;
- отказ от шаблонности. Не стоит применять для всех страниц идентичные title с минимальными изменениями. Например, «Название товара – цена, отзывы, фото». Пользователю будет сложно понять, в чем заключается разница между страницами. Если все данные не удается разместить в заголовке – их лучше отправить в описание description. Если последнее будет релевантным, то сможет попасть в сниппет;
- брендированные запросы. В заголовок стоит добавлять наименование компании, что позволит привлечь трафик по брендированным запросам. Яндекс рекомендуется указывать бред в начале или конце title, для разделения можно использовать дефис, двоеточие или вертикальную черту. Дополнительно оттенить фирменный стиль поможет загрузка фавикона.
Проверить, все ли в порядке с поисковым заголовком и описанием, можно в Яндекс.Вебмастере на странице «Заголовки и описания»
Заголовки страниц должны быть уникальными, рекомендуется удалять предлоги, частицы, союзы, вводные слова – все то, что не имеет информационной нагрузки. Рассмотрим на примере, как написать мета-тег title по вводным «купить стол», «купить дешевый стол», «купить стол из дерева»:
- неправильно: «Купить стол, купить дешевый стол, купить стол из дерева прямо сейчас»;
- правильно: «Купить дешевый стол из дерева с бесплатной доставкой и скидкой 5%».
В последнем варианте присутствуют все необходимые слова, объединение запросов (не обязательно размещать их в прямом вхождении) делает заголовок удобочитаемым, предупреждая спам. Дополнительно мы отобразили скидку, что дает существенное преимущество перед конкурентами и демонстрирует выгоду клиентам.
В title (это касается и других атрибутов) желательно использовать минимальное количество знаков препинания: дефисы и двоеточия, а также запятые (в description и keywords) допустимы, а от восклицательных и вопросительных знаков, специальных символов лучше отказаться. Точки применимы только в description, возможно внедрение эмодзи (нескольких будет достаточно), которые разбавляют контент и положительно влияют на кликабельность. Разрешено использование цифр (они улучшают восприятие), можно задавать динамические title, в которых элементы будут периодически изменяться (стоимость товара, количество в наличии, прочее).
Мета-тег description (поисковое описание)
Description – поисковое описание, отображающее содержание страницы. Является логичным продолжением заголовка, но часто игнорируется поисковыми системами. Может отображаться в сниппете, однако если поисковик сочтет нужным – произведет замену, выбрав рандомный фрагмент текста, определенный в качестве релевантного. Аналогично сниппет формируется в случае, если поле description не заполнено.
Каждый description должен быть уникальным внутри сайта по отношению к другим описаниям. Он содержит ключевые слова, все самое важное лучше вынести в начало. Рекомендованная длина – 160-200 символов с учетом пробелов. В HTML выглядит так:
<head>
<meta name="description" content="Ваш текст поискового описания"/>
</head>
Длина описания ограничена шириной экрана устройства пользователя. В него нужно выносить интересную и полезную информацию, полностью соответствующую запросу.
Как заполнять description
Правила составления description аналогичным тем, что актуальны для написания поискового заголовка:
- мета-тег добавляется на все страницы сайта (такое требование есть у Яндекс);
- все описания должны быть уникальными как по сравнению с внешними ресурсами, так и с внутренними страницами. Шаблонные или скопированные у конкурентов description не демонстрируются в результатах поиска, их исключают в качестве низкоинформативных;
- описание должно четко раскрывать содержимое страницы, для которой оно предназначено. Следует убрать переспам, агрессивные рекламные призывы, обилие восклицательных знаков;
- при наполнении больших многостраничных сайтов нужно сначала добавлять description на важные страницы, такие как каталог, главная и схожие;
- description не должен копировать title, он пишется на том языке, который применялся для наполнения страницы.
Рекомендации по написанию description от Яндекс
Рассмотрим пример удачного и неудачного описания по вводным «купить игрушку», «развивающая игрушка для самых маленьких»:
- неудачно: «Игрушка – один из самых важных факторов для детского развития. Игрушка помогает занять ребенка, улучшить мелкую моторику и концентрацию внимания. Почему стоит купить игрушку у нас? В магазине есть большой ассортимент развивающих игрушек для самых маленьких»;
- удачно: «Развивающие игрушки для самых маленьких – купить с доставкой в срок 1-3 дня в любой регион РФ. Большой ассортимент: от деревянных моделей до бизибордов, для новых покупателей скидка 15%».
Для крупных сайтов с большим количеством страниц можно использовать инструменты, выполняющие автогенерацию с привлечением свойств товаров, например, веса, размера и прочих параметров.
Мета-тег keywords (ключевые слова)
Keywords – это ключевые запросы, их указывают через запятую для того, чтобы сообщить поисковым роботам, под какие слова оптимизирован контент на странице. Еще несколько лет назад мета-тег серьезно влиял на SEO-продвижение сайтов, сегодня он утратил свою значимость и во многих CMS уже нет даже поля для его заполнения.
Как заполнять Keywords
Особых инструкций по этому атрибуту нет: добавляйте от 3 до 10 ключевых слов (можно разделять запятыми), которые полностью релевантны продвигаемой странице.
Общие правила создания мета-тегов
Придерживаясь общих правил и учитывая опыт других пользователей, можно достичь отличных результатов в вопросе применения мета-тегов. На помощь придут следующие рекомендации:
- мета-теги не должны быть ни слишком длинными, ни короткими. Развернутые формулировки поисковики обрезают, а title, например, «Купить диван с доставкой» – не информативный, поэтому ожидать высокой кликабельности не стоит;
- нельзя использовать одинаковые title и description для всех или нескольких страниц сайта. Они являются уникальным отображением содержимого, поэтому не могут быть идентичными;
- разрешено комбинирование латиницы и кириллицы, а также применение англоязычных слов в русскоязычных описаниях и заголовках – это может быть название бренда или модель смартфона. Однако если страница наполнена текстом на русском языке, а title, description и keywords написаны н английском или китайском – они являются нерелевантными и будут негативно восприняты поисковиками.
Для упрощения процесса создания, особенно если речь идет о сотнях и десятках страниц, можно привлекать специальные генераторы мета-тегов. Сегодня доступны усовершенствованные версии, в основе которых лежат нейросети. Однако все подготовленные атрибуты нуждаются хотя бы в поверхностной проверке как на ошибки, так и на уникальность.
Где просматривать мета-теги
Мета-теги находятся в открытом доступе, если необходимо посмотреть варианты конкурентов, достаточно следовать инструкции:
- откройте нужный сайт в браузере;
- кликните правой кнопкой мыши на свободную область;
- нажмите «Просмотр кода страницы».
Как посмотреть мета-теги из браузера
В открывшемся окне будет доступна вся информация по поисковому заголовку и описанию, а также ключевым словам. В CMS и конструкторах сайтов указывать, просматривать, изменять мета-теги можно из панели управления/личного кабинета. Рассмотрим, как это работает в конструкторе сайтов Craftum:
- управление SEO-параметрами возможно из двух разделов – это «Настройки страницы» (на этапе создания в графическом редакторе) и «Настройка сайта» (легко открыть из личного кабинета);
- выбираем сайт, для которого будем задавать параметры, кликаем на колесико-шестеренку и переключаемся на SEO;
- здесь можно прописать атрибуты title, description и keywords, после этого доступен как просмотр, так и редактирование. Дополнительно – установка запрета или разрешения на индексацию страницы поисковыми роботами.
Настройка, редактирование мета-тегов в конструкторе Крафтум
По аналогичному принципу работают все современные CMS и конструкторы: добавление мета-тегов со стороны пользователя занимает не более нескольких минут, что существенно упрощает процесс оптимизации. Многие сервисы дополнены AI инструментами, например, в Craftum есть ИИ-помощник, способный моментально перефразировать любой текст (поддерживается графическим редактором), но без потери смысла.
AI-помощник для перефразирования в один клик
В заключение
Мета-теги – важный элемент SEO-продвижения, который дает дополнительные подсказки поисковым роботам и позволяет продемонстрировать релевантность страниц запросам. Поисковые системы могут учитывать и не учитывать атрибуты, изменять их автоматически. Исключительно мета-теги не являются залогом успеха, но они эффективно работают вместе с комплексом мер – от правильно оптимизированного текстового наполнения до скорости загрузки и поведенческих факторов. Корректное оформление title, description и keywords обеспечивает быстрое распознавание подходящих сайтов для пользователей, укрепляет позиции в выдаче, позволяет повысить кликабельность и объем органического трафика.