Загроза WebP для WhatsApp — нерозказана правда

Сьогодні наша клієнтка, яка продає нерухомість на Тенерифе, звернулася до нас із неприємною проблемою: коли вона ділиться оголошеннями про нерухомість зі своїми клієнтами в WhatsApp, попередній перегляд посилань не працює. Іноді немає зображення. Іноді навіть зникають назва та опис. Ще кілька днів тому все працювало ідеально — автоматично з’являлася гарна картка з фотографією та деталями.

WhatsApp та попередній перегляд посилань: чому це важливо

WhatsApp — це не просто месенджер. Це ключовий інструмент комунікації для мільйонів компаній по всьому світу. У багатьох галузях, особливо в нерухомості, електронній комерції та послугах, надсилання посилань через WhatsApp є важливою частиною воронки продажів. А коли ці посилання виглядають непрацюючими або порожніми, це миттєво підриває довіру. Люди не натискають на посилання, які здаються неповними або підозрілими.

Ми почали розслідування. Вебсайт був налаштований належним чином: теги Open Graph, такі як og:заголовок, og:опис, та og:зображення всі були присутні та правильні. Структура сторінки була нормальною. Нічого не змінилося в CMS чи темі.

Але нещодавно було одне коригування: Кілька днів тому на сайті було ввімкнено автоматичне перетворення зображень у формат WebP за допомогою плагіна EWWW Image Optimizer.І саме тоді попередні перегляди WhatsApp почали давати збої.

WebP та швидкість сайту: палиця з двома кінцями

На перший погляд, WebP виглядає як розумне рішення. Він пропонує менші розміри файлів та швидше завантаження. Google це любить. PageSpeed Insights дає вашому сайту кращі оцінки. Існує спокуса впровадити його повсюдно.

Але ось у чому проблема: WebP не повністю підтримується всіма платформами, особливо WhatsApp.

WebP був створений Google для заміни старіших форматів, таких як JPEG та PNG. Більшість сучасних браузерів підтримують його. Але коли справа доходить до WhatsApp, все руйнується, особливо коли WebP використовується в og:зображення тег, який забезпечує відображення картки попереднього перегляду під час поширення посилання.

Чому WhatsApp не відображає зображення WebP

Система попереднього перегляду WhatsApp ненадійно підтримує WebP ні на Android, ні на iOS. Якщо на вашій сторінці використовується WebP як основне зображення в тегу OG, WhatsApp часто не відображатиме його. Натомість може відображатися лише текст. Або взагалі нічого.

Ось що зазвичай відбувається:

• Ваш плагін оптимізації (наприклад, EWWW, Imagify або LiteSpeed) автоматично генерує зображення WebP.

• Ваш сервер використовує узгодження контенту для обслуговування WebP більшості користувацьких агентів.

• WhatsApp видаляє посилання, отримує зображення WebP і не може його відобразити.

• Попередній перегляд переривається — немає зображення, немає взаємодії.

І стає гірше. WhatsApp кешує попередній перегляд з першої спроби. Якщо зображення не завантажується жодного разу, цей порожній стан може зберігатися протягом кількох днів — навіть після того, як ви виправите проблему на своєму сайті. На відміну від Facebook, WhatsApp не має інструменту для ручного оновлення попереднього перегляду посилань.

Поширені помилки під час діагностики проблеми

Власники веб-сайтів та розробники часто витрачають години на налагодження неправильних елементів. Вони тестують OG-теги. Вони змінюють описи, оновлюють розміри зображень, додають MIME-типи. Вони навіть можуть вважати, що сайт зламаний або внесений до чорного списку.

Але нічого з цього не допоможе, якщо WhatsApp отримає зображення WebP, яке не зможе обробити.

Проблема не у ваших тегах, а у форматі.

Як це виправити (і уникнути)

Щоб запобігти цій проблемі та забезпечити правильне відображення попередніх переглядів WhatsApp:

• використання JPEG або PNG для og:зображення, а не WebP.

• Переконайтеся, що URL-адреса зображення закінчується на .jpg або .png — жодних перенаправлень або динамічного узгодження контенту.

• Налаштуйте свій сервер або CDN для не обслуговувати WebP для пошукових роботів у соціальних мережах.

• Уникайте плагінів, які автоматично перезаписують оригінальні зображення у WebP.

• Не покладайтеся на JavaScript або відкладене завантаження — WhatsApp аналізує лише необроблений HTML.

• Тестуйте свої посилання у WhatsApp перед запуском великих кампаній або контенту.

Також зверніть увагу на Поведінка CDNТакі сервіси, як Cloudflare або BunnyCDN, можуть автоматично конвертувати зображення у WebP. Навіть якщо ваш тег OG вказує на .jpg, CDN може замість цього обслуговувати WebP. Завжди перевіряйте заголовки HTTP-відповідей — якщо ви бачите тип контенту: зображення/webpWhatsApp може порушити роботу попереднього перегляду.

WebP чудовий, але не для платформ обміну повідомленнями

WebP справді корисний для оптимізації внутрішньої продуктивності. Він швидкий, ефективний та ідеально підходить для рендерингу в браузері. Але коли ваш контент залежить від зовнішнього обміну, особливо через такі платформи, як WhatsApp, це стає ризикованим вибором.

Доки WhatsApp не оновить свій механізм рендерингу, найбезпечнішим та найнадійнішим рішенням є використання JPEG або PNG для всіх зображень Open Graph.

Заключні думки від розробника WordPress

Я створюю вебсайти на WordPress майже десять років. Разом з моєю командою ми не просто створюємо сайти — ми допомагаємо бізнесу розвиватися завдяки:

• SEO-оптимізація

• Реклама Google та реклама у Facebook

• Налаштування каналу YouTube

• Присутність Карт Google

• Оптимізація швидкості

Одна з найважливіших областей, на якій ми зосереджуємося, це покращення швидкості роботи веб-сайту, особливо згідно з Google PageSpeed Insights. Чому? Тому що сайт, що швидко завантажується, призводить до більшої довіри, більшої кількості конверсій, нижчої вартості реклами та кращого рейтингу в Google.

Але оптимізація завжди залежить від балансу. Надмірне прагнення до одного напрямку, як-от повсюдне впровадження WebP, може зашкодити вашій видимості та комунікації на таких платформах, як WhatsApp.

Річ не лише в швидкості завантаження. Річ у як виглядає ваш контент коли хтось цим ділиться. І це може бути різницею між кліком та втраченою можливістю.

Про автора

Цю статтю написав Геннадій Працевич, розробник WordPress з майже 10-річним досвідом роботи в оптимізації веб-сайтів, SEO та цифровій стратегії.

Якщо у вас є питання або вам потрібна допомога з вашим веб-сайтом WordPress, будь ласка, звертайтеся зв'яжіться зі мною тут або напишіть мені безпосередньо на адресу info@speedwppro.com.