Подробное пособие по использованию тега "title"
Здравствуйте, друзья!
В сегодняшней статье разберем тег title во всех аспектах, а именно его правильное заполнение, употребление на страницах, а также ключевые особенности работы в поисковых системах.
Можно было бы данную статью совместить и сделать комплексный мануал по всем мета-тегам (title, описание и ключевые слова), но я решил выделить на каждый объект отдельный материал. Считаю, что так будет более правильно. Материал будет достаточно большой, но его стоит изучить. Честно сказать, я сам не ожидал, что смогу столько настряпать про данный тег.
Задачи и специфика работы
Задача данного мета-тега является очень важной и на данный момент она является одной из определяющих в определении релевантности страницы определенному поисковому запросу.
Title является заголовочным тегом. Поэтому, в нем необходимо указывать заголовок страницы, который определяет ее содержимое. Не стоит путать тег title с заголовком первого уровня H1, который используется для названия статьи или другого вида материалов. Данные теги должны быт отличны и их значимость также не одинакова, хотя и имеются схожие особенности в их работе. Например, как title, так и H1 должны быть использованы 1 раз на странице.
К тому же данные теги имеют различные места размещение в html коде страницы.
Title размещается только в шапке сайта в секции head между открывающим и закрывающим тегами <head></head>
H1 является названием статьи и прописывается внутри тела документа, то есть области body.
Вот пример части исходного кода одной моей статьи, где я показал, как на практике прописываются этих 2 тега.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег title: используем правильно</title>
</head>
<body>
<h1>Правильное использование тега Title для повышения позиций в поисковой выдаче</h1>
- 6 строка - название страницы между открывающим и закрывающим тегами title. Находится в секции head страницы, как и должно быть;
- 10 строка - открывается тег body (то есть тело документа - его содержимое);
- 12 строка - заголовок страницы в тегах H1, который имеет измененный вид по сравнению с заголовком в title.
Тег title не отображается в содержимом страницы, в отличии от H1. Но он отображает заголовок страницы в поисковой выдаче, а также во вкладке браузера, когда пользователь находится на определенной странице.
Теперь пару слов о добавление данного тега на страницы вашего ресурса.
Если вы используете какие-то CSM системы (например, WordPress), то title будет добавляться автоматически на каждую страницу, исходя из того заголовка, который вы введете в редакторе страницы. Но получается ситуация, когда этот заголовок будет использован и в качестве title и в качестве заголовка H1. Нет возможности делать их отличными, что будет более разумно для грамотной работы. Для этого устанавливают различные плагины SEO оптимизации.
Например, All in one seo pack. Тогда заголовок, отображаемый на самой странице (H1), будет использован из того, что вы введете в редакторе записи. А title можно будет ввести отдельно в дополнительном блоке, который добавляется одним из плагинов оптимизации. Если взять плагин all in one seo pack, то данное решение добавляет блок, делающий возможным ввод мета-данных для каждой страницы.
Установив один из подобных плагинов, можно делать тег title отличным от H1, что позволит более эффектно подходить к составлению обоих тегов. Title составлять так, чтобы из поиска хотелось кликнуть и перейти на ресурс, а H1 сделать таким, чтобы после перехода он заставил посетителя приступить к изучению контента. Это очень важно.
Title в других элементах сайта
Кроме функции заголовка к странице в целом данный тег может выполнять еще и другие задачи, а именно:
- добавлять заголовок к изображением;
- к ссылкам.
Это также не менее важный момент в оптимизации сайта и каждой страницы, так как эффект кроется в мелочах. Каждое изображение должно иметь titile (заголовок) и alt (альтернативный текст, который показывается в случае недоступности картинки). Долго распинаться по этим 2 моментам я не буду сейчас, так как имеется очень подробный материал - оптимизация изображений для сайта.
В данным случаях title будет значим только для поисковых систем и можно будет его увидеть в исходном коде страницы. Он должен быть у каждой ссылки и изображения. Также он выполняет функцию подсказки при наведении на ссылку или картинку. В случае с ссылкой он отображает название материала, в который будет осуществлен переход при нажатии на нее.
С изображениями аналогичная ситуация.
Если взять исходный код и посмотреть, как добавляется тег title к изображениям и ссылкам, то ниже я показываю 2 варианта. Сначала будет ссылка, а потом изображение.
<a title="заголовок ссылки (название той страницы, на которую будет происходить переход посетителя)" href="адрес страницы" target="_blank">анкор ссылки</a>
<img title="тут текст заголовка" src="путь к изображению" alt="альт изображения (обязательно!)" width="ширина в пикселях" height="высота в пикселях" />
Кроме того, title должен быть прописан ко всем ссылкам в верстке шаблона. Это всевозможные ссылки для перехода в рубрики и так далее.
Итак, в первом пункте я затронул почти все особенности тега тайтл. Чтобы более подробно осознать всю важность title и научиться максимально правильно и эффективно его заполнять, я предлагаю приступить к изучению следующего вопроса.
Как правильно заполнять title
- Первое и самое важное, заголовок в title должен максимально четко отображать содержимое страницы. Это важно со всех сторон. В-первых, тайтл является очень важным мета-тегом, который до сих пор очень круто влияет на позиции сайта по определенным запросам в поисковых системах. Поэтому, если вы хотите, чтобы страница по нужному ключевому слову находилась высоко в выдаче, то ей стоит давать правильное название, которое будет четко отображать суть информации, так как из этого выплывает второй момент.Если содержимое не будет соответствовать ожиданию посетителя, который кликнул по ссылке из выдачи, то он сразу закроет статью и уйдет с сайта. Это сильный сигнал поисковым системам, что страница не интересна или не отвечает запросу пользователя. Второе утерждение является более точным в этом случае. Поэтому, старайтесь, чтобы заголовок titile максимально точно отображал содержимое документа или же вообще отображал его;
- В заголовочном мета-теге title обязательно указывайте ключевое слово, по которому продвигается страницы, так как это повышает релевантность страницы поисковому запросу (ключевому слову). Также, ключ, употребленный в тайтле документа имеет наибольшую значимость в отличии от других мест (тело статьи, H1, описание, ключевые слова и так далее).Это один из всех мета-тегов, который на данный момент до сих пор является значимым для ПС и является обязательным, в отличие ключевых слов и описания. Но, чтобы ключевое слово имело максимальный вес, старайтесь употреблять его в самом начале заголовка. Об этом я уже писал в одной из своих статей, где предоставлял график зависимости веса ключа от его расположения в тайтле.
Да и сам Google нам об этом говорит:
Google отдает предпочтение и больший вес ключевому слову, если оно находится в начале заголовочного тега title. Поэтому, старайтесь размещать его, как можно ближе к началу.
В пример могу привести 2 варианта заголовков для тайтла по ключевому слову "как раскрутить сайт":
- Как раскрутить сайт: 5 секретных фишек;
- 5 секретных фишек, как раскрутить сайт.
Приоритетней будет использовать первый вариант, так как ключевая фраза будет иметь больший вес в глаза поисковых систем и с большой вероятностью страница по данному запросу будет ранжироваться выше, чем при втором варианте.
Это еще очень важно с точки зрения восприятия заголовка людьми. Ключевые слова всегда выделяются жирным в поиске. Употребив ключ в заголовке, вы уже сделаете сниппет более заметным и конверсия в клик по ссылке увеличится. Употребление ключа в самом начале увеличит процент кликов еще больше, так как чтение происходит слева направо и в первую очередь будет бросаться именно запрос пользователя в виде требуемого ключа;
- Третьим фактором успешного заполнения является длина title. Поисковые системы ограничиваются отображением данного тега в районе 60-70 символов с учетом пробелов. Чаще всего именно 60 символов отображается в выдаче. В исходном коде будет считываться весь заголовок, но в выдаче это не так. Только 60 символов с учетом пробелов между словами.Поэтому, старайтесь составить тег title так, чтобы из этих 60 символов посетитель понял суть всей страницы и захотел на нее перейти. В таком случае самым действенным является употребление ключевой фразы в точном вхождении, о чем мы говорили немного выше.
Еще одним моментом при использовании длинных заголовков более 60-70 символов является то, что Яндекс сможет отобразить в выдаче именно ту часть заголовка, в которой содержится запрос пользователя. Даже, если нужные для отображения слова находятся в числе последних 120ти символах (например) заголовка.
Например, если взять тайтл из 120 символов и в конце указать 2 слова "своими руками", то яндекс, при поиске такого запроса пользователем, покажет ему именно концовку тайтла в выдаче с наличием этих слов, а не его начало. Это очень хорошая гибкая способность данной поисковой системы. Google же этого сделать не сможет и покажет тайтл в таком виде, как он есть.
Попытался найти пример такой выдачи, но сразу сдался. Нашел яркий пример в виде 2х скриншотов на сайте ktonanovenkogo. Конечно проверка была по другому запросу, но все же суть вы должны уловить.
Из этого можно сделать вывод, что длинные тайтлы также имеют место быть. Это позволит выше ранжироваться странице по большему количеству запросов. Но не забывайте, что акцент делаем на 60 символов с употреблением ключа в самом начале;
- Обязательно начинайте заголовок для поисковых систем с большей буквы;
- Допустимые знаки разделения для title - двоеточие (:) и кавычки (""). Запятые также можете использовать, но старайтесь не превышать их количество в размере 2х;
- Тайтл должен быть читаемый. Если ключевое слово имеет не совсем читаемый вид (например, помидоры вырастить как), то логично будет его перефразировать (как вырастить помидоры). Следите за этим моментом, чтобы в один момент ваш сайт не был понижен в поиске и не пришлось переделывать заголовки к огромному количеству страниц, если ресурсу уже много времени и контента валом на нем;
- Знак вопроса в тайтле используете только для вопросов;
- Стараемся не использовать стоп-слова, предлоги и союзы. Всегда ближе к сути;
- Тег тайтл должен быть различным с заголовком H1. Не стоит в H1 прописывать тот же самый заголовок. Сделайте ему другую словоформу и разбавьте другими словами;
- Не стоит делать тег title вида "заголовок | site.ru". В title должен быть только заголовок страницы, отвечающий именно ее содержимому. Если у вас ресурс, созданный из простых HTML страниц, то проблем не будет, а вот на WordPress придется настроить плагины SEO оптимизации, чтобы убирали ненужную часть кода из тайтла;
- Используйте уникальные тайтлы к каждой странице. Не стоит повторяться, а тем более употреблять один и тот же заголовок к нескольким материалам;
- Не стоит употреблять несколько ключевых слов в одном заголовке. Это может сильно навредить его читаемости. Можно употребить ключевую фразу, которая будет справедлива для 2х словоформ и может по обеим формам приносить трафик.Например "Как ускорить индексацию сайта Яндексом". Такая ключевая фраза имеет более частотную форму, если убрать слово "Яндексом". Но с данным словом фраза также имеет свой трафик. Получается, что в составе одного ключа мы имеет несколько ключей. Такая фраза способна приносить больше трафика аж по нескольким запросам. Такой вариант использовать можно, но никак не "Как ускорить индексацию сайта или как ускорить индексацию сайта google".
Используя все рекомендации, ваши тайтлы будут на высоком уровне, будут нравиться поисковым системам и провоцировать пользователей на клик в поисковой выдаче. Конечно же к каждый раз не получится использовать все правила, но стоит к ним стремиться. В большинстве случаев получается использовать практически все.
Ошибки
- Отсутствие тега - одна из грубейших ошибок, которая убережет вашу страницу от попадания в поисковую базу и дальнейшее участие в поиске среди других документов в сети. Вам это нужно? Поэтому, в 100% порядке к каждой странице прописываем title;
- Более одного тега на странице. Только один тайтл на одной странице;
- Неуникальные или дублирующие тайтлы для нескольких документов. Для каждого материала должен быть свой уникальный тег и тем более не должно присутствовать страниц с абсолютно одинаковыми тайтлами. Это грубая ошибка, которая влияет на ранжирование сайта. Если вы подозреваете, что у вас имеются такие страницы, то лучше их изменить. Найти такие страницы вам помогут различные сервисы аудитов;
- Содержимое страницы не соответствует заголовку в тайтле. Это важно, как с точки зрения поведенческих факторов, чтобы посетитель остался на странице и изучал материал, так и с точки зрения формирования самого title в поисковой выдаче. Дело в том, что поисковые системы могут размещать в сниппете тайтл, отличный от того, что вы укажите между тегами <title></title>.Это может случиться, если заголовок не будет релевантен тексту страницы. Поисковые системы это прекрасно определяют и могут вставить в сниппет тот фрагмент текста, который будет соответствовать запросу пользователя и содержимому страницы.
Вот, я ввел запрос в Яндекс "проводить собеседование" и нашел пример такого ресурса, когда Яндекс в тайтл сам разместил тот фрагмент текста, который больше всего соответствует данному запросу.
- Тег title прописан в неправильной области кода сайта. Никаких областей body или footer. Только в секции head.
Ну что же, друзья. Вышла довольно большая статья по поводу какого-то там, казалось бы, тега.
А вы думали, что имеется столько тонких нюансов в его использовании? Напишите в коментариях свои впечатления, что узнали нового? А может быть еще и что-то добавить сможете?
В ближайшее время опубликую подобные материалы по поводу мета-тегов descriptions (описание) и keywords (ключевые слова). Там также имеются очень интересные и тонкие моменты. Надеюсь, что такие материалы сделают вашу голову больше в сфере SEO оптимизации сайтов, а главное - помогут раскрутить свои ресурсы и зарабатывать на них.
Все. До связи в следующих статьях.
С уважением, Константин Хмелев!
