Що таке розмітка Open Graph та як ефективно її використовувати
Доброго часу перебування на нашому блозі! Пропоную сьогодні детально поговорити про спеціальний протокол Open Graph і про те, як можна ефективно використовувати його для залучення великої кількості трафіку з соціальних мереж.
Для початку давайте розберемося, що таке розмітка Open Graph. Це протокол, який дозволяє керувати та контролювати дані, що формуються в прев’ю (структурує інформацію про сторінку) у пості, коли користувач ділиться посиланням у соціальних мережах. У реальності - це кілька рядків мета-тегів, які потрібно впровадити в код вашого сайту. Саме вони й дозволять сформувати бажаний вигляд для поста в соціальних мережах.
Ось приклад, як виглядає в соціальній мережі Вконтакте структурована інформація про посилання на статтю з використанням протоколу Open Graph:
А ось так вона виглядає у Facebook:
Погодьтеся, такий пост виглядає дуже привабливо і клікабельно, а це лише посилання, яким користувач соціальної мережі поділився зі своїми друзями, розмістивши його на своїй стіні чи в спільноті.
До речі, що робити, якщо в коді ви все розмістили правильно, а при шерингу у Facebook відображається неправильна/застаріла інформація? Ласкаво просимо до Facebook for developers - за цим посиланням ви зможете очистити старий кеш інформації, який зберігається у соціальній мережі для вашої сторінки, і "згодувати" їй новий красивий заголовок та опис.
Напевно, тепер у вас виникла ідея налаштувати розмітку Open Graph для свого сайту, а потім поспамити в тематичних групах і спільнотах соціальних мереж?
Як налаштувати розмітку Open Graph
Давайте тепер розберемося, як налаштувати протокол Open Graph для вашого сайту, щоб втілити цю ідею в життя.
Тут усе надзвичайно просто! Ось так виглядає вихідний код протоколу Open Graph:
який розміщується в коді сторінки, у розділі..., може знаходитися, наприклад, після основних мета-тегів.
Розглянемо кожен тег Open Graph окремо і розберемося в їхніх значеннях:
- "og:locale" — вказує локалізацію (мову сайту), можна використовувати значення "ru_RU" за замовчуванням.
- "og:type" — вказує тип сторінки (стаття, новина, відео, категорія тощо), можна використовувати за замовчуванням "article".
- "og:title" — вказує заголовок статті.
- "og:description" — вказує короткий опис, який відображається при формуванні прев’ю посилання.
- "og:url" — посилання на сторінку сайту.
- "og:image" — посилання на картинку, яка відображатиметься в пості.
- "og:site_name" — назва сайту.
Значення кожного тега розписано, тому вам залишилося лише заповнити їх і впровадити в код сторінок вашого улюбленого інтернет-ресурсу.
Додатково хочеться додати, що з впровадженням протоколу Open Graph рекомендується встановити на сторінки сайту кнопки «Поділитися» в соціальних мережах. Це спростить можливість користувача поділитися корисною інформацією про ваш сайт з іншими юзерами. І, звісно, дещо полегшить завдання SEO-оптимізатора при роботі з біржами "лайків", які хоч і не приносять відчутного посилального ефекту, але дозволяють дещо прискорити індексацію/переіндексацію при просуванні сайту. Наприклад:
Open Graph для WordPress, Opencart, Joomla
Для найпопулярніших CMS-систем існують уже готові плагіни, які допомагають реалізувати впровадження розмітки Open Graph без залучення програмістів.
Наприклад, для WordPress цей SEO-плагін можна завантажити тут. Для Joomla ви знайдете плагін за цим посиланням, а для OpenCart пропоную взяти його тут.
Зробіть свій ресурс популярним не лише в пошуку, а й у соціальних мережах. Отримуйте безмежну кількість трафіку і не забудьте підписатися на нашу розсилку, щоб регулярно отримувати свіжі та корисні статті на різні теми з рекомендаціями щодо покращення вашого сайту!
