какие мета теги нужно прописывать на сайт
Важные мета-теги для SEO-оптимизации сайта
Какие мета-теги обязательны для поисковой оптимизации, а без каких можно обойтись
Когда речь заходит о мета-тегах и мета-данных, нередко возникает путаница — начинающие специалисты оптимизируют все содержимое в рамках тега HEAD с элементом META (или вообще ничего здесь не оптимизируют). Давайте разберемся, какие мета-данные действительно важны для SEO-оптимизации, а какие можно обойти вниманием.
Что такое мета-теги?
Мета-теги (от англ. «meta tags») используются для того, чтобы структурировать сопроводительные данные о странице.
В основном мета-теги рассчитаны на роботов, браузеры, специализированное ПО — чтобы те корректно «прочли» и обработали представленную информацию. Но некоторые мета-теги важны и для пользователей. Например, содержимое Title выводится в описании страницы на вкладке браузера, а также в качестве заголовка сниппета в результатах поиска.
Мета-данные располагаются в разделе HEAD наряду со скриптами, стилями и линками.
Широкое применение получили три группы мета-тегов:
Для маркетологов, владельцев площадок, SEO-специалистов — тех, кто занимается поисковой оптимизацией сайтов и не имеет отношения к профессиональной разработке — важно запомнить и учитывать только атрибут NAME и теги title, description, robots, keywords, viewport. Если же вы хотите углубиться в мета-данные, начните с обзорной статьи на Википедии.
Мета-теги для SEO
Title
Формально title — не мета-тег, но он размещается в разделе HEAD, поэтому о нем чаще всего говорят именно с приставкой «мета».
Title — самый важный тег для SEO. Заполняйте его для всех страниц сайта!
Информация из title учитывается поисковыми системами при определении релевантности документа. На странице она не выводится, но всегда отражается в результатах поиска, а также в качестве заголовка в браузере — в этом принципиальное отличие от description (о нем мы расскажем ниже), информация из которого выводится на усмотрение поисковика.
Синтаксис тега title:
Отображаемая длина title (символов с пробелами):
Длина заголовка title ограничений не имеет, но с точки зрения SEO важно, чтобы в первых 45-50 символах была законченная мысль. Это позволит пользователям из поиска Яндекса/Google без проблем понимать, о чем страница.
Заголовок title должен быть информативным, точно описывать содержимое страницы, включать главное ключевое слово, но без переспама.
О принципах составления title мы подробно писали в выпуске рассылки «Эффективные заголовки для SEO-продвижения». Рекомендуем ознакомиться для получения дополнительного преимущества в поисковой выдаче.
Description
Description — это мета-описание страницы. Для SEO этот тег один из ключевых.
Раньше Google и Яндекс при формировании сниппета в результатах поиска выводили информацию из description. Но оптимизаторы быстро поняли, что с помощью description можно манипулировать выдачей. Кроме того, многие владельцы сайтов недобросовестно подходили к заполнению этого мета-тега: вставляли первый абзац из текста, копировали title или вообще игнорировали его.
В итоге Яндекс перестал формировать описания только на основе description — теперь учитывается весь контент страницы.
Google по-прежнему выводит description в сниппете — но при условии, что он заполнен качественно. В противном случае подтянется релевантный, по мнению Google, контент со страницы.
Но это вовсе не означает, что description утратил свою значимость для SEO. Роботы Яндекса и Google по-прежнему сканируют содержимое description и учитывают его при определении релевантности документа.
Как оптимизировать все мета-теги на сайте и не утонуть в рутине? Подключите SEO-модуль в системе PromoPult. Все инструменты для улучшения качества сайта и поискового продвижения, автоматизация процессов, чек-листы, подробные отчеты.
Какова длина мета-тега description
В руководствах для вебмастеров Яндекса и Google вы не найдете ни единого слова по поводу длины мета-описаний. Более того, отображаемая длина описаний в сниппетах постоянно меняется: например, в 2017 году Google расширил ее до целых 300 символов, а в 2018 году — укоротил до 160.
Поэтому при определении оптимальной длины мета-тега description приходится опираться на эмпирические данные и здравый смысл.
Состоянием на начало 2020 года отображаемая длина описания сниппета в результатах поиска (в символах с пробелами):
Чтобы сделать сниппеты информативными, лучше самую важную информацию добавлять в первые 100-120 символах мета-тега description, а не 160-170 — как принято считать.
Фактическая длина description может превышать и 300, и 500 символов — но нет смысла тратить ресурсы на увеличение мета-описаний, поскольку пользователи все равно не увидят эту информацию (поисковики же могут воспринять ее как спам). Лучше направьте усилия на SEO-оптимизацию контента и повышение его качества.
Title и description должны выгодно выделять ваш сайт на фоне конкурентов. Узнать, какие мета-теги используют конкуренты, можно в один клик с помощью специального инструмента. Первые 500 запросов — бесплатно! Как пользоваться инструментом — с советами и примерами — мы описали в гайде.
Как правильно составлять description
Для того чтобы мета-описание помогло продвинуть сайт, придерживайтесь таких правил:
«Наличие мета-тегов с некачественным содержанием может стать причиной удаления страницы из результатов поиска» — справка Яндекса.
Больше рекомендаций по заполнению dеscription и управлению сниппетом вы найдете в этом выпуске нашей рассылки.
Robots
С помощью этого мета-тега можно разрешать или запрещать поисковым роботам индексировать страницы и переходить по размещенным ссылкам.
Мета-тег robots может принимать такие значения (их понимает и Яндекс, и Google):
Кроме того, есть значения (директивы), которые понимают только отдельные поисковики. Например, только Google поддерживает такие директивы:
Подробно о директивах Google читайте в спецификации для разработчиков.
В Яндексе тоже есть «специфические» директивы:
Подробно о директивах Яндекса читайте в справке.
Синтаксис мета-тега robots такой:
Изменяя значения мета-тега robots, можно управлять индексацией, причем поисковые системы следуют указаниям в этом теге, в отличие от директив в robots.txt, которые носят рекомендательный характер.
Значения мета-тега robots понимают все поисковые системы. Также можно задать правила индексирования только для:
Если мета-тег robots не прописан, поисковые роботы по умолчанию индексируют страницу и переходят по ссылкам на ней. При обнаружении конфликтующих значений роботы выберут положительное из них. Например, если одним мета-тегом запрещается индексация, а вторым разрешается, то робот проиндексирует страницу.
Для лучшей оптимизации мета тегов необходимо проверить, нет ли на вашем сайте ошибок. Проведите аудит сайта онлайн и исправьте все найденные ошибки.
Keywords
На заре развития поисковых систем этот мета-тег играл важную роль в ранжировании. Интересно, что Яндекс до сих пор учитывает содержимое этого мета-тега при определении соответствия страницы поисковым запросам, хотя по факту влияния на позиции keywords не оказывает.
Вместе с тем Яндекс предупреждает о том, что если заполнить его откровенным спамом — большим числом ключевых слов — это может привести к пессимизации страницы или исключению ее из индекса.
Если вы решили заполнять keywords, учитывайте синтаксис:
Не указывайте более 10 ключевых слов. Кроме того, прописанные ключевые слова должны присутствовать в тексте страницы.
Viewport
Этот мета-тег стал особенно актуальным после начала учета поисковиками мобильной адаптации в качестве фактора ранжирования. В обычной практике SEO-специалисту вряд ли придется прописывать этот мета-тег — это задача разработчиков шаблона. Но знать о его существовании все же нужно.
Итак, если сайт адаптирован под просмотр на мобильных, в разделе HEAD будет прописан мета-тег viewport такого вида:
Здесь значение device-width атрибута width дает команду браузеру подогнать ширину окна под ширину экрана устройства. Значение 1 атрибута initial-scale запрещает масштабирование окна (например, при повороте экрана).
Больше узнать о мобильной адаптации вы можете из статей:
Мета-теги для разметки Open Graph
Эта разметка важна для повышения привлекательности контента при расшаривании его в соцсетях. Например, так может выглядеть ссылка в Facebook на страницу без Open Graph разметки:
А вот уже расшаренная ссылка на страницу с Open Graph:
Open Graph поддерживают все ведущие соцсети — Facebook, ВК, Twitter, Pinterest и проч.
Вот фрагмент кода с Open Graph:
Поробно о синтаксиске и правилах составления этой разметки читайте в нашем гайде.
H1-H6 — полезные для SEO теги
Это не мета-теги. Они прописываются в разделе BODY — то есть их значения являются контентом и видны пользователям. Но раз уже речь идет о SEO, их нельзя обойти стороной.
H1-H6 — это теги логической структуры документа. На каждой странице обязательно должен быть один заголовок, заключенный в тег H1. Подзаголовки заключаются в теги H2-H6 и добавляются на страницу опционально (если того требует логика построения документа и изложения).
Заголовок первого уровня
Заголовок второго уровня
Заголовок третьего уровня
При расстановке тегов H1-H6 обязательно должна соблюдаться очередность: например, после H1 идет только H2, а после H2 — только H3.
Часто у начинающих SEO-специалистов возникает вопрос: title и H1 — это одно и то же? Нет — тег title прописывается в разделе HEAD, а не BODY, и именно его используют роботы при формировании сниппета. Вместе с тем текст, заключенный в теги title и H1, обычно частично (реже — полностью) дублируется.
Проверьте все мета-теги на сайте
Для грамотной технической оптимизации сайта не нужно лезть в дебри мета-данных. Достаточно знать базовые для SEO мета-теги — description, robots, keywords (опционально), мета-теги для разметки Open Graph, теги title, h1-h6, а также знать о теге viewport. В 99% случаев это исчерпывающий список SEO-тегов.
Для того чтобы быть уверенными в правильности заполнения указанных мета-данных, рекомендуем провести SEO-аудит сайта, который можно заказать в PromoPult от 4000 рублей.
Помимо проверки корректности заполнения мета-тегов, специалист проанализирует:
В итоге вы получите развернутый отчет с рекомендациями по правильной оптимизации сайта.
Мета-теги
Правильная настройка мета-тегов очень важна для SEO. Работы по заполнению, прописыванию, корректировке мета-тегов всегда выполняются при запуске проекта, сразу после того, как собрано семантическое ядро. И продолжаются по мере необходимости в течение всего периода продвижения сайта. Иногда достаточно лишь небольших изменений в метатегах, чтобы сайт вышел в ТОП10. Особенно это актуально для низкочастотных запросов, а также в тех случаях, когда сайт уже находится достаточно высоко по данному запросу (например, 11-15-я позиция в поисковой выдаче), и нужно совсем немного, чтобы выдвинуть его в ТОП. Зачастую под SEO-тегами подразумеваются Title, Description и Keywords. Однако тегов намного больше. И в этой статье мы постараемся охватить этот вопрос максимально полно.
Содержание
Что такое мета-теги
К тегам мета относятся:
Подробнее можно прочитать в справке по HTML или Википедии.
На хабрахабр приводится такое определение: meta-теги — это необязательные атрибуты, размещенные в заголовке страницы, которые могут содержать ее описание, ключевые слова к ней, информацию об авторе, управляющие команды для браузера и поисковых роботов, и прочую служебную информацию, не предназначенную для посетителей.
Мета-теги (англ. meta tags, досл. служебные ярлыки) — это служебные слова, которые содержат важную информацию о веб-документе для поисковых систем. К таким словам (тегам) относятся теги Title, Description, Hx, Robots, Canonical.
Правильные SEO мета-теги для Яндекса и Google
Рассмотрим, как правильно написать мета-теги для сайта, как их добавить и разместить в коде. Нас будет интересовать:
Следует отметить, что в большинстве CMS (систем администрирования сайта), есть специальные поля для заполнения мета-тегов, и вам не нужно прописывать их непосредственно в HTML-коде. От вас потребуется только вписать содержание тега (Title, Description, Keywords, H1, Canonical) или выбрать подходящее значение (Index/NoIndex, Follow/NoFollow). Однако следует проверять, корректно ли размещаются теги: 1) в правильных местах, 2) правильный синтаксис, 3) значения в тегах соответствуют вашим настройкам. Причем следует проверить не только на главной странице, но и на различных внутренних страницах. Например, у нас сайт интернет-магазин. В этом случае обязательно нужно проверить, корректно ли размещаются мета-теги на главной странице, внутренних информационных, страницах категорий и товаров, поскольку веб-документы каждого из этих типов могут формироваться по своему отдельному шаблону.
Теперь подробнее о каждом из тегов.
Мета-тег Title
Это самый главный тег, который больше других влияет на продвижение сайта по ключевым словам. В большинстве случаев именно этот текст используется в заголовке сниппета, как показано в примере ниже. (Но не всегда, в заголовок так же может быть выведено содержание тега H1 или даже H2, H3).
Синтаксис
Тег должен находиться внутри контейнера … в любом месте.
Требования SEO
Примеры правильного заполнения тегов
Ошибки и неудачные примеры мета-тегов
Мета-тег Description
Так же один из важных тегов для продвижения страницы по ключевым словам. Описание может использоваться в сниппете.
Однако текст в сниппет может быть подставлен и из контентной части страницы, если поисковик решит, что это предпочтительнее. При этом, независимо от того, выводится в сниппет описание из тега description или из текста, то, как составлен метатег описания, оказывает влияние на ранжирование страницы в поиске.
Пример, когда description в мета и в сниппете отличаются:
Синтаксис
Тег должен находиться внутри контейнера … в любом месте.
Требования SEO
Примеры правильного заполнения тегов (полужирным выделены ключевые слова)
Ошибки и неудачные примеры мета-тегов
Мета-тег H1
Еще один очень важный тег. В нем лучше всего размещать главный, максимально частотный запрос, по которому продвигается данная страница. Заголовок страницы чаще всего должен содержать 1-3 слова. Исключение — страницы статей, товаров, проектов и т.п. То есть страницы, продвигаемые под более специфические, менее частотные запросы.
Синтаксис
Как правильно писать мета теги для сайта
Метатеги (от англ. meta tags) — элементы HTML-кода, которые сообщают поисковому роботу и браузеру дополнительные данные о документе: описание страницы, ключевые слова, команды для индексирования, авторство, прочую служебную информацию. Какой-либо внятной классификации метатегов не существует — любой web-мастер может придумать оригинальный элемент и прописать его в коде. Но язык HTML за 30 лет своего существования все же оброс устоявшимися метатегами, которые употребляются чаще других и одинаково понимаются всеми алгоритмами. Такие универсальные элементы кода могут влиять на продвижение сайта, поэтому представляют интерес для сеошников.
В этой статье мы расскажем, какие html-теги полезны при поисковом продвижении, как грамотно прописывать их в документе и как проверить метатеги на сайте.
Содержание
Правильные метатеги для SEO
SEO-метатеги напрямую не влияют на работу сайта. В принципе, их можно игнорировать — никакой катастрофы не случится кроме того, что ваш ресурс будет болтаться где-то на задворках мироздания. Если ваша цель — десятка топа Google или Яндекса, то правильное заполнение Title и Description становится обязательной частью работы над продвижением, особенно по низкочастотным запросам. Тем более, эти два тега, в отличие от других, видят не только поисковые роботы, но и пользователи на странице выдачи.
Как правильно прописывать метатеги для продвижения сайта? У каждого элемента кода, влияющего на SEO, есть свои особенности оформления, но, прежде чем их разбирать, выделим общие правила работы с семантикой:
Title
В SEO тег играет первостепенную роль. Title — это заголовок страницы, который пользователь видит:
Это крючок с приманкой, на которую должен клюнуть пользователь. Если тайтл зацепил, то человек гарантированно перейдет по ссылке на ваш сайт. Но при этом заголовок должен полностью соответствовать содержанию страницы и быть понятным для людей и робота, который по тайтлу определяет релевантность запросу.
Синтаксис
Строго говоря, Title не является метатегом, но прописывается в контейнере HEAD и не отображается в теле документа на ресурсе. В этом его главное отличие от тега H1, который, по сути, тоже является заголовком, но отображается непосредственно на странице сайта.
Если тайтл не заполнить, в заголовок сниппета подтянется URL — адрес страницы, а это плохо повлияет на ранжирование и поведенческие факторы.
Принципы заполнения Title
Впадать в другую крайность и делать тайтл слишком коротким — тоже плохая идея, так вы не используете заголовок на полную катушку.
Description
Метатег — это краткое описание содержимого страницы, которое отображается в сниппете и раскрывает суть тайтла. Важно, чтобы он не повторял заголовок.
Дескрипшн не обязательно шпиговать ключами — текст должен быть ориентирован на пользователя. Это своего рода замануха, прочитав которую, человек захочет продолжения уже на вашей территории. Удачное описание влияет на CTR — показатель кликабельности сайта. Чем больше кликов — тем выше ранжируется страница в выдаче, поэтому метатег description важен для продвижения сайта. Он улучшает поведенческие факторы.
Синтаксис
Description помещается в контейнер HEAD, поэтому не отображается в теле страницы.
Если этот метатег не прописывать, никто не умрет — умные поисковые роботы выберут лучшие отрывки на вашей странице и явят их миру в сниппете. Скажем больше, далеко не всегда строптивые роботы послушно подтягивают прописанный дескрипшн в сниппет, часто они ставят абзац со страницы, потому что считают, что он более релевантен запросу.
Принципы заполнения Description
Keywords
Метатег, который когда-то был залюблен сеошниками до смерти. Из-за адовых злоупотреблений поисковикам пришлось от него отказаться. По сути, это список ключей, по которым продвигается страница. Все просто и незамысловато: робот читал список ключевиков и понимал, для каких запросов страница будет релевантна. В итоге в этот метатег напихивали столько всякого добра, что поисковым системам стало проще прикрыть лавочку, чем вычищать эти авгиевы конюшни. На данный момент метатег Keywords не учитывается при индексации и не влияет на ранжирование. R.I.P.
Полезные технические метатеги
Технические метатеги влияют на продвижение сайта опосредованно. Они регулируют работу поисковых роботов и определяют отображение страницы на экране.
Robots
Метатег robots указывает поисковым алгоритмам, как индексировать страницу. Индексирование — это добавление документа в базу поисковой системы, откуда впоследствии страница будет попадать в поиск по релевантным запросам. По умолчанию робот заносит в индекс все тексты и линки на странице, но на этот процесс можно влиять, прописывая в метатеге директивы. Если вы по какой-то причине не хотите, чтобы текст или ссылки попали в индекс (например, в случае, когда это дубли страниц или «плохие» ссылки, из-за которых вам светит фильтр), то нужно прописать метатег robots.
Синтаксис
Robots помещается в контейнер HEAD:
Здесь команда noindex запрещает индексацию страницы. Как прописать другие директивы в метатеге robots для индексации сайта? Вместо noindex подставляйте нужное значение:
Можно давать команды конкретным поисковым алгоритмам, вписывая вместо «robots» «googlebot» или «yandex». Правда есть одно НО. Google считает содержание метатега robots просто добрыми советами и может их проигнорировать, Яндекс в этом плане более послушный и предсказуемый.
Viewport
Если вы не знаете, как настроить корректное отображение сайта для мобильных устройств, метатег viewport может в этом помочь. Он задает видимую область страницы, ориентируясь на ширину экрана. С тегом viewport пользователю не нужно совершать лишних телодвижений, масштабировать изображение, пользоваться неудобной горизонтальной прокруткой.
Мобилопригодность сайта официально признана поисковиками важным фактором ранжирования, и метатег viewport стал маст хевом у seo-специалистов. Если страница не адаптирована, не ищите ее в топе.
Charset и Content-type
Эти теги защищают страницу от траблов с кодировкой. Все, наверное, сталкивались с проблемой, когда на экране вместо текста появляются странные кракозябры. Чтобы не получилось, как в шпионском романе, и буквы родного алфавита корректно отображались на сайте, нужно сделать метатеги Charset или Content-type и указать в них тип кодировки. Обычно используют общепринятую кодировку UTF-8.
Метатеги, регулирующие кодировку документа, никак не учитываются при ранжировании поисковиками, но все же их отсутствие может сыграть злую шутку в продвижении. Пользователь, пришедший на страницу и обалдевший от невероятной красоты кракозябр, быстро унесет ноги с вашего сайта. Это отказ, а поисковики страсть как не любят отказы, поэтому не пустят ваш битый ресурс в топ.
Refresh
Суть метатега Refresh в переадресации пользователя на другую страницу через заданный промежуток времени. Это может быть нужно:
Meta Refresh дискредитировал себя, т.к. с его помощью создавались черные дорвеи. Сейчас Google настоятельно не рекомендует использовать этот метатег для переадресации. Неповиновение грозит штрафными санкциями и потерей позиций в выдаче. Google советует использовать серверный 301-редирект. Яндекс не так категоричен и допускает корректное использование этого метатега в честных целях.
Author и Copyright
Все метатеги идентификации прописываются в контейнере HEAD и видны только роботам, которые на свое усмотрение могут подтянуть полезную информацию в сниппет:
Поисковики любят авторские уникальные тексты, поэтому именные публикации и прописанный в метатеге автор добавляют странице позиции в выдаче. Чем известнее и авторитетнее имя, тем проще продвигается сайт.
Другие теги и атрибуты сайта
Теги иерархии H1 и H2–H6
Теги H1–H6 не относятся к meta, располагаются в разделе HTML-кода BODY и отображаются на странице в виде заголовков и подзаголовков текста. Они задают иерархию и логическую структуру документа, поэтому их применение крайне желательно, а наличие заголовка H1 обязательно. Теги иерархии делают чтение удобным для людей, улучшают поведенческие факторы. Поисковый бот тоже любит понятную логику и выше оценивает хорошо структурированные страницы.
В заголовках всех уровней полезно использовать высоко- и среднечастотные ключи, только вписывать их нужно естественно, избегая переспама.
Размечая структуру текста тегами, нужно не запутаться в иерархии. H1 в документе должен быть только один. Это главный заголовок, отличающийся от Title формулировкой, но сохраняющий самую суть содержания страницы.
Подзаголовки нижних уровней H2–H6 располагаются в строгой последовательности. Если вы прописываете один H2, то дальше должен быть хотя бы еще один заголовок второго уровня. Это же правило работает для всех остальных уровней.
Самый главный заголовок
Важный заголовок №1
Подзаголовок №1
Подзаголовок №2
Важный заголовок №2
Подзаголовки ниже третьего уровня встречаются очень редко, разве что в лонгридах со сложной структурой.
Canonical
Этот тег прописывается в разделе HEAD и показывает роботу, какую страницу считать канонической. Тег canonical полезен, когда один и тот же товар попадает в разные разделы магазина, и страница с ним дублируется на сайте с разными URL. Например:
Чтобы поисковик не влепил санкции за дубли, в коде обеих страниц прописывается URL того документа, который нужно считать каноном, например:
Next и Previous
По последним данным ни Яндекс, ни Google уже не поддерживают такую разметку пагинации, но поисковики помельче все еще учитывают атрибуты next и prev при индексации.
Как и куда добавить метатеги на сайте
В HTML-коде все метатеги размещаются в начальном контейнере вместе со стилями, ссылками, скриптами документа. Очередность, определяющая, как писать метатеги для сайта в коде, не имеет значения. Количество тегов группы meta тоже не регламентируется. Единственное, что важно помнить, для каждой страницы они прописываются отдельно.
Как правильно писать метатеги для сайта? Лучше, когда в код их добавляет web-мастер, а содержимое продумывает seo-специалист. Существует два способа прописать нужные теги: ручной и автоматический.
Когда сайт только создается, или это небольшой ресурс с обозримым количеством страниц, добавить вручную несколько строчек кода несложно. Но как добавить сотни метатегов на страницы большого интернет-магазина или огромного информационного ресурса? Разработчики CMS (систем управления сайтом) предлагают свои инструменты автоматизации разной степени понятности и удобства.
Для автоматического прописывания метатегов на WordPress нужно установить плагин Yoast SEO или All in One SEO Pack. У 1С-Битрикс и Joomla есть собственные SEO-модули с доступом к управлению метатегами.
Как проверить метатеги на странице
Чтобы посмотреть, как прописаны метатеги на сайте и проверить их корректность, нужно или нажать правой кнопкой мыши на любую область страницы и перейти по вкладке «Исходный код страницы» или нажать Ctrl+U. В открывшемся окне с кодом нужно найти контейнер и в его границах искать знакомые названия метатегов.
Видео про метатеги
Специально для новичков в SEO мы подготовили видео-инструкцию по проверке метатегов сайта. В ней подробно рассказываем:
Выводы
Мы разобрались, какие метатеги нужно прописывать на сайт для его грамотного продвижения. Часть из них непосредственно влияет на оптимизацию и позиции в выдаче, часть — косвенно, улучшая поведенческие факторы и привлекательность страницы для пользователей. Но это только одна из многочисленных граней SEO. Главное, это качество сайта в целом. Код, юзабилити, контент, навигация — если человеку и поисковой системе понравится взаимодействие с вашим ресурсом, то он выйдет в топ, если нет, не помогут никакие метатеги.