Кнопка WhatsApp на сайте: как сделать рабочую ссылку wa.me
AndySendy academy
← Все посты

💬 Кнопка WhatsApp на сайте: один клик - это не один клик

«Клиент нажимает - и сообщение уже у вас» - удобная формулировка для брифа, но не то, что происходит технически. Один клик открывает чат с готовым текстом, а отправку клиент всё равно делает сам. На мобильном это незаметная доля секунды, на десктопе - иногда целый QR-код и закрытая вкладка.

После статьи у вас будет рабочий HTML-код кнопки, понимание разницы между мобильным и десктопным сценарием и аргументы, почему клик по кнопке нельзя считать лидом в отчёте.


Ошибка → Решение

Ошибка в формулировке темы: «клиент нажимает → открывается WA с готовым сообщением → жмёт «Отправить»» подаётся как единый процесс «в один клик», а вебмастеру остаётся 5 минут работы.

Решение: технически верно «в один клик» открывается только чат с подставленным текстом. Отправка - отдельное действие пользователя внутри WhatsApp, и часть людей до него не доходит. Время интеграции при этом действительно скромное: написание и базовая стилизация HTML-кнопки занимает у вебмастера от 3 до 10 минут - здесь тема не ошибается. Формат ссылки разбираем в отдельной статье про wa.me.


Базовый HTML-код кнопки

Минимальная рабочая реализация - обычная ссылка, без скриптов и виджетов:

<a href="https://wa.me/79991234567?text=%D0%9F%D1%80%D0%B8%D0%B2%D0%B5%D1%82%21%20%D0%9F%D0%BE%D0%B4%D1%81%D0%BA%D0%B0%D0%B6%D0%B8%D1%82%D0%B5%20%D0%BF%D0%BE%20%D1%83%D1%81%D0%BB%D1%83%D0%B3%D0%B5"
   target="_blank"
   rel="noopener noreferrer">
   Написать в WhatsApp
</a>

Атрибуты target="_blank" и rel="noopener noreferrer" - не косметика. Первый открывает чат в новой вкладке, не закрывая сайт компании, второй защищает от Tabnabbing - известной уязвимости, когда открытая через target="_blank" страница может подменить содержимое исходной вкладки.

Аналоги для других каналов собираются по той же логике:

<a href="https://t.me/yourcompany">Написать в Telegram</a>
<a href="tel:+79991234567">Позвонить</a>

Что происходит после клика на самом деле

Путь пользователя состоит из нескольких отдельных шагов, а не одного действия:

  1. Клик по ссылке на сайте.
  2. Браузер передаёт управление мобильной ОС, которая открывает установленное приложение WhatsApp (deep linking).
  3. WhatsApp подставляет предзаполненный текст в поле ввода.
  4. Пользователь сам нажимает стрелочку «Отправить».

Сайт не имеет технического доступа к телефонной книге или аккаунту WhatsApp посетителя - номер и имя клиента становятся известны компании только после шага 4, когда сообщение реально дошло до её стороны. До этого момента всё происходящее - это локальные события на устройстве пользователя, которые сайт не может проверить.

Клик по кнопке - это намерение, а не обращение. После реальной отправки открывается 24-часовое окно входящего диалога - если настроена автоворонка.


Мобильные устройства против десктопа

Разница в сценарии между мобильным и десктопным трафиком - не мелкая деталь, а ключевая причина, почему «один клик» работает по-разному.

Параметр Мобильные устройства Десктоп
Что происходит после клика Прямой deep link в установленное приложение Промежуточная страница, затем WhatsApp Web или запрос QR-кода
Конверсия клика в отправку 70–85% по практическим наблюдениям Потери до 50–60% именно на этапе перехода в WhatsApp Web
Сравнение с Telegram Сопоставимо Telegram конвертирует на 40–50% выше за счёт нативного открытия десктоп-приложения без браузерных прослоек

На смартфонах приложение установлено практически у всех пользователей мессенджера, поэтому путь от клика до отправки короткий. На ПК всё иначе: если у человека не открыта веб-версия в этом браузере, сценарий разваливается - нужно сканировать QR-код, и часть аудитории на этом шаге уходит.


Мини-кейс: как десктоп-трафик обвалил конверсию

Юридическая компания запустила контекстную рекламу на лендинг, где единственным целевым действием была кнопка WhatsApp. Анализ аналитики показал аномалию: на мобильном трафике конверсия в лиды держалась на уровне 12%, а с компьютеров - меньше 1,5%. Вебвизор показал причину: пользователи ПК пугались необходимости сканировать QR-код для входа в WhatsApp Web и просто закрывали страницу.

Решение оказалось простым: вместо одной кнопки на сайт добавили блок выбора канала - звонок через tel:, Telegram и WhatsApp. Это выровняло общую конверсию сайта до 9,5%.

Десктопным посетителям нужна альтернатива, а не уговоры пройти через WhatsApp Web.


Почему клик ≠ лид: вторая ошибка из практики

Отдельная проблема - как эту разницу теряют в аналитике. Интернет-магазин настроил в Google Tag Manager цель на клик по HTML-элементу кнопки. К концу месяца отчёт показал 1000 лидов, но отдел продаж зафиксировал только 600 входящих чатов.

Причина - клик засчитывался как факт отправки, хотя это разные события. Около 40% пользователей, кликнувших на кнопку, открывали WhatsApp, но стирали предзаполненный текст или закрывали приложение, так и не нажав «Отправить» внутри самого мессенджера.

Если в отчётах фигурирует метрика «клики по WhatsApp-кнопке», стоит явно подписывать её как клики, а не как обращения или лиды - иначе отдел продаж и маркетинг будут спорить из-за разных чисел об одном и том же канале.


tel: и Telegram: похожая логика, разные ограничения

Протокол tel: на смартфонах вызывает нативное приложение «Телефон» без сюрпризов. На ПК ситуация другая: если на компьютере не настроена IP-телефония (Skype, FaceTime, корпоративная софтфонная система), клик по такой ссылке выдаёт системную ошибку «Не найдено приложение для обработки ссылки» - это стоит учитывать, если на сайте есть и tel:, и WhatsApp-кнопка для одной и той же десктопной аудитории.

Telegram в этом смысле выигрывает у WhatsApp именно на десктопе: его клиент открывается напрямую, без браузерной прослойки и авторизации, что и даёт упомянутое выше преимущество в конверсии для десктопного трафика в части практических наблюдений по СНГ и Европе.


UX-размещение и частая техническая ловушка

Для мобильных пользователей разработчики интерфейсов рекомендуют закреплённую (sticky) кнопку в правом нижнем углу экрана - это самая доступная зона для нажатия большим пальцем. Чистая HTML-ссылка в этом смысле выгоднее тяжёлых JS-виджетов: она не влияет на скорость загрузки страницы и показатели PageSpeed.

Есть и техническая ловушка, которую стоит знать заранее: если пользователь открывает сайт не из обычного браузера, а из встроенного WebView (Instagram, Facebook, Telegram), ссылка wa.me может зависнуть на белом экране - встроенные браузеры соцсетей из соображений безопасности иногда блокируют системный вызов сторонних приложений. Универсального решения, которое гарантированно работает во всех WebView, в открытых источниках не описано - это стоит проверять отдельно под конкретные сценарии трафика.


🎯 Следующий шаг

Добавьте на сайт базовую кнопку с кодом выше, разделите в аналитике клик и реальное обращение, и для десктопной аудитории покажите альтернативу - звонок или Telegram - рядом с WhatsApp.

Вывод

Практическое правило:

Один клик открывает дверь, а не заводит клиента в комнату - отправку сообщения он всё равно делает сам, и аналитика должна об этом помнить.