Ми заходимо в пошукову систему з конкретним запитом, вбиваємо його в пошуковий рядок, отримуємо результат видачі. Далі — вивчаємо ТОП перших позицій та переходимо на вподобаний ресурс.
Мета-теги — це теги (частина HTML-коду), які надають пошуковим системам структуровані дані щодо конкретної сторінки. Вони розміщуються між тегом <head> … </ head>, перевіряються роботами під час індексації сайту.
Які функції виконують мета-теги? Розберемо детально.
Задачі мета-тегів
- Покращують ранжування сайту в пошуковій видачі, тому сприяють просуванню ресурсу. Теги орієнтовані на роботів, індексуючих веб-ресурси, і на людей, які вводять запит в пошуковий рядок;
- Надають інформацію про вміст сторінки, залучаючи цільову аудиторію;
- Сприяють адаптивному відображенню контенту на різних пристроях (комп’ютерах, планшетах, телефонах).
Як правильно використовувати мета-теги? Які завдання можна вирішити? Які обмеження надають пошукові системи?
Сьогодні ви дізнаєтеся все про мета-теги!
Класифікація мета-тегів
Теги прийнято поділяти на: seo мета-теги (які сприяють пошуковій оптимізації сайту) та технічні мета-теги (відповідають за технічну оптимізацію ресурсу).
Seo мета-теги включають: Title, Description, Keywords.
Тег Title
Перший, головний для пошукової оптимізації мета-тег, який відіграє величезну роль в релевантності ресурсу — Title! Це своєрідний заголовок сайту, який має свої унікальні особливості.
Title відображається двома способами:
- У ТОПі пошукової видачі синім великим текстом, який передає суть сторінки, підштовхуючи користувача клікнути по посиланню;
- У вкладках браузера, щоб дозволити користувачеві зорієнтуватися при пошуку потрібного ресурсу.
Як заповнювати Title?
Для початку ми надамо загальні рекомендації щодо заповнення Title, доповнюючи прикладами, а потім поділимося готовими шаблонами!
- У Title використовують самі високочастотні запити на початку речення;
- Тег складається з головних ключів, однак не повинен бути їх переліком. Інакше пошукова система сприйме це як переспам. Наприклад, якщо ваші ключові слова: “курси в Харкові”, “IT-курси”, “стати програмістом”, то Title: “Пройти курси в Харкові, круті IT-курси. Як стати дуже гарним програмістом? ” — поганий варіант. Який тоді хороший?
- Правильно складений заголовок повинен легко читатися, бути інформативним та привабливим для користувача. Не рекомендовано використовувати ключові слова, за якими сторінка не просувається. Коротко передайте зміст сторінки: “IT-курси у Харкові: навчання на програміста — A-Level” — це вже хороший варіант;
- Слідкуйте, щоб ваш Title був унікальним. Перевірити дублікати тегів ви можете, використовуючи програми-парсери (screaming frog, netpeak spider) чи Google Search Console!
Вимоги ПС
Seo мета-теги мають свої специфічні особливості, в залежності від вимог пошукових систем.
Наприклад, максимальна довжина title повинна складати:
- Яндекс: 80 символів з пробілами (15 слів);
- Обмеження Google раніше складали: 70 символів з пробілами (12 слів). Однак, нещодавно Гері Ілш (співробітник Google) виступив із заявою про те, що довжина Title більше не має такого важливого значення. Головне, щоб заголовок передавав зміст сторінки. Санкцій до довгих Title не буде;
При цьому, десктопна версія відображає сніппет розміром 600 пікселів. Це означає, що текст буде автоматично обрізатися:
- Google: до 50-55 символів
- Яндекс: до 45-55 символів
Тег Description
Description — це мета-тег для сайту, який дає короткий, інформативний, соковитий опис контенту сторінки. Найчастіше він може використовуватися як сніппет – це невеликі уривки інформації, які бачить користувач в якості опису сайту за своїм запитом. Якщо Description був оформлений вдало, тоді пошуковик виводить його в сніпеті (це не стосується інформативних сторінок, де Google сам часто визначає сніппет).
Якщо ж цей пункт був пропущений /виконаний неякісно, то пошуковик може самостійно обрати найбільш релевантний контент сайту. Однак, це часто грає проти ресурсу, бо фраза, що була вирвана з контексту, звучить зім’ято.
Отже, ми визначилися, що заповнювати Description необхідно. Тепер давайте розберемося, як це робити.
Як заповнювати Description?
- Обов’язково використовуйте ключові слова, проте в помірній кількості, інакше робот помітить переспам;
- Не використовуйте вирваний шматок тексту, який не містить важливої інформації. Наприклад: “У сучасному світі складно уявити собі життя без смартфона, доступу до інтернету, високотехнологічних гаджетів. Сьогодні професія програміста є найбільш затребуваною та актуальною. Вона відкриває перед нами нові можливості! ” — такий варіант буде програшним;
- Інформація повинна містити зрозумілий опис контенту, що легко читається та відповідає на питання користувача, надає вигоду + УТП. Наприклад: “A-Level — IT-школа №1 в Харкові! Заняття проходять в режимі: онлайн + офлайн. Ти можеш освоїти будь-який напрямок програмування з нуля! Знижка -15% до 10 березня! ” — такий варіант більш продає;
- Заповнювати Description важливо для всіх URL сайту. Пріоритетними є: головна сторінка, каталоги. Важливо розуміти, що мета-теги Description описують кожну окрему сторінку сайту, але не весь ресурс відразу;
- Description може містити СТА (заклик до дії): Зв’яжіться з нами за телефоном 0959999999! Переходьте в наш каталог! Дізнайтеся більше на сайті!
- За необхідності текст можна доповнювати смайлами (обмежено);
- Опис також має бути унікальним, перевіряйте його парсерами чи Google Search Console;
- Description повинен відображати інформацію, яка дійсно знаходиться на сайті, є актуальною на цей час.
Вимоги ПС
Крім перерахованих вимог, є певні обмеження розмірів. Чітких рамок немає, проте велику кількість тексту пошуковик обріже. Користувач орієнтується тільки на невеликій видимий фрагмент тексту:
- Google: десктопний пошук — 135-175; мобільний пошук — 100-120 (символи з пробілами)
- Яндекс: десктопний пошук — 160-260; мобільний пошук — 100-160.
Кнопка «читати ще» відриває додатково 500 символів.
Keywords
Ключові слова мають другорядне значення. Пошукова система Google не враховує даний мета-тег в результатах пошуку з 2009 року. Однак, Яндекс в рідкісних випадках продовжує використовувати Keywords.
- Кожне слово має відповідати контенту сайту;
- Кількість ключових слів повинна становити максимум 3-6. Якщо вказати більше, робот зарахує це за переспам;
- Використовуйте високочастотні висококонкурентні запити.
Технічні мета-теги
Тепер розглянемо мета-теги для сайту технічного характеру. Вони дозволяють:
- Налаштувати окремі можливості відображення сайту різними сервісами, браузерами, пристроями, пошуковими системами;
- Налаштувати внутрішню оптимізацію сайту.
Viewport
Частка користувачів мобільного інтернету зростає з кожним днем. Щоб зберігати трафік, важливо адаптувати сайти під різні гаджети.
Мета-тег Viewport в розділі HEAD означає, що даний ресурс адаптований під відображення на мобільному пристрої.
Сам тег містить “код” (device-width), який підлаштовує ширину відображуваної сторінки під мобільний пристрій/комп’ютер. Наявність такого тега – актуальний фактор ранжування сторінок.
Open Graph
Open Graph — мета-теги для сайту, які дозволяють зробити якісний репост до інших сервісів (наприклад, соціальних мереж).
Дуже важливий інструмент залучення трафіку. Без такого тега репост може відображатися з рандомним контентом (картинкою, текстом). Open Graph дозволяє вам самостійно встановити вид анонса!
Open Graph включає:
- og: title — назва;
- og: description — опис;
- og: image — зображення;
- og: type — тип матеріалу;
- og: url — посилання на веб-сторінку, яка додається до соціальної мережі.

Robots
Ви можете самостійно вирішувати, які сторінки включати в індекс пошукових систем, використовуючи мета-теги Robots.
Даний тег дозволяє працювати з наступними атрибутами:
- index + noindex — можна індексувати сторінку;
- follow + nofollow — чи враховувати гіперпосилання;
- all + none – відкрити або закрити сторінку, гіперпосилання для індексації пошуковими системами;
Наприклад: <meta name=”robots” content=”noindex, follow”/>
Частина атрибутів підтримується тільки однієї пошуковою системою.
Яндекс | |
nosnippet — не показувати опис сторінки у пошуковій видачі | noyaca — не використовувати автоматичний опис сторінки |
max-snippet:[number] — найбільша довжина в сніппеті | index | follow | archive — скачування вказаної забороняючої директиви |
max-image-preview:[setting] — найбільший розмір зображень | |
max-video-preview:[number] — довжина відео | |
notranslate — не перекладати сторінку | |
noimageindex — не індексувати зображення | |
unavailable after: [date/time] — припинення показу сторінки з певного часу в пошуку |
Http-equiv
Які мета-теги потрібно використовувати, щоб сайт відображався завжди коректно?
- Content-Type — визначає кодування сторінки, дозволяє завжди коректно відображати ресурс в будь-якому браузері;
- Content-Language — визначає основну мову сторінки;
- Refresh — направляє користувача на іншу сторінку, якщо завантаження цієї сторінки відбувається довше заданого часу.
Висновок
Грамотне використання мета-тегів дозволить вам підняти сайт в пошуковій видачі, збільшити цільовий трафік, коректно відображати ресурс на будь-яких гаджетах.
коментарів