Основна функція мета тегів на сайті – просування в пошуковій видачі. Теги також використовуються для публікації посилань сайту в соц.сетях, за рахунок мета тегів посилання при публікації перетворюється в блок уявлення про сайт і картинкою.
Основними мета тегами є:
title – назва сторінки\сайта
description – опис сторінки\сайта
keywords – ключові слова.
Саме за цими тегами пошукові боти розуміють про що Ваш сайт і як правильно його індексувати.
Мета теги прописуються в сторінці сайту між тегами <head> </ head> і мають такий вигляд:
<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="ua_UA">
Приклад мета тегів для 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