Настройка аналитики на сайт, часть 2

Цикл статей о веб-аналитике будет посвящен установке счетчиков, настройке целей и обзору отчётов систем аналитики. Во второй части мы покажем, как настроить события для Яндекс.Метрики и Google Analytics

События в Яндекс.Метрике и в Google Analytics

На каждый сайт люди попадают разными путями и с разными целями. Кто-то приходит из поиска с конкретным запросом, кто-то заходит на страницу из закладок, смотрит нужную информацию (например, расписание) и выходит. Одна из важнейших задач веб-аналитики - изучение аудитории сайта и её поведения на различных страницах. На коммерческих сайтах главная цель - продажи, заявки на звонок или другие обращения, это называется макроконверсией. Однако, существуют и микроконверсии - например, просмотр нескольких карточек товара, переход на страницу "Контакты", использование фильтров каталога и многие другие. Чтобы отличить заинтересованных клиентов от тех, кто попал случайно, можно настроить события для Яндекс.Метрики и/или Google Analytics. Тогда с помощью специальных отчётов, мы сможем ответить на многие важные вопросы, например:

• Сколько людей заходит в каталог товаров
• Сколько людей добавляет товар в корзину, но не покупает
• Из каких источников приходят самые заинтересованные посетители

Это только примеры, остальное зависит от вашей фантазии, ведь возможности создания событий практически не ограничены

Настройка событий для аналитики: поэтапное руководство

1. Определяем задачи для аналитики

   В первую очередь стоит задуматься, какие события мы хотим отслеживать. Это называется планом внедрения аналитики, и на крупных проектах его составление может стать нелегкой задачей, требующей не только сложного планирования, но и постоянной доработки. В нашем случае, мы пока ограничимся простыми событиями: Просмотр более 3 страниц сайта, нахождение на сайте более 3 минут, просмотр страницы "контакты" и заполнения формы заявки на сайт. Все события, кроме последнего являются стандартными и легко настраиваются из интерфейса сервисов аналитики.

2. Настройка простых событий в Яндекс.Метрике

   Мы считаем, что у нас уже установлены счётчики Метрики и Google Analytics на сайт. Как это сделать, можно прочитать в предыдущей статье.

   Для метрики мы настроим 2 события: посещение контактов и просмотр трех страниц сайта. Начнем с последнего.

   Заходим в интерфейс метрики, проверяем, что наш счётчик работает(рядом должна быть зеленая стрелка).

   

   Далее переходим в настройки - Цели. Нажимаем кнопку "Добавить цель". Во всплывающем окне выбираем название цели, например "Просмотр 3 страниц". Лучше выбирать понятные и простые названия, так будет легче в них разобраться позже. Из четырех закладок выбираем "количество просмотров" и ставим цифру 3 в соответствующее поле. Событие создано, нажимаем кнопку "Сохранить".

   

   Создадим событие для посещения страницы с контактами. Для этого опять нажимаем "Добавить цель" , вводим название события (я выбрал "посещение страницы "Контакты"", но можно использовать любое другое, вам понятное). В закладках выбираем "Посещение страниц". Теперь нужно сообщить событию, какую или какие страницы мы хотим отслеживать. На нашем сайте url страницы контактов www.inetmarketing.ru/contacts/, так что я выбираю в выпадающем списке "url: содержит", а в поле добавляю "contacts". нажимаем кнопку "Добавить цель" и сохраняем.

   

   теперь у нас есть две цели в списке, отслеживание которых уже может дать ответы на некоторые вопросы веб аналитики

3. Настройка простых событий в Google Analytics

   Чтобы создать события в Google Analytics, переходим в веб интерфейс сервиса и в верхнем меню выбираем вкладку "Администратор". Для работы с аналитикой рекомендуется всегда оставлять самое чистое базовое представление нетронутым, чтобы всегда можно было вернуться к исходным данным и ничего не потерять, поэтому мы создадим новое в крайней правой закладке (представление), нажав на выпадающее меню и выбрав пункт "Создать представление". Выберем ему название по вашему усмотрению и свой часовой пояс - это пригодится для точности отчётов.

   

   Начнём создавать цели. В той же вкладке, с выбранным нашим новым представлением нажимаем пункт меню "Цели". Далее нажимаем кнопку "+Цель" и попадаем в интерфейс создания. В ней предустановлены некоторые шаблоны, но можно в них не вникать и выбирать пункт "Собственная цель". Нажимаем "Продолжить". Вводим название цели (опять произвольно, но лучше чтобы было понятно), Список с идентификаторами можно не трогать, а вот тип события выбрать "Страниц/экранов за сеанс". Нажимаем кнопку "Продолжить". В подробных сведениях ставим цифру 3 в соответствующее поле. Событие готово, жмём "Сохранить".

   

   Создадим еще одно событие: нахождение более 3 минут на сайте. Точно также в основном интерфейсе целей нажимаем кнопку "+Цель", выбираем шаблон "Собственная цель", нажимаем кнопку "Продолжить" и вводим новое название. Тип события выбираем уже "Продолжительность", а в следующем окне выставляем 3 минуты. Цель создана, нажимаем "Сохранить".

   

   Последняя простая цель будет посещение страницы "Контакты", такая же, как мы делали для метрики. Создаём новую цель, опять выбираем "Собственная цель", нажимаем "Продолжить", вводим название, но тип цели указываем "Переход". В выпадающем списке выбираем "Равно" и пишем /contacts/. У вас скорее всего другой адрес, смотрите примеры в самом интерфейсе. Сохраняем событие.

   

4. Добавление события на заполнение формы для Google Analytics

   Конечно, для коммерческих сайтов более интересны продажи или заявки, поэтому событие на заполнение форм заявки для таких сайтов - обязательное условие для грамотной аналитики, особенно для анализа эффективности контекстной рекламы или других платных (контекстная реклама, тизеры, баннеры и т.д.) и условно бесплатных источников трафика (SEO, SMM, блоги и т.д.)

   Настраивать событие будем через Google Tag Manager, который мы уже установили, создали и настроили в прошлый раз. Как работает событие в GTM?

   1. Код исполняется на каждой странице и мониторит тригеры;
   2. при выполнении условий триггера, он активирует Таг (Tag);
   3. таг исполняет свой кусок кода, который в него заложен.
   

   В нашем случае мы заложим в код отправку события в счётчики аналитики и метрики, но исполнятся может и другой код. Триггером у нас послужит заполнение формы, это стандартный тип триггера в GTM и дополнительный код писать или искать будет не нужно. Также стандартным является код отправки события в Google Analytics.

   Создадим новое событие в Google Analytics для заполнения формы. Для этого идём в закладку Администратор - представление - цели, кнопка +Цель. В шаблоне выберем "Собственная цель", назовём событие понятным нам способом и выберем тип "Событие". Нажимаем "Продолжить".

   

   В интерфейсе события в поле "Категория" пишем что-то запоминающееся (я обычно пишу "events"), а в действие пишу - submitform. Можно что-то другое, но то, что можно запомнить и на латинице. Категория и действие - обязательные поля, остальные можно не заполнять. Сохраняем. У нас появилось новое событие в общем списке, можно идти в GTM.

   

   в Интерфейсе Google Tag Manager создаем триггер. Перед этим стоит убедиться, что у нас включены стандартные перемены для форм. Мы это делали в прошлый раз, но лучше проверить. Заходим на вкладку переменные и смотрим, чтобы галочки рядом с формой стояли. Также стоит добавить переменную с номером счётчика GA, это тоже было рассмотрено в прошлом посте.

   

   Переходим на вкладку с триггерами и нажимаем кнопку "New".

   

   В типе триггера выбираем "Отправка формы и отключаем зеленую галочку проверки (Check Validation). С ней по идее работать должно лучше, но на практике это пока не так. Нажимаем continue и "некоторые формы". Далее нужно выбрать с помощью выражений, какие именно формы вы имеете в виду. На сайте их может быть много, в нашем случае они все - формы заявки, но могут еще быть формы голосовалок, поиска по сайту и другие. Поэтому при верстке лучше дать всем главным формам похожие id или классы, по которым их легко отличить от других форм. На нашем сайте все формы называются form1, form2, form3 и т.д., поэтому я легко могу выделить общий признак, id всех форм содержит слово "form". Посмотрел я это через инструменты разработчика, изучив код форм.

   

   Выбираем в списке слева Form ID, если там ничего подобного нет, вы не включили переменные такого типа, выше написано, как и где это сделать. выбираем тип выражения "contains" (содержит) и вписываем слово "form". Нажимаем "Создать триггер, выбираем понятное имя ("Отправка формы", например)" и сохраняем его.

   

   Триггер создан, нужно создавать тег. Переходим в меню "Теги", нажимаем "Новый". В этом теге мы отправим событие в Google Analytics, поэтому выбираем пункт "Google Analytics", тип тега - Universal Analytics, а в поле "Идентификатор отслеживания" вставляем заготовленную переменную {{ga}}. Мы ее внедрили в прошлом посте именно для упрощения подобных задач. Тип отслеживания выбираем "Событие" и заполняем категорию и действие так, как мы делали при создании события в Google Analytics. В моем случае Категория - events, действие - formsubmit. В ярлык я добавил переменную {{Form ID}}, в основном для примера, что GTM может передать какие-то дополнительные сведения в эту функцию, например в значение можно передать стоимость товара и вывести на ее основании ценность события.

   

   Нажимаем Далее, попадаем в выбор триггера. Есть несколько стандартных триггеров, мы уже использовали "все страницы" для счётчиков, но нас интересует триггер, который мы недавно создали для наших форм. Чтобы его выбрать, нажимаем кнопку "More" (Ещё) и ставим галочку напротив нашего триггера "отправка формы". Лучше не называть триггеры и теги случайными или непонятными именами, ведь скопиться их может много, а разбираться в них хотелось бы быстро. Сохраняем тег и перед закрытием пишем ему запоминающееся имя, в моем случае это "Отправка заполнения формы в Google Analytics". Длинновато, зато сразу ясно его назначение.

   

5. Добавление Цели "Заполнение формы" в Яндекс.Метрику

   Чтобы отправить факт совершения события в систему Яндекс.Метрика, нам нужно создать пользовательское событие, так как стандарные теги GTM Метрику в себя не включают. Сначала создадим саму цель. Заходим в Метрике: настройки - Цели - Добавить цель. В типе условия выбираем "JavaScript событие". Прописываем понятное название и добавляем специальный идентификатор. Я назвал его formsubm, можно как вам удобнее, но на латинице. Нажимаем "Добавить цель".

   

   Мы создали цель для метрики. что это значит? Что при выполнении кода вида yaCounterXXXXXXXX.reachGoal('formsubm'); на страницах сайта в метрику будет отправлено событие - цель forsubm выполнена. XXXXXXXX - это код счётчика вашей метрики (Не ID цели!), а formsubm - название нашей цели, которое мы задали при создании

   Теперь нам нужно в ГТМ создать новый тег, который будет выполнять этот кусок кода по триггеру "Заполнение формы", который мы уже создали для GA. Заходим в Теги - Новый - выбираем "Пользовательский тег HTML. В основное поле HTML добавляем код:

   

   Не забудьте заменить XXXXXXXX на свой номер счётчика метрики! В выборе триггеров используем кнопку "Еще" и выбираем наш созданный триггер "Отправка формы". Сохраняем, выбираем понятное название, готово. Можно публиковать контейнер, а можно сначала протестировать

   

6. Проверка работы тегов в GTM в режиме предпросмотра

   Чтобы проверить работоспособность тегов и триггеров, запустим GTM в режиме предпросмотра. Это очень удобный режим, который работает и до публикации изменений. Для этого нажимаем стрелку вниз рядом с кнопкой "Опубликовать" и выбираем среднюю кнопку (Preview/предпросмотр)

   

   Когда GTM у нас находится в предпросмотре, просто открываем наш сайт в новой вкладке того же браузера. (работает в инкогнито). Снизу появляется специальная панель, на которой для нашей задачи вполне хватает панели по умолчанию, где пишутся все теги, выполненные на странице. Мы увидели, что у нас выполнился тег с кодом счётчика аналитики и тег с кодом счётчика Яндекс.Метрики, они выполняются просто по загрузке страницы.

   

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

   

   Как видно на скриншоте, кроме выполненных кодов счётчиков, у нас сработали теги отправки событий и в Google Analytics и в Метрику

   

   Корректность работы событий Google Analytics можно и в отчётах реального времени в самой системе.

7. Итог:

   В итоге у нас получились настроены события, определяющие заинтересованного пользователя: просмотр нескольких страниц и/или долгое нахождение на сайте. Стоит отметить, что Google Analytics не засчитает время на сайте, если пользователь не переходил по ссылкам на странице или не выполнял какие-то события и действия на странице. В этом случае система поймёт посещение как посещение с отказом. Метрика считает, что если человек пробыл хотя бы 15 секунд на сайте, то отказом считаться это посещеение не будет. Это ключевые отличия в расчёте отказов в этих системах, поэтому почти всегда отказы в метрике ниже, чем отказы в GA.

   Также мы создали событие на заполнение формы и можем отслеживать в отчётах источники, из которых приходят конверсии, что поможет посчитать окупаемость платных каналов, отдельных объявлений или постов в соцсетях. Как отслеживать различные источники с помощью UTM меток, будет рассмотрено в других постах нашего блога.