Метатеги в HTML

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

Метатеги что это?

Раньше,  метаданные использовались поисковыми системами для индексирования веб-страниц, основываясь на название title , описание description и  ключевые слова keywords . Существует много веб-страниц без метаданных , а так же, есть веб-сайты которые злоупотребляют мета-тегами в надежде получить более релевантные результаты поиска. Компания Google в 2009 году объявила; что мета-теги таких сайтов не будет ранжироваться в поисковых алгоритмах Google.

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

Веб-страница с хорошим мета-описанием
Веб-страница имеет хорошее мета-описание

Еще одна важная вещь, которую следует отметить, Google и Bing  это не единственные поисковые системы, есть и другие, например, Yandex в котором запросы ‹Бухгалтерский учет› миллион в день. Позже, в одной из платных статей Я поделюсь своим опытом как правильно заполнять метаданные для веб-страниц.

Сейчас с уверенностью могу сказать одно:

— поисковый робот создавался человеком, поэтому он выбирает короткий не сложный и не всегда правильный путь!

Устаревшие meta-tag

Вот более полный вариант кодировки символов, который был широко распространен в XHTML.



<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />


Вариант, указать кодировку документа ниже будет достаточно, что бы браузер знал какой это документ и с кокой кодировкой.

Устаревшие мета-теги также указывают авторские права.



<meta name="copyright" content="Pixel.com" />


Можно указать ссылку, указывающею на страницу copyright (или якорь на той же странице).



<link rel="copyright" href=
http://pixelcom.crimea.ua/"copyright.html">


И последнее, многие веб-сайты по-прежнему пишут ключевые слова keywords , Google их не рассматривает в поисковом алгоритме ранжирования или при отображении результатов поиска. На самом деле, алгоритм поиска Google никогда не знал о ключевых словах в мета-теге.



<meta name="keywords" content="web,design,html,css,html5">


Google сказал :
… маловероятно, что в будущем это изменится , так что Вы не должны беспокоиться о ключевых словах в мета-теге.
Поскольку Китай основной поставщик компьютерной техники, есть факты, что китайский Baidu-language search engine рассматривает мета-тег ключевых слов, это один из основных факторов его алгоритма для поиска . Что касается Яндекс, был создан веб-сервис ключевых слов Яндекс.

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

Применить meta-teg

Что бы определить значение meta к атрибуту name требуется добавить название мета-тега.

Метатег: descriptions

Мета-тега descriptions   — описание статьи:



<meta name="description"
      content="Общее руководство по использованию мета-тегов веб-страницы html">


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

Метатег: author

Метатег author — автор статьи:



<meta name="author" content="Pixel Bot">


Мета-тег author заполняется на ваше усмотрение, но лучше заполонять все мета-теги HTML, хуже от этого не будет.

Метатег: charset

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



<meta charset="utf-8">


Заголовок HTTP

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



<meta http-equiv="refresh" content="5;url=http://www.pixelcom.crimea.ua">


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

Метатег: robots

Метатег robots разрешает или запрещает индексировать веб-страницу.

Список значений для поля content :

  • noindex — запрещает индексирование документа;
  • index — разрешает индексирование документа;
  • nofollow — запрещает проход по ссылкам, имеющимся в документе;
  • follow — разрешает проход по ссылкам.
  • all — равносильно index, follow
  • note — равносильно noindex, nofollow

Значение по умолчанию:



<meta name="robots" content="index, follow">


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



<meta name="robots" content="noindex, nofollow">


или



<meta name="robots" content="note">


В следующем примере робот может индексировать документ, и не должен переходить из него по ссылкам на другие документы:



<meta name="robots" content="index, nofollow">


Имя тега, названия и значения полей нечувствительны к регистру.

В поле content дублирование инструкций, наличие противоречивых инструкций и т.п. не допускается; в частности, значение поле content не может иметь вид none, nofollow .

Метатег: viewport

Мобильных браузеров раньше не было, они появились позже чем браузеры для ПК, к тому времени веб-сайтов в интернете уже было много. Все эти веб-сайты не были оптимизированы для разных размеров экрана мобильных устройств, на смартфоне или на нетбуке страницу веб-сайта можно смотреть было частями. Что бы адаптировать веб-страницы сайта под разные размеры экрана мобильных устройств, в компании apple придумали мета-тег <meta name="viewport"> для браузера safari, теперь этот тег понимают все современные браузеры.



<meta name="viewport" content="width=device-width">


Meta-teg в социальных сетях

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



<meta property="og:title" content="Лучший сайт">
<meta property="og:image" content="Ссылка на изображение">
<meta property="og:description" content="Здесь описание">


Для подробного изучения рекомендую Вам прочесть документацию Facebook и Twitter Cards (с использованием name="twitter:title" или name="twitter:url" ) и Google использует Schema.org (с использованием itemscope и itemprop ).

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

Инструменты метаданных

Инструменты метаданных не требуют глубоких знаний HTML или иных веб-технологий. Так же есть набор приложении для Google Analytics которые помогут вам оптимизировать веб-сайт.

Если Вы работаете в WordPress , там есть много вариантов для создания метаданных при написании или редактировании поста, наиболее популярным из которых является WordPress SEO. Для Joomla и Drupal также есть свой набор плагинов и модулей для мета-тегов. Если Вы ими не пользуетесь, есть возможность использовать онлайн метатег генератор .

Заключение

Мета-теги не решают все проблемы с SEO , но они важная часть оптимизации веб-сайта. Если вы являетесь владельцем веб-сайта, Вы можете отслеживать производительность вашего веб-сайта зарегистрировавшись на Google Webmaster Tools . После регистрации Вы сможете получать уведомления в случае возникновения каких-либо ошибок сканирования, что может быть связано с неправильным использованием мета-тегов.

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

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

Можно использовать следующие HTML -теги и атрибуты: <a href= http://pixelcom.crimea.ua/"" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>