Meta теги


Правильная настройка мета-тегов очень важна для SEO. Работы по заполнению, прописыванию, корректировке мета-тегов всегда выполняются при запуске проекта, сразу после того, как собрано семантическое ядро. И продолжаются по мере необходимости в течение всего периода продвижения сайта. Иногда достаточно лишь небольших изменений в метатегах, чтобы сайт вышел в ТОП10. Особенно это актуально для низкочастотных запросов, а также в тех случаях, когда сайт уже находится достаточно высоко по данному запросу (например, 11-15-я позиция в поисковой выдаче), и нужно совсем немного, чтобы выдвинуть его в ТОП. Зачастую под SEO-тегами подразумеваются Title, Description и Keywords. Однако тегов намного больше. И в этой статье мы постараемся охватить этот вопрос максимально полно.

Содержание

  • Что такое мета-теги
  • Правильные SEO мета-теги
    • Мета-тег Title
    • Мета-тег Description
    • Мета-тег H1
    • Мета-теги H2, H3, H4, H5, H6
    • Мета-тег Robots (All, Follow, Nofollow, Index, Noindex, None, NoArchive, NoYaca)
    • Мета-теги Canonical, Next, Previous

  • Устаревшие мета-теги
    • Мета-тег Keywords
    • Мета-тег NoODP
  • Другие полезные мета-теги
    • Мета-тег Viewport
    • Мета-тег NoYDIR
    • Мета-тег Generator
    • Мета-теги Author и Copyright
  • Как проверить мета-теги в коде веб-страницы
  • Шаблоны мета-тегов

 

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

Если быть предельно точным, то под мета-тегами следует понимать (X)HTML-теги <meta>, с помощью которых можно указать служебную информацию о странице. Такая информация размещается внутри контейнера <head>…</head> и не выводится на экран.

К тегам мета относятся:

  • description — описание веб-страницы,
  • keywords — ключевые слова,
  • http-equiv — тип отправляемого документа и кодировка (charset),
  • generator — CMS сайта,
  • author — автор,
  • copyright — авторские права,
  • robots — правила индексирования страницы для роботов,
  • viewport — данные о настройке области просмотра
  • и другие.

Подробнее можно прочитать в справке по HTML или Википедии.

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

В этой статье мы не будем точны с технической точки зрения и к мета-тегам отнесем те служебные теги, которые 1) важны в SEO и 2) используются в любом месте веб-документа, т.е. не обязательно привязаны к контейнеру <head>. В связи с этим, приведем такое определение.


Мета-теги (англ. meta tags, досл. служебные ярлыки) — это служебные слова, которые содержат важную информацию о веб-документе для поисковых систем. К таким словам (тегам) относятся теги Title, Description, Hx, Robots, Canonical.

 

Правильные SEO мета-теги для Яндекса и Google

Рассмотрим, как правильно написать мета-теги для сайта, как их добавить и разместить в коде. Нас будет интересовать:

  • синтаксис — то, как правильно должен быть прописан мета-тег в HTML-коде сайта;
  • требования поисковых систем к тегам;
  • примеры правильного и неправильного заполнения тегов.

Следует отметить, что в большинстве CMS (систем администрирования сайта), есть специальные поля для заполнения мета-тегов, и вам не нужно прописывать их непосредственно в HTML-коде. От вас потребуется только вписать содержание тега (Title, Description, Keywords, H1, Canonical) или выбрать подходящее значение (Index/NoIndex, Follow/NoFollow).


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

Теперь подробнее о каждом из тегов.

 

Мета-тег Title

Это самый главный тег, который больше других влияет на продвижение сайта по ключевым словам. В большинстве случаев именно этот текст используется в заголовке сниппета, как показано в примере ниже. (Но не всегда, в заголовок так же может быть выведено содержание тега H1 или даже H2, H3).

мета тег Title
метатег Title

Синтаксис

<title>Содержимое мета-тега Title</title>

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Требования SEO


  • Заголовок должен быть уникальным на всех страницах сайта, а также не повторять Title на страницах других сайтов (для этого в конце Title можно добавить название организации).
  • Тайтл должен отражать суть страницы, должен быть информативным и кратким.
  • Должны присутствовать запросы, по которым продвигается данная страница, самые важные размещаем в начале тега, заголовок должен обязательно содержать 1-3 ключевых слова.
  • Не включайте в Title слишком много ключевых слов
  • Содержимое тегов Title и H1 должно быть разным — у них разные цели: Title заголовок для сниппета, H1 заголовок веб-страницы.
  • Не используйте специальных символов, пока не убедитесь, что они поддерживаются.
  • Не используйте спецсимволы (= / + _ ), знаки препинания и стоп-символы (точка, двоеточие, восклицательный и вопросительный знак) — помните, это знаки, которые разбивают пассажи в Title, что снижает взаимосвязь ключей по разные стороны от стоп-знака.
  • Составляйте тег Title для людей по всем правилам русского языка, заголовок по возможности нужно делать цепляющим и привлекательным.
  • Оптимальная длина Title – от 30 до 65 символов. Google ориентируется на длину в пикселях, рекомендуемая длина — от 200 до 571 пикселей. Если длина Title больше, то в сниппете появляется многоточие, которое также занимает дополнительное место в заголовке. Оно может появиться как в конце заголовка сниппета, так и в начале. Короткие Тайтл тоже плохо, поскольку в него помещается мало ключей. НО: при этом нет смысла придерживаться оптимальных значений длины заголовка для служебных страниц на сайте, которые НЕ продвигаются по ключевым словам.

Примеры правильного заполнения тегов

  • <title>Купить сантехнику в Москве, интернет-магазин Куписантехнику.Ру</title>
  • <title>Окна REHAU в Москве, официальный сайт партнера — Пластиковые окна недорого</title>
  • <title>Мета-теги для сайта, Title и Description в примерах — SEOgio</title>
  • <title>Элемент пола Кнауф — купить в Москве по цене 310 pуб | KNAUF</title>
  • <title>Новости — Компания Ромашка</title>

Ошибки и неудачные примеры мета-тегов

  • <title>Евроремонт, ремонт дома, ремонт квартир в Смоленске, ремонт в Смоленске | Ремонт квартир, cтроительство Смоленск</title> (простое перечисление ключевых слов)
  • <title>Главная – ООО Ромашка, подарки оптом, подарки сотрудникам, рекламные сувениры, корпоративные подарки.</title> (вначале должны быть самые главные ключевые слова)
  • <title>Ремонт</title> (слишком короткий Title)
  • <title>«Автомоечный комплекс №1»: автомойка, шиномонтаж, кафе, сауна, комната отдыха.</title> (название компании вначале, двоеточие, слова, по которым не будет продвигаться сайт)
  • <title>Новости о юридических услугах и бухгалтерском обслуживании в компании Ромашка</title> (использование ключевых слов в заголовке страницы, которая по этим словам НЕ продвигается, это может только мешать)

 

Мета-тег Description

Так же один из важных тегов для продвижения страницы по ключевым словам. Описание может использоваться в сниппете.

Пример:
метатег Description
мета тег Description

Однако текст в сниппет может быть подставлен и из контентной части страницы, если поисковик решит, что это предпочтительнее. При этом, независимо от того, выводится в сниппет описание из тега description или из текста, то, как составлен метатег описания, оказывает влияние на ранжирование страницы в поиске.

Пример, когда description в мета и в сниппете отличаются:
метатег Description


мета тег Description

Синтаксис

<meta name="description" content="Содержимое мета-тега Description" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Требования SEO

  • Должен отражать суть страницы, написан в виде согласованного текста. Может быть несколько предложений.
  • Должен быть уникальным для всех страниц сайта, не дублировать аналогичные теги на других сайтах (для этого используем название компании в тексте мета-тега).
  • В теге нужно использовать запросы, по которым продвигается данная страница, однако делать это необходимо так, чтобы они были использованы естественным образом, в нужной морфологии. Также не следует просто перечислять запросы через запятую.
  • Содержание тега не должно повторять Title.
  • Длина description должна быть не менее 70 и более 150-200 символов. Google определяет длину в пикселях, рекомендуемая длина от 400 до 930 пикселей.
  • В description желательно отразить основные преимущества компании, товара, услуги.
  • Наиболее важную информацию и фразы лучше разместить в начале мета-описания.

Примеры правильного заполнения тегов (полужирным выделены ключевые слова)


  • <meta name=»description» content=»Мебель для спальни: огромный выбор моделей по ценам производителя. Заказывайте мебель в интернет-магазине ЛайфМебель с доставкой по России и Москве!» />
  • <meta name=»description» content=»Тег meta description используется для формирования мета-описания страницы сайта в сниппетах Яндекса и Google. Разберем как правильно писать мета description.» />
  • <meta name=»description» content=»Купить микроволновую печь GORENJE MO20MW в интернет-магазине ЭЛЬДОРАДО с доставкой и гарантией. Ознакомиться с ценами, отзывами владельцев, фотографиями, техническими характеристиками и подробным описанием.» />

Ошибки и неудачные примеры мета-тегов

  • <meta name=»description» content=»Смоленский завод железо-бетонных изделий №2 (ЖБИ-2)» /> (короткий, мало ключевых слов)
  • <meta name=»description» content=»Матрасы в Смоленске. ОРТОПЕДИЧЕСКИЕ МАТРАСЫ. Матрас — это единственный предмет в обстановке спальни, который непосредственно связан со здоровьем. Некачественный или просто старый износившийся матрас может привести к очень серьезным проблемам, в то же время благодаря тщательно подобранному матрасу значительно улучшаются …» /> (сгенерирован автоматически, просто вырезано начало контента на странице)

  • <meta name=»description» content=»Салон красоты ЛЕАЛЬ самый лучший Салон красоты москвы, салон красоты, парикмахерская, парикмахерская москва, стрижка в москве, похудеть москва, стрижка не дорого, как похудеть, похудеть москва,»/> (перечисление ключевых слов через запятую, неестественное мета-описание)

 

Мета-тег H1

Еще один очень важный тег. В нем лучше всего размещать главный, максимально частотный запрос, по которому продвигается данная страница. Заголовок страницы чаще всего должен содержать 1-3 слова. Исключение — страницы статей, товаров, проектов и т.п. То есть страницы, продвигаемые под более специфические, менее частотные запросы.
Синтаксис

<h1>Содержимое мета-тега H1</h1>

Тег должен находиться внутри контейнера <body>…</body> в любом месте.

Требования SEO

  • Тег должен использоваться РОВНО один раз на странице.
  • Отсутствие тега <H1> является ошибкой.
  • В теге <H1> должно быть использовано главное ключевое слово на странице
  • Рекомендуемая длина тега не более 70 символов (однако это не значит, что использовать длинные теги запрещено).
  • Теги <H1> рекомендуется делать уникальными.
  • Для товаров желательно указать в теге <H1> самые главные характеристики товара (длина, ширина, цвет, модель).

Примеры правильного заполнения тегов

  • <H1>Автополив газонов</H1>
  • <H1>Пусковой комплект микроорошения XCZ-075 PRF, 3/4″</H1>
  • <H1>Новости</H1>

Ошибки и неудачные примеры мета-тегов

  • <H1>Автополив газонов в Москве купить</H1>
  • <H1>Автополив газонов, авто полив газонов, купить, цены</H1>
  • Автополив газонов<H1></H1>
  • <H1>Автополив газонов<H1>

 

Мета-теги H2, H3, H4, H5, H6

Синтаксис

<h2>Содержимое мета-тега H2</h2>

Теги должен находиться внутри контейнера <body>…</body>.

ВАЖНО! Должна соблюдаться иерархия тегов (цифры — это уровни, как показано ниже). Теги Hx используются именно как заголовки в содержательной части страницы. Если они используются как элементы оформления на сайте, необходимо заменить их на теги <DIV> с аналогичными классами оформления (визуально все сохранится так же, а логика размещения информации на странице будет соблюдена).

Пример:

  1. H1 — заголовок страницы (один!)
    1. H2 — заголовок второго уровня
      1. H3 — заголовок третьего уровня
      2. H3 — заголовок третьего уровня
      3. H3 — заголовок третьего уровня
    2. H2 — заголовок второго уровня
    3. H2 — заголовок второго уровня

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

В тегах Hx хорошо использовать продвигаемые ключевые слова (однако это следует делать так, чтобы это выглядело естественно!). Причем тег Hx может быть выведен в поисковой выдаче в заголовке сниппета вместо Title.

Пример:

метатег Hx, H1, H2, H3

мета тег Hx, H1, H2, H3

Требования SEO

  • Нежелательно использовать другие теги внутри Hx, например, совместное использование заголовков Hx с HTML-тегами: <STRONG> (полужирный), <B> (полужирный), <EM> (курсив), <I> (курсив), <A> (ссылка).
  • Неверная логика использования тегов. Например, тег <H2> перед тегом <H1>.

Примеры правильного заполнения тегов

  • <H2>Где купить систему автополива для газона</H2>
  • <H1>Автополив для газонов</H1>
    <H2>Где купить систему автополива для газона</H2>
    Текст.

Ошибки и неудачные примеры мета-тегов

  • <H2><STRONG>Где купить систему автополива для газона</STRONG></H2>
  • <H2>Где купить систему автополива для газона</H2>
    Текст.
    <H1>Автополив для газонов</H1>
  • <H2>Где купить систему автополива для газона<H2>
  • <H2></H2>Где купить систему автополива для газона

 

Мета-тег Robots (All, Follow, Nofollow, Index, Noindex, None, NoArchive, NoYaca)

Синтаксис

<meta name="robots" content="index, nofollow" />  <meta name="yandex" content="noyaca" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Для Яндекса значение атрибута name можно заменить на «yandex», в этом случае правила будут учитываться только роботами Яндекса. Для Google — «google» или «googlebot», для Yahoo! — «slurp», для Bing — «bingbot».

Какие значения могут быть у атрибута content:

  • all — разрешено индексировать текст и ссылки на странице;
  • index, follow — то же, что all;
  • noindex — запрещено индексировать текст страницы;
  • nofollow — запрещено переходить по ссылкам на странице;
  • none — запрещено индексировать текст и переходить по ссылкам на странице;
  • noindex, nofollow — то же, что none;
  • noarchive — не отображать на странице результатов поиска ссылку на сохраненную копию;
  • noyaca — не использовать описание из Яндекс.Каталога для сниппета в результатах поиска;
  • noodp — не использовать описание из dMoz для сниппета в результатах поиска;
  • noydir — не использовать описание из Yahoo! Directory для сниппета в результатах поиска.

Мета-теги Index и Noindex выполняют те же функции, что и директивы Allow и Disallow в файле robots.txt — разрешают и запрещают индексировать данную страницу. Подробнее, как правильно настроить файл роботс здесь:

robots.txtRobots.txt
Файл robots.txt является одним из самых важных при оптимизации любого сайта. Его отсутствие может привести к высокой нагрузке на сайт со стороны поисковых роботов и медленной индексации и переиндексации… Подробнее

Robots.txt для WordPressRobots.txt для WordPress
В интернете можно найти много публикаций на тему, как составить лучший (или даже самый лучший) файл robots.txt для WordPress. При этом в ряде таких популярных статей многие правила не объясняются и, как мне кажется, вряд ли понимаются самими авторами… Подробнее

 

Мета-теги Canonical, Next, Previous

Синтаксис

<link rel="canonical" href="http://site.ru/nazvanie-stranitsy" />
<link rel="prev" href="http://site.ru/page/2/" />  <link rel="next" href="http://site.ru/page/4/" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

В качестве значения атрибута href тега canonical указывает URL страницы, которая признается «канонической». Пример, один и тот же товар представлен в двух разных категориях по разным URL: site.ru/category-3/tovar-528/ и site.ru/category-16/tovar-528/. Чтобы поисковая система не считала такие страницы дублями, один из них признается каноническим (например, первый) и на обоих страницах прописывается код <link rel=»canonical» href=»http://site.ru/category-3/tovar-528/» />.

Теги Prev и Next (предыдущий, следующий) используются на страницах с пагинацией (например, страница категории, на которой товары размещаются на нескольких страницах). Думаю, здесь пояснять ничего не нужно, пример выше говорит сам за себя.

 

Устаревшие мета-теги

Мета-тег Keywords

Синтаксис

<meta name="keywords" content="ключевое слово 1, ключевое слово 2, ключевое слово 3, ..." />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Данный мета-тег уже долгое время не учитывается системой Google, Яндекс официально сообщает о том, что данный тег может использоваться при определении соответствия страницы поисковым запросам. Однако подтверждений тому, что мета-тег kewords помогает в ранжировании сайта в Яндексе нет. Тем не менее, приведем ниже требования SEO к правильному заполнению мета-тега, которые были актуальны порядка 10 лет назад.

Требования SEO

  • Использовать не больше 5-6 слов,
  • использовать не более 3-х повторов,
  • не стоит использовать союзы, предлоги, междометия.

Примеры правильного заполнения тегов

  • автополив газонов, авто полив, системы, купить, цены,  москва

Ошибки и неудачные примеры мета-тегов

  • автополив газонов, автополив газонов купить, автополив газонов цены, автополив газонов москва, система автополива газонов, авто полив газонов, авто полив газонов купить, авто полив газонов цены, авто полив газонов москва, система авто полива газонов
  • автополив газонов, секс, порно, девки, [дальше сплошная цензура]

Мета-тег NoODP

Синтаксис

<meta name="robots" content="noodp" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте. Этот тег использовался в следующих случаях. Если сайт был добавлен в каталог dMoz, то некоторые поисковые системы могли выводить описание сайта, взятое из dMoz. Если это было не нужно, то добавлялся этот тег. С 17 марта 2017 года dMoz больше не работает, поэтому данный мета-тег теперь является устаревшим.

 

Другие полезные мета-теги

Ниже я приведу еще несколько мета-тегов, которые напрямую не влияют на индексацию и ранжирование страниц, но их тоже важно знать специалисту по SEO.

Мета-тег Viewport

Синтаксис

<meta name="viewport" content="width=device-width, initial-scale=1" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте. Актуальность тега возросла с переходом значительной части аудитории в Mobile. В случае применения адаптивной верстки, наличие этого тега позволяет правильно учитывать размер используемого устройства (ПК, планшет, смартфон).

Значение width=device-width адаптирует ширину окна просмотра к экрану устройства. Значение initial-scale=1 обеспечивает соотношение 1:1 между пикселями CSS и независимыми пикселями устройства.

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

 

Мета-тег NoYDIR

Синтаксис

<meta name="slurp" content="noydir" />   или   <meta name="robots" content="noydir" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте. Этот тег используется в следующих случаях. Если сайт был добавлен в каталог Yahoo!, то некоторые поисковые системы могут выводить описание сайта, взятое из Yahoo! Directory. Если это не нужно, то добавляется этот тег.

Мета-тег Generator

Синтаксис

<meta name="generator" content="WordPress 4.6.6" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Эти мета-теги используются некоторыми CMS с целью предоставления информации о том, на каком движке или на какой версии движка сделан данный сайт. Если он указан, специалисту будет легко определить CMS сайта.

Мета-теги Author и Copyright

Синтаксис

<meta name="author" content="Иван Иванович" />  
<meta name="copyright" lang="ru" content="ООО Ромашка" />

Тег должен находиться внутри контейнера <head>…</head> в любом месте.

Теги используются соответственно для указания авторства и авторских прав. Не стоит путать эти мета-теги с возможностями микроразметки. Если необходимо корректно настроить авторство, лучше обратиться к этим статьям:

Улучшенный сниппет в Google3 простых шага как связать сайт с Google+, или Что такое авторство в Google и для чего это нужно
Те из вас, кто предпочитает пользоваться поиском Google, не раз встречали в результатах выдачи сниппеты с фотографиями авторов статей. Поисковик предоставляет такую возможность в рамках сервиса «Поддержка авторов». Такие сниппеты привлекают большее внимание и имеют больший CTR… Подробнее

rich snippetsРасширенные сниппеты (Rich Snippets) в Google и Яндекс
Занимаясь продвижением сайта, все больше внимания оптимизаторы уделяют тому, как выглядит сниппет. Технология расширенных сниппетов не нова. Яндекс и Google позволяют использовать дополнительные возможности для того, чтобы ссылка на ваш сайт была более информативной… Подробнее

 

Как проверить мета-теги в коде веб-страницы

  1. Откройте исходный код страницы.
  2. Воспользуйтесь функцией поиска по странице — Ctrl+F для того, чтобы обнаружить мета-теги, возможно, некоторые из них просто отсутствуют (Title, Description, H1 обязательно должны быть!)
  3. Обратите внимание:
    • верно ли записаны мета-теги с точки зрения синтаксиса (см. примеры выше),
    • в нужном ли месте они размещены (проверьте, точно ли мета-тег Title внутри контейнера <head>, логично ли размещены теги Hx и т.п.),
    • не дублируются ли теги, которые должны быть использованы только один раз (да-да, бывает когда на странице оказывается два мета-тега Title или несколько мета-тегов H1),
    • корректно ли подхватываются значения этих мета-тегов (бывают ситуации, когда вы прописываете для страницы одно значение мета-тега, но вместо него выводится другое, шаблонное, настроенное по умолчанию).

 

Шаблоны мета-тегов

То, что будет описано ниже, будет относиться к тегам Title, Description и Keywords.

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

Как быть, если на нашем сайте тысячи или десятки тысяч страниц (например, это новостной портал или интернет-магазин с большим количеством товаров). SEO-специалист может потратить не один месяц на рутинную работу по заполнению мета-тегов и будет вынужден продолжать это делать по мере появления новых статей/товаров.

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

Например, у нас интернет-магазин мебели «МегаМебель» (не проверял, есть ли на самом деле такой магазин). Вы можете написать такое короткое техническое задание:

  1. если для карточки товаров прописаны seo-теги — подставляются эти мета-теги;
  2. если нет, то автоматически генерируются мета-теги по шаблону:
    • Title: [Заголовок H1] — купить в Москве по цене [Цена] руб — МегаМебель
    • Description: Вы можете купить [Заголовок H1] в интернет-магазине МегаМебель в Москве по выгодным ценам. Бесплатная доставка в пределах МКАД!
    • Keywrods (напомню, можно не указывать): [Заголовок H1], [Название категории], купить, недорого, цена, москва

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

seogio.ru

Как правильно заполнять мета теги

С точки зрения SEO, главные мета теги сайта это Title, Description и Keywords. Поэтому именно правильность их заполнения мы и рассмотрим. Повторимся, что все они должны располагаться между тегами <head> </head> и не в каком другом месте кода.

Title

Мета тег <TITLE> отвечает за заголовок страницы и отображается строчкой текста на вкладке браузера.

Мета тег <TITLE>

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

Например:

  1. Для коммерческого сайта: «Купить ноутбук в Москве — цены от 19990 р в интернет-магазине | site.ru»
  2. Для информационного сайта: «Как правильно выращивать алоэ в домашних условиях | Садовод»

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

<title>Заголовок страницы</title>

Более подробно по теме: Как правильно написать Title.

Description

Мета-тег Description отвечает за то, чтобы в нескольких предложениях описать суть информации на странице. Обычная поисковая система берёт информацию из этого тега для формирования сниппета в результатах выдачи.

мета тег description

Description также должен включать прямое вхождение ключевого слова (по возможности дополняется другой словоформой), рассказывать о преимуществах вашего предложения, плюс служит в качестве промо основному содержанию страницы. Давайте попробуем составить описания страниц, для двух примеров упомянутых выше.

Примеры:

  1. «Купить ноутбук в Москве. Закажите ноутбук по цене от 19 990 рублей в интернет-магазине. Доставка бесплатно. Гарантия 2 года.»
  2. «Как правильно выращивать алоэ в домашних условиях. Журнал Садовод делится секретами выращивания растения алоэ дома.»

Длина не более 140 символов. На чистом html, это выглядело бы вот так:

<meta name="description" content="Описание страницы"/>

Больше информации по теме: Как правильно заполнить Description

Keywords

Мета тег Keywords — это набор ключевых слов, по которым продвигается страница. Впрочем сегодня этот атрибут уже не является обязательным и заполняется по желанию, так в «золотую эпоху» SEO им слишком злоупотребляли и поисковые системы практически не обращают внимание на него. Если же вы всё-такие решили заполнить keywords, лучше это делать простым перечислением слов в начальной форме без запятых:

«Купить ноутбук Москве заказать цена стоимость рубль интернет-магазин каталог доставка гарантия»

Длина любая, но слишком усердствовать не стоит. В html правильно пишется вот так:

<meta name="keywords" content="Ключевые слова"/>

Технические мета-теги

  • Expires — дата устаревания документа.
  • Pragma — запрет на использование кэшированных данных, информация должная подгружаться с сервера.
  • Content-Type — тип контента и кодировка.
  • Content-language — языка страницы/сайта.
  • Cache-Control — устанавливает кэшируется ли документ или нет, и если да, то каким образом.
  • Robots — отвечает за индексацию отдельных страниц.
  • document-state — частота индексации.

Отсутствие мета тегов может негативно сказаться на отображении, индексации и ранжировании страниц.

Как добавлять мета теги на CMS

Чаще всего для управления контентом на сайте используются различные CMS и некоторые из них требуют установки дополнительных модулей и плагинов, чтобы задавать мета теги. Чтобы прописать мета теги на CMS нужно:

  • Для WordPress потребуется установка плагина Yoast Seo или All Seo Pack. Другие плагины не рекомендуем.
    мета теги на WordPress
  • В Joomla при добавлении новой страницы или статьи на сайт, сразу же можно прописать мета данные и дополнительных модулей не требуется.
  • В Opencart дело обстоит аналогичным образом, при добавлении товара или категории товара, в отдельной вкладке можно указать мета описания.

Хоть Wix и не является CMS — это всего лишь конструктор, здесь тоже можно сделать мета описание сайт и ключевые слова, в которых содержится информация о сайте. Для каждой страницы при нажатии на три точечки, всплывает меню, где можно перейти в раздел SEO и задать необходимые параметры.

Метатеги на Wix

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

Проверка мета-тегов онлайн +анализ

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

Вот несколько таких сервисов:

  • http://seo-inf.ru/tools/view-metatags/
  • http://www.prcy-info.ru/index.php/meta-tags-check
  • https://internet-marketings.ru/prizyv-k-dejstviyu-v-reklame/

internet-marketings.ru

Кодировка символов и язык

Пример (очень нужный и важный):

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

Теперь разберём по «слогам» нашу запись:
<meta http-equiv=»Content-Type» — указываем что в этом мета теге мы будем заниматься Content-Type — типом содержания
Content=»text/html; — а именно его текстом
Charset=Windows-1251″> — документ для Windows — Кириллица где 1251 кодировка раскладки клавиатуры, так например Английская клавиатура будет задаваться Charset=Windows-1252

В настоящее время продвинутые веб-мастера рекомендуют использовать кодировку UTF 8

То есть писать в голове документа вот так:

Пример:

В этой строчке говорится о том что язык Language документа является русским Content=»ru»

Неправильная установка языка и раскладки клавиатуры может привести к печальным последствиям.

Информация о документе

Пример:

Данные метаописатели предназначены для заявления об авторских правах непосредственно в заголовке html кода, так name=»author» указывает имя автора страницы, а name=»copyright» авторское право (копирайт) в котором может указываться фамилия, имя, отчество автора сайта, название фирмы, бренда.. и т. д. Кроме того включив в заголовок документа такое описание Вы значительно упростите задачу поисковой машине при поиске Вашего сайта по имени автора, названию фирмы, бренду…

Пример:

Если хотите можете указать с помощью какого html редактора была написана данная страница.

Описание страницы и ключевые слова

Пример:

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

Пример:

Keywords — ключевые слова веб-страницы, опять таки предназначены для поисковых машин.

Представьте что Вы ищете в какой либо поисковой системе сайт с информацией о том где можно продать те же рога и копыта 🙂 Какие слова и фразы Вы будите вводить в строке «Поиск»? ну наверно что то типа: «Где продать коровьи рога?» или «Реализовать копыта по выгодной цене» Так вот если определить ключевые слова и так сказать предугадать мысли потенциального посетителя можно надеяться на то, что та или иная поисковая система выдаст ссылку на Ваш сайт в первых строчках результата поиска. Конечно ввод данного метоописателя не есть гарант того что именно Ваш сайт займет первые места в поиске по данным словам, но всё же не стоит им пренебрегать. Впрочем, оптимизация и раскрутка сайта это отдельная тема для разговора.

Помните что описание description не должно превышать по длине более 200 символов, а ключевые слова keywords 1000 символов, иначе это может пагубно отразится при продвижении Вашего сайта в ТОП поисковых систем.

Адрес

Пример:

Думаю понятно.. здесь указывается адрес Вашего почтового ящика Publisher-Email и адрес сайта Publisher-URL

Обновление страницы

Пример:

Если некая страница на Вашем сайте подразумевает постоянное обновление и/или дополнение информационным содержанием, то хорошо было бы включить данное описание в заголовок данной страницы. Такое введение позволит программе роботу своевременно посещать Ваш сайт и индексировать его содержание. В нашем примере мы заявили о том, что собираемся обновлять содержание на странице не менее одного раза в 15 дней, можете не сомневаться программа робот возьмет Ваши планы себе на заметку и будет приходить «к Вам в гости» раз в пятнадцать дней, для того чтобы проверить ничего ли у Вас не изменилось..

Время действия документа и кэш

Пример:

Для того чтобы ускорить загрузку страницы, а так же сэкономить трафик современные браузеры сохраняют посещаемые пользователем страницы в кэш (на жёсткий диск), и при повторном посещении загружают их не с сервера, а непосредственно с кэша. На самом деле такая функция хороша собой.. но есть одно «но», дело в том что в браузере может отображаться уже устаревшая информация, какой либо страницы. Представьте, к примеру, Ваш сайт представляет собой некое периодическое новостное интернет издание, а пользователь получит, вместо самых свежих новостей, уже устаревшую информацию, ту которая хранится у него в кэше!! и не разобравшись в чем «беда» примет Ваш сайт за «мертвый» заброшенный и никем не обновляемый.

Для того чтобы принудительно заставить браузер загружать ту или иную страницу не с жёсткого диска, а с сервера необходим мета тег с данным синтаксисом, где указывается день недели, число месяц год время (чч:мм:сс) и часовой пояс(GMT+03:00 — время Московское + три часа). День недели и время дня можно не указывать. Теперь при чтении страницы браузером страница будет грузится с сервера, если указанная дата и время настало или просрочено, и напротив из кэша если указанное время еще не наступило.

Ниже на всякий случай приведены таблицы сокращений от Английских слов на месяцы и дни недели

Месяцы: От Английского: Сокращения:
Январь January Jan
Февраль February Feb
Март March Mar
Апрель April Apr
Май May May
Июнь June Jun
Июль July Jul
Август August Aug
Сентябрь September Sep
Октябрь October Oct
Ноябрь November Nov
Декабрь December Dec
Дни недели: От Английского: Сокращения:
Понедельник Monday Mon
Вторник Tuesday Tue
Среда Wednesday Wed
Четверг Thursday Thu
Пятница Friday Fri
Суббота Saturday Sat
Воскресенье Sunday Sun

Атрибуту content можно присвоить значение «0» <meta http-equiv=»Expires» content=»0″> в этом случае страница всегда будет загружаться с сервера.

И еще.. некоторые поисковые роботы могут отказаться индексировать документ с заведомо устаревшей датой. — не искушайте судьбу..

Пример:

А такая запись вовсе запретит браузеру кэшировать данную страницу.

Команды для робота

Пример:

Данный мета тег предназначен для подачи поисковому роботу той или иной команды.

Список возможных команд роботу:

  • Index — индексировать страницу
  • Noindex — не индексировать страницу
  • Follow — прослеживать гиперссылки на странице
  • Nofollow — не прослеживать гиперссылки на странице
  • All — индексировать страницу и прослеживать гиперссылки на странице (по умолчанию)
  • None — не индексировать страницу и не прослеживать гиперссылки на странице

Автоматический переход на другую страницу

Пример:

Если вдруг по каким либо причинам Вы задумаете поменять URL адрес Вашего сайта то хорошо было бы на старом месте оставить страницу вроде этой:

Разберём и осмыслим строчку из примера:

<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>

meta http-equiv=»Refresh» — Refresh (восстановление) указывает браузеру что данную страницу необходимо обновить
content=»10; — обновить через заданное количество секунд (в нашем случае десять)
URL=http://www.mysite/index.html»— адрес новой/другой страницы на которую следует перейти.

Пример:

А вот если в заголовке Refresh URL адрес упустить, как показано в примере, то тогда браузер будет постоянно через каждые 30 секунд (ну или не 30.. сколько пропишите через столько и будет..) обновлять содержимое данной страницы.

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

Эффекты при переходе по ссылке

Пример:

Данные заголовки создают визуальные эффекты при переходе с одной страницы на другую.

  • Page-Enter — Эффект появления страницы
  • Page- Exit — Эффект исчезновения страницы

В которых:

  • Duration — время действия эффекта в секундах
  • Transition — Один из номеров предлагаемых эффектов (от 0 до 23) перечисленных в таблице:
Номер Описание эффекта Номер Описание эффекта
0 Прямоугольники внутрь 12 Растворение
1 Прямоугольники наружу 13 Вертикальная панорама внутрь
2 Круг внутрь 14 Вертикальная панорама наружу
3 Круг наружу 15 Горизонтальная панорама внутрь
4 Наплыв наверх 16 Горизонтальная панорама наружу
5 Наплыв вниз 17 Уголки влево — вниз
6 Наплыв вправо 18 Уголки влево — вверх
7 Наплыв влево 19 Уголки вправо – вниз
8 Вертикальные жалюзи 20 Уголки вправо – вверх
9 Горизонтальные жалюзи 21 Случайные горизонтальные полосы
10 Шажки горизонтальные 22 Случайные вертикальные полосы
11 Шажки вертикальные 23 Случайный выбор эффекта

Пример:

Полезные советы:

  • Ещё раз напомню о том что мета теги стоит применять умело и грамотно особенно это касается команд для робота и кодировки символов, иначе весь Ваш труд может пойти насмарку..

  • Заголовок Refresh (автоматический переход на другую страницу) можно использовать не совсем стандартно.. Некоторые авторы используют его для создания своего рода «презентации» слайд шоу, где сменяющиеся страницы и есть кадры презентации. Представьте заходит человек на такой сайт а тут ему «Откинетесь на спинку кресла и расслабьтесь..»:) а далее сами по себе пошли картинки, графики, тексты.. а последняя страница тупиковая где пользователь берёт сайт «в свои руки» или же может замыкаться на первую. Только всегда помните о золотом правиле веб-мастера: Главное не переборщить!

www.webremeslo.ru

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

Если быть предельно точным, то под мета-тегами следует понимать (X)HTML-теги <meta>, с помощью которых можно указать служебную информацию о странице. Такая информация размещается внутри контейнера <head>…</head> и не выводится на экран. Служат для структурирования и представления поисковикам метаданных о гипертекстовом ресурсе (веб-странице).

К мета-тегам относятся:

  • title — заголовок страницы;
  • description — описание веб-страницы;
  • keywords — ключевые слова;
  • http-equiv — тип отправляемого документа и кодировка (charset);
  • generator — CMS сайта;
  • author — автор;
  • copyright — авторские права;
  • robots — правила индексирования страницы для роботов;
  • viewport — данные о настройке области просмотра;
  • и другие.

Для чего нужны мета теги

Метатеги на странице можно прописывать вручную. Встроенные инструменты могут их генерировать автоматически. Но лучше выполнить эту работу самостоятельно, так чтобы они точно соответствовали тематике веб-страницы, указывая:

  • авторство;
  • источники получения информации;
  • краткое содержание контента.

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

Метатеги классифицируются на четыре группы, каждая из которых наделена определенными функциями и сопровождается одним из четырех атрибутов:

  • content — не назначается по умолчанию;
  • http-equiv — предназначен для перевода метатега в заголовок HTTP;
  • name — имя метатега, косвенно устанавливающее его предназначение;
  • charset -задает кодировку документа.

Из них только content является обязательным. Остальные применяются по желанию.

Метатеги нужны для передачи нужной информации о странице:

  • поисковым роботам (keywords, title, description);
  • браузерам (коды страниц, интервалы автообновления, куки);
  • сервисов (указание копий адресов и других сведений).

Следите за тем, как и с какой целью вы заполняете метатеги.

Мета-тег Title

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

метатег title в сниппете

Так title выглядит в коде страницы сайта:

мета тег title в коде сайта

Оптимизация мета тега Title под SEO

  • Заголовок должен быть уникальным на всех страницах сайта;
  • Тайтл должен отражать суть страницы, должен быть информативным и кратким;
  • Должны присутствовать запросы, по которым продвигается данная страница, самые важные размещаем в начале тега, заголовок должен обязательно содержать 1-3 ключевых слова;
  • Не включайте в Title слишком много ключевых слов;
  • Не используйте спецсимволы (= / + _ ), знаки препинания и стоп-символы (точка, двоеточие, восклицательный и вопросительный знак) — помните, это знаки, которые разбивают пассажи в Title, что снижает взаимосвязь ключей по разные стороны от стоп-знака;
  • Составляйте тег Title для людей по всем правилам русского языка, заголовок по возможности нужно делать цепляющим и привлекательным;
  • Оптимальная длина Title – от 30 до 65 символов. Google ориентируется на длину в пикселях, рекомендуемая длина — от 200 до 571 пикселей. Если длина Title больше, то в сниппете появляется многоточие, которое также занимает дополнительное место в заголовке. Оно может появиться как в конце заголовка сниппета, так и в начале. Короткие Тайтл тоже плохо, поскольку в него помещается мало ключей. 

Примеры правильного заполнения тегов title

  • <title>Купить очки солнцезащитные в Москве по низким ценам</title>
  • <title>Установка деревянных окон в Москве недорого</title>
  • <title>Мета-теги страницы сайта | Мета теги Title и Description </title>

Ошибки и неудачные примеры мета-тегов title

  • <title>Установка windows, удаление вирусов, починка компьютеров, продажа комплектующих</title> (простое перечисление ключевых слов)
  • <title>Главная – ООО АвтоРемонт — ремонт автоматической коробки передач в Москве</title> (вначале должны быть самые главные ключевые слова)
  • <title>Авторемонт</title> (слишком короткий Title)
  • <title>ООО Сайты: разработка сайтов, большой офис, новости компании.</title> (слова, по которым не будет продвигаться сайт)

Мета-тег Description

Так же один из главных мета тегов для продвижения страницы по ключевым словам. Описание может использоваться в сниппете:

Description в сниппете

Description в коде сайта:

Description в коде сайта

Иногда поисковик берет description из текста страницы, т.к. считает его более подходящим

Сниппет в поиске:

Поисковик выбрал сниппет самостоятельно

Description в коде сайта:

Description в коде сайта

Мета тег Description для SEO

  • Должен отражать суть страницы, написан в виде согласованного текста. Может быть несколько предложений.
  • Должен быть уникальным для всех страниц сайта, не дублировать аналогичные теги на других сайтах (для этого используем название компании в тексте мета-тега).
  • В теге нужно использовать запросы, по которым продвигается данная страница, однако делать это необходимо так, чтобы они были использованы естественным образом, в нужной морфологии. Также не следует просто перечислять запросы через запятую.
  • Содержание тега не должно повторять Title.
  • Длина description должна быть не менее 70 и не более 150-200 символов. Google определяет длину в пикселях, рекомендуемая длина от 400 до 930 пикселей.
  • В description желательно отразить основные преимущества компании, товара, услуги.
  • Наиболее важную информацию и фразы лучше разместить в начале мета-описания.
  • Чем привлекательнее будет Description, тем чаще будут кликать на сниппет.

Примеры правильного заполнения мета тегов Description

  • <meta name=»description» content=»Обеденные столы: большой выбор столов, низкие цены, доставка по России. Купить столы в интернет-магазине СуперМебель со скидкой!» />
  • <meta name=»description» content=»Мета-теги страницы сайта. Мета тег Title и Description. Правильная оптимизация мета тегов Title и Description. » />
  • <meta name=»description» content=»Купить смартфон Xiaomi Redmi 4x в интернет-магазине ЭЛЬДОРАДО с доставкой и гарантией. Ознакомиться с ценами, отзывами владельцев, фотографиями, техническими характеристиками и подробным описанием.» />

Ошибки и неудачные примеры мета тегов Description

  • <meta name=»description» content=»Челябинский тракторный завод (ЧТЗ)» /> (короткий, мало ключевых слов)
  • <meta name=»description» content=»Правильная настройка мета-тегов очень важна для SEO. Работы по заполнению, прописыванию, корректировке мета-тегов всегда выполняются при запуске проекта, сразу после того, как собрано семантическое ядро. И продолжаются по мере необходимости в течение всего периода продвижения сайта…» /> (сгенерирован автоматически или просто вырезано начало контента на странице).
  • <meta name=»description» content=»мета тег, метатеги сайта, метатег keywords, мета-тег title, мета тег description, метатеги страницы, мета тег для SEO, метатеги для продвижение, оптимизация мета тегов, тайтл, дескрипшн, кейвордс»/> (перечисление ключевых слов через запятую, неестественное мета-описание).

Мета-тег Keywords

На мой взгляд мета-тег Keywords уже давно не работает и не стоит тратить на него время.

Данный мета-тег давно не учитывается системой Google, Яндекс официально сообщает о том, что данный тег может использоваться при определении соответствия страницы поисковым запросам. Однако подтверждений тому, что мета-тег kewords помогает в ранжировании сайта в Яндексе нет. 

Мета тег Keywords для SEO

Если вы со мной не согласны и верите в этот мета тег, то вот мои рекомендации:

  • не используйте множественные повторения ключей;
  • используйте 1-3 ключевых слов;
  • ключевые слова должны соответствовать тематике страницы;

Примеры правильного заполнения тегов keywords

  • <meta name=»keywords» content=»seo продвижение сайта, оптимизация сайта, раскрутка интернет-магазина» />
  • <meta name=»keywords» content=»купить телевизор samsung» />

Ошибки и неудачные примеры мета тегов keywords

  • <meta name=»keywords» content=»seo продвижение сайта, продвижение сайта, комплексное продвижение сайта» /> (множественные повторы ключей)
  • <meta name=»keywords» content=»купить телевизор samsung, сиськи, голые девки, аренда картофеля» /> (либо у вас странная тема статьи на странице, либо неправильно указаны ключи :-))

Как проверить мета-теги в коде веб-страницы

  1. Откройте исходный код страницы (Ctrl+U);
  2. Воспользуйтесь функцией поиска по странице — Ctrl+F для того, чтобы обнаружить мета-теги, возможно, некоторые из них просто отсутствуют (Title, Description, H1 обязательно должны быть!);
  3. Обратите внимание:
    • верно ли записаны мета-теги с точки зрения синтаксиса (см. примеры выше),
    • в нужном ли месте они размещены (проверьте, точно ли мета-тег Title внутри контейнера <head>, логично ли размещены теги Hx и т.п.),
    • не дублируются ли теги, которые должны быть использованы только один раз (да-да, бывает когда на странице оказывается два мета-тега Title или несколько мета-тегов H1),
    • корректно ли подхватываются значения этих мета-тегов (бывают ситуации, когда вы прописываете для страницы одно значение мета-тега, но вместо него выводится другое, шаблонное, настроенное по умолчанию).

Сам я использую расширение для Chrome SEO META in 1 CLICK — очень удобно.

SEO META in 1 CLICK

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

webmaster-seo.ru


You May Also Like

About the Author: admind

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.