События для кнопок: как считать клики

Заявка — это финал воронки. До неё посетитель совершает десятки мелких действий: смотрит цену, нажимает «Позвонить», открывает калькулятор. Если эти клики не считать, вы видите только верхушку — и не понимаете, где сайт теряет людей.

01Зачем вообще считать клики по кнопкам

Клик по CTA — это сигнал намерения. Человек прочитал страницу, увидел оффер и принял решение действовать. Даже если он потом не оставил заявку, сам факт клика говорит: страница работает, оффер цепляет. Когда таких сигналов мало, проблема не в трафике, а в самом сайте.

Конкретные задачи, которые решает учёт кликов:

• понять, какая кнопка работает лучше — «Получить расчёт» или «Заказать звонок»;
• увидеть, доходит ли посетитель до второго экрана и до прайса;
• сравнить две версии лендинга в A/B-тесте по микроконверсиям, а не ждать накопления заявок;
• оптимизировать контекстную рекламу по микроцелям, когда основных конверсий мало.

02Какие кнопки имеет смысл отслеживать

Считать всё подряд — пустая трата времени: отчёты замусорятся, и важные цифры утонут в шуме. Сосредоточьтесь на CTA, которые влияют на заявку.

Обязательно

• главная кнопка в первом экране («Получить расчёт», «Заказать»);
• «Позвонить» с кликом по номеру телефона;
• «Написать в WhatsApp» / «Написать в Telegram»;
• кнопка «Открыть прайс» или «Скачать прайс».

Желательно

• повтор главной CTA в середине и в конце страницы — разные ID, чтобы понять, какое место работает;
• кнопки фильтров и переключения тарифов;
• «В корзину» и «Купить в один клик» для магазинов.

Если кнопок десятки, начните с пяти самых важных и достраивайте по мере накопления данных.

03Как технически навесить событие

Базовый способ — JS-событие на клик. Самый простой вариант: добавить атрибут data-goal к кнопке и один обработчик на весь сайт.

В HTML кнопке прописываете:

<a href="#form" class="btn" data-goal="hero_cta">Получить расчёт</a>

А в подвале сайта — один обработчик, который ловит клики и шлёт в Метрику:

document.addEventListener('click', function(e){
  var el = e.target.closest('[data-goal]');
  if(!el) return;
  if(typeof ym==='function'){ ym(XXXXXXXX, 'reachGoal', el.dataset.goal); }
});

Где XXXXXXXX — номер счётчика Метрики. Плюс подхода: одна точка контроля, новые кнопки подключаются добавлением атрибута без правки скриптов.

04Цели в Яндекс.Метрике

Чтобы события превратились в считаемые конверсии, заведите для каждой кнопки JavaScript-цель в Метрике. Имя цели должно совпадать с data-goal. Подробнее о механике целей — в материале цели в Яндекс.Метрике.

Договоритесь о понятных префиксах: cta_ для главных кнопок, phone_ для звонков, mess_ для мессенджеров, cart_ для магазинных действий. Через полгода вы не вспомните, что значит «btn4», а «cta_hero_main» прочитается с первого взгляда.

Имена событий — это словарь, на котором вы будете разговаривать с командой год. Если он понятный, разбор отчётов занимает минуты, а не часы.

05Звонки и мессенджеры — отдельный случай

Клики по tel: и mailto: ловятся тем же обработчиком, если у ссылки есть data-goal. Но клик по «Позвонить» — это ещё не звонок: половина людей закрывает диалог набора. Чтобы видеть реальные звонки, нужен коллтрекинг.

Для мессенджеров аналогично: клик по «Написать в WhatsApp» — не диалог. Полная картина появляется, когда события связаны со сквозной аналитикой и CRM: вы видите, какой клик превратился в реальную продажу.

06Типичные ошибки

• Считают всё. 50 целей превращаются в кашу: непонятно, какие важные, какие нет. Лучше пять рабочих, чем пятьдесят мёртвых.
• Не разделяют кнопки по местам. Одна цель на все «Заказать» — и вы не узнаете, какой экран продаёт, а какой нет.
• Забывают про мобильную версию. На мобайле кнопки часто другие, в разметке отдельные блоки. Если у них нет data-goal, мобильный трафик «не кликает».
• Используют ID, который меняется. CMS перегенерирует классы — событие тихо ломается. Используйте стабильный data-goal, а не CSS-селекторы.
• Не проверяют после релиза. После любой правки шаблона нужно открыть страницу, нажать кнопки и убедиться, что в Метрике в режиме реального времени цели срабатывают.

07Что делать с собранными данными

Сами по себе клики не приносят денег. Ценность появляется, когда вы используете данные для решений.

• Сравните кнопки между собой. Если «Получить расчёт» жмут в 3 раза чаще, чем «Заказать звонок», переименуйте вторую или замените на главную CTA.
• Свяжите с источником трафика. В отчётах Метрики посмотрите, какие каналы дают больше микроконверсий — это полезный сигнал для распределения бюджета.
• Постройте воронку. Цепочка «зашёл → открыл прайс → нажал CTA → отправил форму» покажет узкое место. Часто оказывается, что прайс не открывают, а не что форма плохая.
• Кормите данные рекламе. Микроконверсии можно использовать как сигналы для автостратегий Директа, особенно когда основных заявок мало.

Официальная документация по теме — Справка Яндекс.Метрики.