Проверка наличия и правильности тегов Open Graph
Обязательные теги Open Graph:
Для корректного отображения контента в соцсетях обязательно наличие следующих тегов в разделе <head> страницы:
<meta property="og:title" content="Название страницы" /> <meta property="og:type" content="website" /> (или article, если это публикация) <meta property="og:url" content="https://www.example.com/ /> <meta property="og:image" content="https://www.example.com/image.jpg /> <meta property="og:description" content="Описание контента" />
Дополнительные теги:
<meta property="og:locale" content="ru_RU" /> — указывает локаль контента. <meta property="og:site_name" content="Название сайта" /> — название сайта для брендинга.
Обязательно используйте актуальные и релевантные данные,
чтобы привлекать внимание пользователей в социальных сетях.
Проверка синтаксиса и форматирования
Все теги должны быть корректно закрыты.
Используйте префикс Open Graph в HTML-документе:
<html prefix="og: http://ogp.me/ns# >
Инструменты для тестирования разметки
Проверить корректность Open Graph можно с помощью следующих инструментов:
-
Facebook Sharing Debugger — анализирует и показывает, как страница будет выглядеть при публикации в Facebook.
-
Open Graph Check — позволяет проверить наличие и правильность тегов Open Graph.
Также рекомендуется использовать расширение для браузера, которое показывает наличие микроразметки на странице.
Проверка микроразметки Schema.org
Ключевые типы разметки:
-
Article — для статей и блогов.
-
Product — для товаров в интернет-магазинах.
-
FAQPage — для разделов с часто задаваемыми вопросами.
Пример JSON-LD для статей:
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "Заголовок статьи",
"author": {
"@type": "Person",
"name": "Автор статьи"
},
"datePublished": "2024-12-02",
"image": "https://www.example.com/image.jpg"
}
Проверка совместимости с соцсетями
Для корректного отображения в соцсетях необходимо проверить отображение заголовка, описания и изображения.
Twitter Cards: Добавить теги для Twitter, если требуется:
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Ваш заголовок"> <meta name="twitter:description" content="Описание контента"> <meta name="twitter:image" content="https://www.example.com/image.jpg">
Регулярное обновление и тестирование
-
Обновляйте разметку: При добавлении нового контента или изменении старого.
-
Тестируйте страницу: Используйте инструменты от Google и Facebook после каждого изменения.
Следование этому чек-листу поможет вам обеспечить корректное отображение вашего контента в социальных сетях и улучшить SEO. Регулярная проверка и обновление мета-тегов гарантируют, что ваш сайт будет привлекать больше трафика и обеспечивать лучший пользовательский опыт.
Оптимизируйте ваш сайт с помощью нашего руководства по разметке Open Graph и микроразметке Schema.org! Следуйте нашим советам для улучшения видимости и вовлечённости. Обратитесь в Kamensky-lab за консультацией и выведите ваш бизнес на новый уровень!
![https://www.example.com/image.jpg"](https://www.example.com/image.jpg"){kind=link}
![https://www.example.com/image.jpg">](https://www.example.com/image.jpg">){kind=link}