10 советов по улучшению заголовков страниц
В этой статье мы поговорим о HTML title, приведем 10 советов, которые помогут вам улучшить заголовки страниц.
Тег <title> принадлежит разделу <head> HTML-документа и выглядит следующим образом:
<html>
<head>
<meta charset="utf-8">
<title>Website Analysis and SEO Tools | Site Analyzer</title>
</head>
<body>The content of the document......</body>
</html>Тег <title> задает заголовок страницы и указывает пользователям и поисковым машинам тему данной страницы. В браузере заголовок отображается на вкладке данной веб-страницы.
Тег <title> — это первое, что появляется в результатах поиска. Пользователь может оценить, соответствует ли сайт его запросу по тегу <title>:
В HTML head title приводится обобщенная информация о странице, поэтому очень важно, чтобы роботы могли его считать. Это как вывеска для реального магазина, которой вы должны завлечь посетителей внутрь.
У пользователя в голове откладывается ваш заголовок, потому что он появляется в браузере, в истории посещений, в любимых страницах… Заголовок — это также первое, что видит пользователь, когда переходит по ссылке. Например, из социальных медиа:
Есть 10 советов, которые помогут улучшить заголовок и завоевать симпатию поисковых систем.
Тег title HTML действительно должен быть последовательным. Он должен четко описывать тему страницы. Вы не можете озаглавить страницу контактов «Фотогалерея«.
Основные ключевые слова должны быть использованы в заголовке страницы. Если это не так, тогда либо ваш заголовок не полностью соответствует странице, либо ваши ключевые слова подобраны неправильно.
Избегайте заголовков по умолчанию и неоптимизированных заголовков типа «новая страница«, «без названия«… И автоматически генерируемых заголовков, которые включают в себя ключевые слова типа «Добро пожаловать на мой сайт!»
Ваш HTML meta title не должен представлять собой набор различных ключевых слов без всякого смысла. Текст должен содержать логичное выражение, которое отражает содержание страницы. Алгоритмы Google Panda и Penguin налагают санкции за такое.
Следите, чтобы в заголовке не повторялись несколько раз одни и те же ключевые слова, если не хотите раздражать своих читателей и быть удаленным из результатов поисковой.
Не забывайте: кроме того, чтобы склонить на свою сторону Google, вам еще нужно произвести впечатление на читателей! Подумайте, прежде чем оптимизировать заголовок. Пробудите в читателе желание открыть вашу ссылку и узнать больше о вашем сайте…
Попробуйте поставить себя на место пользователя: после того, как он ввел в поиск ключевое слово и получил список ссылок, какой заголовок он выберет? Почему он должен захотеть нажать на вашу ссылку? Заставьте его почувствовать эмоции, благодаря которым он должен выбрать ваш сайт, а не конкурента.
Чем длиннее HTML title, тем меньше шансов, что он будет полностью показан в поисковой выдаче. Что такое оптимальная длина заголовка? От 55 до 65 символов, включая пробелы, в зависимости от нижнего или верхнего регистра символов и длины слов.
Все больше и больше пользователей посещают сайты со смартфонов или планшетов, и заголовок страницы должен быть оптимизирован под эти устройства. Мы рекомендуем использовать заголовок такого же размера (от 55 до 65 символов), но избегать длинных слов.
Поисковые системы не должны находить дублированного контента (наличия нескольких страниц в пределах веб-сайта, содержащих тот же самый контент). Выбирайте уникальные, понятные и персонализированные заголовки для каждой страницы сайта. Главная страница, галерея или страница контактов имеют разные функции и должны быть дифференцированы.
Если вы популярны в поиске, то можете написать в теге title HTML страницы имя вашего бренда. Но не злоупотребляйте этим! Вы должны указать основной атрибут соответствующей страницы (например, фотогалерея), прежде чем указывать название бренда. В противном случае вы вызовите недовольство посетителей.
Стоп-слова — это слова, которые фильтруются до или после обработки данных на естественном языке (текста).
В HTML-документе, тег <title> должен размещаться перед всеми другими тегами. Поместите тег <title> в разделе <head> после мета-тега кодировки. <title> должен размещаться перед тегами <meta>.
Не копируйте заголовок страницы в теге <h2> HTML-документа. Поисковые системы будут рассматривать эту практику как дублированный контент, и вы спровоцируете негативную реакцию пользователей.
Большинство специальных символов не имеют никакого значения в SEO, так как они не рассматриваются в качестве ключевых слов. Вы накажете сами себя, если вставите в HTML head title специальные символы, такие как стрелки, например. Вы получите неприятности от поисковых систем.
Но есть исключения: символ «&» вместо «and» может сэкономить для вас количество символов (например, «sale of shoes and bags» в таком виде «sale shoes & bags«).
Данная публикация представляет собой перевод статьи «10 tips to improve your page title» , подготовленной дружной командой проекта Интернет-технологии.ру
Заголовок HTML-страницы | WebShake.RU
Заголовком страницы называют текст, расположенный в браузере под панелью меню на вкладке сайта. Еще этот текст называют title (тайтл), поскольку именно данный тег используется для его создания.Чтобы заголовок страницы отображался, тег <title> необходимо поставить внутрь тега <head>.
На примере это будет выглядеть следующим образом.
<head>
<title>Блог о веб-разработке - WebShake.RU</title>
</head>А вот так вот отображается заголовок непосредственно в браузере:
Данный тег очень важен для страницы, так как именно из него берётся название страницы в поисковой выдаче. Например, вот так выглядит WebShake в выдаче Гугла:
В свою очередь люди (в том числе и вы), когда что-то ищут в поисковике, читают в первую очередь название страницы. А оно-то и формируется этим тегом <title>. Он должен содержать в себе основную суть страницы в нескольких словах. Также он не должен быть больше 80 символов — иначе остальные символы поисковики обрубят и заменят многоточием. Надеюсь, я смог донести до вас, насколько этот тег важен. Ну а теперь давайте сделаем домашнее задание по данному тегу.
Заголовки | htmlbook.ru
Заголовки выполняют важную функцию на веб-странице. Во-первых, они показывают важность раздела, к которому относятся. Чем больше заголовок и его «вес» , тем более он значимый. Вспомните, что в газетах и журналах передовицы набраны крупным шрифтом, тем самым, привлекая к ним внимание и говоря: «вот это надо читать обязательно» . Во-вторых, с помощью различных заголовков легко регулировать размер текста. Чем выше уровень заголовка, тем больше размер шрифта. Самым верхним уровнем является уровень 1 (<h2>), а самым нижним — уровень 6 (<h6>). И, в-третьих, поисковики добавляют рейтинг тексту, если он находится внутри тега заголовка. Это важно для раскрутки сайта и для его занятия первых строк выдачи результата в поисковой системе по ключевым словам.
Синтаксис создания заголовков показан в примере 7.3.
Пример 7.3. Добавление заголовков
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Заголовки в тексте</title> </head> <body> <h2>Заголовок первого уровня</h2> <h3>Заголовок второго уровня</h3> <h4>Заголовок третьего уровня</h4> <h5>Заголовок четвертого уровня</h5> <h5>Заголовок пятого уровня</h5> <h6>Заголовок шестого уровня</h6> </body> </html>
Результат данного примера показан на рис. 7.3. Содержимое тега <h2> отображается самым крупным шрифтом жирного начертания, а <h6> — самым мелким.
Рис. 7.3. Вид заголовков на веб-странице
Как правило, на веб-странице применяют заголовки с первого по третий уровень, их вполне достаточно. Редко когда приходится использовать заголовки более низкого уровня.
Как сделать заголовок в HTML
Когда речь идет об удобстве чтения длинных текстов, то их, как правило, делят на логические части с помощью заголовков и подзаголовков. Если вы набираете код в специальном текстовом редакторе, то функция формирования заголовка из определенной части текста, в нем уже встроена. Достаточно выделить текст и нажать на опцию.
Но если говорить о языке HTML, то в нем заголовки принято создавать с помощью тегов, которые, между прочим, представлены целым семейством.
Первый тег данного семейства – <h2>, последний – <h6>. Первый тег используют, чтобы выделить наиболее важный заголовок на странице, по-хорошему на странице должен быть лишь один заголовок
Хотя, если говорить с практической точки зрения, не очень часто можно встретить тексты, где есть подзаголовки ниже третьего уровня. И выделяются все три заголовка тегами <h2>, <h3> и <h4>.
Давайте добавим на нашу страничку заголовки:
...
<body>
<h2>Книги для программистов</h2>
<h3>Название книги 1</h3>
<p>
Текст про книгу 1
</p>
<h3>Название книги 2</h3>
<p>
Текст про книгу 2
</p>
</body>
...Результат в браузере:
Что касается поисковых систем, то для них заголовки играют большую роль. Поэтому, есть смысл научиться их грамотно писать и применять. Есть 2 главных правила при создании заголовков в HTML. Готовы узнать секреты? Держите:
- Заголовок h2 должен быть на странице только один
- Вложенность заголовков не должна нарушаться. То есть после h2 не должно быть сразу h4. Нормальная вложенность это когда заголовки идут, например, в таком порядке: h2-h3-h4-h4-h5-h3-h4-h5
Зная эти секреты Вам будет проще продвинуться в поисковых системах. И если про первый ещё кто-то знает, то со вторым всё печально. Люди используют их в разных порядках просто потому что им нравится размер шрифта. Так делать не стоит.
Заголовки HTML уроки для начинающих академия
Заголовки
Заголовки 2
Заголовки 3
Заголовки 4
Заголовки 5
Заголовки 6
Заголовки HTML
Заголовки определяются с помощью <h2> для <h6> тегов.
<h2>определяет наиболее важный заголовок. <h6>определяет наименее важный заголовок.
Пример
<h2>Заголовки 1</h2>
<h3>Заголовки 2</h3>
<h4>Заголовки 3</h4>
<h5>Заголовки 4</h5>
<h5>Заголовки 5</h5>
<h6>Заголовки 6</h6>
Примечание: Браузеры автоматически добавляют пробел (поле) до и после заголовка.
Заголовки важны
Поисковики используют заголовки для индексации структуры и содержания ваших веб-страниц.
Пользователи снимают страницы по заголовкам. Важно использовать заголовки для отображения структуры документа.
<h2>заголовки должны использоваться для основных рубрик, за которыми следуют <h3> заголовки, затем менее важные <h4> и так далее.
Примечание: Используйте заголовки HTML только для заголовков. Не используйте заголовки, чтобы сделать текст BIG или bold.
Большие заголовки
Каждый заголовок HTML имеет размер по умолчанию. Однако можно указать размер любого заголовка с атрибутом style, используя свойство CSS font-size:
Пример
<h2
style=»font-size:60px;»>Heading 1</h2>
Горизонтальные правила HTML
Тег <hr> определяет тематический разрыв в HTML-странице и чаще всего отображается как горизонтальное правило.
Элемент <hr> используется для разделения содержимого (или определения изменения) в HTML-странице:
Пример
<h2>This is heading 1</h2>
<p>This is some text.</p>
<hr>
<h3>This is heading 2</h3>
<p>This is some other text.</p>
<hr>
Теги заголовка документа | htmlbook.ru
К этим тегам относятся элементы, которые располагаются в контейнере <head>. Все эти теги напрямую не отображаются в окне браузера, за исключением тега <title>, который определяет название веб-страницы.
<title>
Используется для отображения строки текста в левом верхнем углу окна браузера, а также на вкладке. Такая строка сообщает пользователю название сайта и другую информацию, которую добавляет разработчик.
<meta>
Метатеги используются для хранения информации, предназначенной для браузеров и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам для получения описания сайта, ключевых слов и других данных. Хотя тег <meta> всего один, он имеет несколько атрибутов, поэтому к нему и применяется множественное число.
Так, для краткого описания содержимого веб-страницы используется значение description атрибута name, как показано в примере 5.2.
Пример 5.2. Использование description
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>HTML</title>
<meta name="description" content="Сайт об HTML и создании сайтов">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
</head>
<body>
<p>...</p>
</body>
</html>Описание сайта, заданное с помощью тега <meta> и значения description, обычно отображается в поисковых системах или каталогах при выводе результатов поиска. Значение keywords также предназначено в первую очередь для повышения рейтинга сайта в поисковых системах, в нем перечисляются ключевые слова, встречаемые на веб-странице (пример 5.3).
Пример 5.3. Использование keywords
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>HTML</title>
<meta name="keywords" content="HTML, META, метатег, тег, поисковая система">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
</head>
<body>
<p>...</p>
</body>
</html>Ключевые слова можно перечислять через пробел или запятую. Поисковые системы сами приведут запись к виду, который они используют.
HTML заголовок и его виды
В прошлом уроке мы рассмотрели основы HTML и обязательные теги, сейчас продолжим знакомство с другими тегами и рассмотрим каким образом создаются HTML заголовки.
В HTML документе заголовок играет большую роль. Он концентрирует внимание посетителя и призывают его прочитать статью, или какой либо материал, он играет большую роль в оптимизации страниц под поисковые системы т. к. поисковики обращают внимание на текст заключенный между тегами заголовка и т. д.
Материалы по теме:
HTML заголовки бывают 6-ти уровней, каждый из которых отличается величиной. За создание заголовка отвечает тэг <Hx> и парный закрывающий его тэг </Hx>. Где x – это число от 1 до 6-ти, которое определяет уровень заголовка.
Таким образом, тэг <h2> </h2> определяет самый большой размер заголовка, а тэг <h6> </h6> самый маленький. На рисунке вы можете видеть все уровни заголовков от 1-го до 6-го.
В основном применяют заголовки более высоких уровней, очень редко применяются заголовки 6-го и 5-го уровней. Попробуем применить этот тег на практике и сделаем заголовок для HTML страницы. Назовем ее, к примеру, «Тестовая страница» и применим к ней заголовок 1-го уровня.
Для этого в код нашей веб-страницы, которую мы создавали в уроке основы html, сразу после тега <body> вставим следующее <h2>Тестовая страница</h2>. Весь код будет выглядеть так:
<html> <head> <title>Моя первая страница </title> </head> <body bgcolor="#FFFF99" text="#0000CD"> <h4>Тестовая страница</h4> Вот вы и создали свою первую web страницу!!! </body> </html>
Можете попробовать изменять цифры в тэге заголовка от 1-го до 6-ти и посмотреть, как будет меняться величина текста. Не забудьте что после каждого изменения в коде, html файл необходимо сохранить, а чтобы увидеть внесенные изменения необходимо обновить веб-страницу в браузере. Одновременно с величиной текста тег заголовка задает отступы и делает текст жирным.
В основном при создании html документов используют заголовки первого, второго и третьего уровня. Поисковые системы больше всего обращают внимание на ключевые слова находящиеся в заголовке первого уровня, меньше в заголовке второго и третьего уровня и т. д., т. е. чем больше уровень заголовка тем меньше он представляет какое либо значение для поисковых систем. В настоящее время поисковые системы перестали придавать большое значение ключевым словам заключенным в теге h2. Более подробно об этом читайте в материалах раздела SEO оптимизация. Изучение остальных тегов мы продолжим в других уроках по html.
Материал подготовлен порталом: webmastermix.ru
Рекомендуем ознакомиться со следующими материалами:
- Подробности
Обновлено: 04 Сентябрь 2013
Создано: 12 Январь 2010
Просмотров: 26826