Мета теги для сайта. Для чего они нужны?

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

Основными мета тегами являются:
title — название страницы\сайта
description — описание страницы\сайта
keywords — ключевые слова.

Именно по этим тегам поисковые боты понимают о чём Ваш сайт и как правильно его индексировать.

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

<title>Название сайта\страницы </title>
<meta name="description" content="Описание Вашей замечательной страницы сайта не должно превышать 160 символов">
<meta name="keywords" content="релевантные слова, не превышает 255 символов, спам повторными словами будет игнорироваться" />

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

<meta property="og:title" content="Название сайта\страницы" />
<meta property="og:description" content="Описание Вашей замечательной страницы сайта не должно превышать 160 символов" />
<meta property="og:url" content="https://example.com" />
<meta property="og:site_name" content="example.com">
<meta property="og:image" content="https://example.com/metalogo.jpg" />
<meta property="og:article:author" content="example.com">
<meta property="og:locale" content="ru_Ru">

Пример мета тегов для Twitter:

<meta name="twitter:site" content="@АККАУНТ САЙТА" />
<meta property="og:description" content="Описание Вашей замечательной страницы сайта не должно превышать 160 символов" />
<meta name="twitter:creator" content="@АККАУНТ АВТОРА\САЙТА" />
<meta name="twitter:title" content="Название сайта\страницы" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://example.com/metalogo.jpg">
<meta name="twitter:url" content="https://example.com">

В тегах » og:image » и » twitter:image » — указывается картинка, которая будет отображаться при публикации в одной из соц.сетей. Картинка должна быть указана исключительно полноценной ссылкой, нельзя прописывать относительные ссылки, так как робот их не принимает.

Пример НЕПРАВИЛЬНОЙ ссылки:

<meta name="twitter:image" content="/images/metalogo.jpg">
<meta property="og:image" content="/images/metalogo.jpg" />

Пример ПРАВИЛЬНОЙ ссылки:

<meta name="twitter:image" content="https://example.com/metalogo.jpg">
<meta property="og:image" content="https://example.com/metalogo.jpg" />

Если вы изменили мета теги — очистить кэш расшариваемых страниц можно по ссылкам:
Facebook . Отладчик репостов: https://developers.facebook.com/tools/debug/
Twitter . Card validator: https://cards-dev.twitter.com/validator
ВКонтакте . pages.clearCache: https://vk.com/dev/pages.clearCache
Telegram . Webpage Bot: https://telegram.me/webpagebot

Оставить комментарий

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