Как использовать отладчик Facebook для проверки ссылок и картинок

Довольно часто при публикации статьи (или при ее перепосте) в Facebook неверно отображаются изображения. Приходится удалять публикацию и повторно ее размещать, либо загружать свое собственное изображение с компьютера. Это вызывает определенные неудобства, хотя и является распространенной проблемой. Но, к счастью, это легко исправить с помощью отладчика Facebook.

В сегодняшней статье мы рассмотрим основные причины проблемы, а также пути их решения с помощью отладчика Facebook.

Что является причиной проблемы, когда не подгружается картинка

Существует довольно много причин этой проблемы, и иногда их тяжело определить. Самой распространенной причиной является неправильное использование тегов og (теги Open Graph, например для картинок используется тег og:image).

Когда вы делитесь статьей, Facebook пытается подобрать нужную картинку и делает он это с помощью тегов og. Если этот тег отсутствует, это может вызывать проблему.

Другой вероятной причиной может быть использование неверного размера изображения. Facebook распознает изображения размером не менее 200×200 пикселей, предпочитает большие изображения размером не менее 600×315 пикселей, а для больших экранов использует разрешение 1200×630 пикселей.

Данная проблема может быть решена несколькими способами. Один из вариантов – загрузить нужное изображения вручную. Это только частичное решение, возможно, лучшее решение – это устранить проблему с помощью Отладчика репостов Facebook (Facebook Sharing Debugger).

Использование Отладчика репостов Facebook

Отладчик репостов доступен в наборе инструментов Facebook для разработчиков. С помощью этого инструмента вы сможете просканировать нужную страницу, выявить мета-теги и увидеть ошибки. Он даже может проверить ваш HTML код.

Чтобы использовать данный инструмент, вставьте URL-адрес нужной страницы и нажмите кнопку Отладка. В результате вы увидите ошибки (при их наличии), а также советы по их устранению. После исправления ошибок, нажмите кнопку Повторить скрапинг (Scrape Again), чтобы очистить кеш и Facebook увидел вашу новую картинку.

Изображение должно быть предварительно закэшировано, прежде чем оно будет отображаться в приложении для репоста. Вам придется либо предварительно закэшировать изображение, запустив его в Отладчике репостов, либо использовать теги Open Graph (og:image:width и og:image:height), чтобы сканер-бот мог получить его без предварительной обработки.

Примеры ошибок в Отладчике репостов Facebook

• Нет заданного изображения, первое изображение слишком маленькое

Если для страницы не задано изображение (в основном главная картинка поста), бот выбирает следующее найденное изображение. То же происходит, если изображение задано, но его размеры меньше требуемых. В таких случаях желательно размещать основное изображение выше других на странице, а также, чтобы оно имело размеры не меньше чем 600×315 пикселей.

• Слишком маленькое изображение

Даже если такое изображение указано как картинка страницы, Facebook его проигнорирует. В таких случаях следите, чтобы оно имело размеры не меньше чем 600×315 пикселей.

Исправление ошибок в тегах Open Graph

Картинки – это только одна из потенциальных проблем при репостах в Facebook. Основные предупреждения, которые вы увидите, включают теги og. Это означает, что мета-теги, которые нужны Facebook, отсутствуют. Если для своего сайта вы используете CMS, такую как WordPress, тогда самым простым решением будет использование подходящего плагина, например, такого как Facebook Open Graph. Этот и подобные плагины автоматически устанавливают og теги, основываясь на html коде страницы. Размещение нужных тегов og на странице позволит Facebook нормально ее обработать и правильно провести рендеринг картинки и ссылки этой страницы.

Краткий итог

Отладчик репостов Facebook – это простой способ узнать, что вызывает проблемы, с которыми вы или ваши читатели сталкиваются при попытке репоста публикации. Стоит приложить дополнительные усилия для того, чтобы ваши публикации были правильно отформатированы и правильно определялись Facebook. Хорошо отформатированные публикации получают больше взаимодействия и привлекают к себе больше внимания.