Теги <meta> в HTML

В этой главе:

  • Кодировка

  • keywords (ключевые слова)

  • description (краткое описание)

  • Тег <title>

Теги <meta> используются для предоставления информации (метаданных) о веб-странице, метаданные не отображаются на веб-странице, а дают либо какие-то указания браузеру, либо предоставляют дополнительную информацию для поисковых систем:

1
2
3
4
5
6
<head>
  <meta charset="utf-8">
  <title>Не является мета тегом, но должен присутствовать на каждой веб-странице</title>
  <meta name="keywords" content="ключевые слова">
  <meta name="description" content="Краткое описание">
</head>

В нашем примере мы использовали три элемента <meta>: первый указывает браузеру кодировку HTML-документа, два других мета тега предназначены для предоставления информации о содержимом веб-страницы для поисковых систем. Далее мы рассмотрим каждый из них подробнее.

Примечание: теги <meta> должны располагаться в элементе <head>.

Кодировка

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

Для указания кодировки используется тег <meta> с атрибутом charset, который рекомендуется располагать в качестве первого элемента внутри <head>:

1
2
3
<head>
  <meta charset="utf-8">
</head>

Примечание: UTF-8 является универсальной кодировкой, поддерживающей большинство языков и спецсимволов.

keywords (ключевые слова)

У любого сайта есть набор ключевых слов и словосочетаний, по которым поисковые системы ищут нужные ресурсы в сети. Именно эти слова и должны составлять содержимое keywords.

Самый простой способ подобрать нужные ключевые слова для текущей страницы - это определить по каким словам вы сами стали бы искать материал, представленный на ней? Вот это и будут нужные ключевые слова. Пример:

1
<meta name="keywords" content="мета тег, meta, метаданные, keywords, description">

Ключевые слова указываются через запятую или пробел и могут быть написаны в любом регистре. Рекомендуется указывать не более 10-15 ключевых слов или словосочетаний.

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

description (краткое описание)

Значение description используется для краткого описания содержимого, расположенного на текущей странице. Рекомендуемая максимальная длина такого описания не должна превышать 180 символов:

1
<meta name="description" content="Описание содержимого на данной странице">

Краткое описание страницы может быть использовано поисковыми система на странице с результатами поиска под названием страницы и URL-адреса:

отображение description в результатах поиска

Также краткое описание используется на сайтах некоторых соцсетей, при добавлении ссылки:

отображение description при добавление ссылки в соц сетях

При составлении краткого описания следует учитывать следующие моменты:

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

  • описание должно быть уникальным и не должно повторяться для разных страниц;

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

Примечание: краткое описание, расположенное под ссылкой на странице с результатами поиска, называется сниппетом.

Тег <title>

Тег <title> является частью метаданных и используется для указания заголовка страницы. Заголовок страницы можно сравнить с названием главы книги, так как он должен говорить пользователям и поисковым системам об информации представленной на странице.

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

тег title

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

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

  • Самые важные ключевые слова нужно располагать первыми в заголовке, т.е. поисковые системы будут определять ценность ключевых слов по их очередности в заголовке: первое будет считаться наиболее важным, последнее - наименее.

  • Для разделения ключевых слов или фраз лучше использовать вертикальную черту "|". Знаки пунктуации, подчеркивания и другие символы разделители желательно не использовать или использовать в тех случаях, когда ключевое слово или фразу без них написать нельзя.

  • Старайтесь исключить из заголовка разные частицы речи (например: и, если, но, потом и т.д.).

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

  • Не дублируйте текст тега <title>, заголовок должен быть уникальным для каждой страницы сайта.

  • Заголовок должен быть актуален для страницы, он должен описывать то, что в данный момент представлено на странице, например его можно написать так:

1

2

3

<title>Тема страницы|Ключевые слова|Название компании или сайта</title>
<!-- или так -->
<title>Ключевые слова|О нас|Название компании или сайта</title>