Створення сайтів - студія веб-дизайну WebStudio2U Контактні дані веб-студії WebStudio2U RSS стрічка веб-студії WebStudio2U Мапа сайту Авторизація

Оптимізація сайту і правильна семантична розмітка

Оптимізація сайту і правильна семантична розмітка Для успішного пошукового просування сайту має значення рішуче все, аж до HTML-розмітки кожної сторінки. Причому не просто розмітки, а семантичної: так званий семантичний HTML вже давно застосовується для поліпшення індексації сторінок пошуковими системами, дозволяючи їм давати точніші відповіді на запити користувачів. Варто детальніше розглянути, як виконується правильна семантична розмітка сторінок з точки зору успішної пошукової оптимізації сайту.

Семантична розмітка призначена для того, щоб пошукові роботи могли краще розпізнавати контент сторінок і на підставі цього дати більш релевантні результати пошуку. Крім того, семантична розмітка допомагає і в соціальній рекламі: соціальні мережі на кшталт Facebook, Twitter або Pinterest «люблять» таку розмітку, адже завдяки їй публікація різної інформації з сайтів за допомогою соціальних кнопок виходить більш інформативною і візуально привабливою (можна згадати, наприклад, Twitter Cards).

Додатково можна не відзначити, що семантична розмітка сторінок сайтів дозволяє поліпшити на цих сайтах показники так званого аксесибіліти (accessibility) — доступності сайтів для користувачів з особливими потребами. Допоміжні технології, такі як, наприклад, для голосового читання з екрану, при використанні семантичної розмітки зможуть точніше передавати користувачам зміст контенту.

Сьогодні найбільш поширений стандарт семантичної розмітки, відомої, до речі, також як мікророзмітка, – це Schema.org, оскільки саме його підтримують і розвивають основні популярні пошукові системи, такі як Google , Bing, Yandex. Згідно з даним стандартом, сторінка сайту, що містить, скажімо, статтю, може мати такі основні елементи:

  • itemscope itemtype="https://schema.org/Article" — вказує, що індексований документ є статтею і для нього вибрана схема Article;
  • itemprop="name" — вказує назву сторінки;
  • itemprop="description" — вказує короткий опис статті;
  • itemprop="headline" — вказує заголовок статті; може бути більш розгорнутим, ніж name;
  • itemprop="datePublished" — вказує дату публікації;
  • itemprop="author" — вказує автора статті;
  • itemprop="about" — вказує анонс статті;
  • itemprop="articleBody" — вказує тіло статті;
  • itemprop="dateModified" — вказує дату зміни статті;
  • itemprop="relatedLink" — вказує посилання на пов'язані зі статтею інші сторінки сайту.

Використовувати семантичну розмітку зручніше не в структурі кожної окремо взятої сторінки сайту, а в загальному шаблоні HTML для певного типу сторінок сайту. Наприклад, деякі CMS вже мають вбудовані інструменти або ж додаткові розширення для роботи з різними форматами семантичної розмітки.

Цікаво, що перевірити, чи правильно виконана розмітка, дозволяє Google's Stuctured Data Testing Tool. Для перевірки в цьому інструменті можна вставити як код, який готується до впровадження на сайт, так і посилання на сторінку з уже впровадженими кодом. Інструмент визначить, які типи даних використовуються в розмітці, і вкаже, чи є помилки у використовуваному синтаксисі.

Теги:
пошукове просування сайтів, оптимізація сайтів, семантична розмітка сторінок, семантична розмітка сайтів