Практическое применение инструментов тестирования веб-аналитики

В последнее время появилось большое количество инструментов для тестирования содержания сайта: Visual Website Optimizer, Optimizely, ZenTester, Google Content Experiments и т.д. Одним из самых многофункциональных инструментов на сегодняшний момент является Visual Website Optimizer (далее VWO).

Рассмотрим, какие «фишки» сервисов действительно полезны для тестирования на примере экспериментов.

Стоит отметить, что все сервисы по тестированию быстро развиваются и пополняют свою функциональность, поэтому перед повторением экспериментов советую почитать о новинках на официальной страничке создателей систем.

В данном материале речь пойдет о трех видах тестирования:

• Тестирование страниц на основе разных URL;
• Тестирование элементов сайта на нескольких страницах;
• Тестирование двух версий дизайна сайта в A/B тесте.

Тестируем страницы на основе разных URL

Задача 1: Протестировать содержание страницы, на которой представлена акция.

Дизайнер подготовил два варианта страницы по акции. Необходимо определить, какой из них лучше сработает.

Реализация эксперимента:

Для подобного тестирования подходит инструмент Google Content Experiments (бесплатный). Он позволяет проводить только тестирование на основе различных URL. Рассмотрим на примере эксперимента функции инструмента.

Шаг 1. Для реализации тестирования ставим задачу IT-поддержке ресурса: создать дополнительную страницу на сайте и разместить на ней верстку «Тестовый вариант страницы».

В итоге, от программистов вы должны получить следующие страницы:

1. Основной URL, например www.site.ru/action/, на который размещен «Основной вариант страницы». Весь трафик, попадающий на этот URL, участвует в тестировании.
2. Тестовый URL, например, www.site.ru/action1/, на котором размещен «Тестовый вариант страницы». На этот URL не нужно вести трафик с сайта и трафик с источников рекламы.

Пояснения Для того чтобы избежать негативных последствий для SEO-оптимизации, вы можете использовать атрибут ссылки rel="canonical" для всех тестовых URL, показывая, что оригинальная ссылка предпочтительна. Google рекомендует использовать rel="canonical" вместо тега noindex, поскольку это лучше отражает ваши намерения в ситуации тестирования.

Шаг 2. В интерфейсе Google Content Experiments указываем Основной URL для тестирования

(кликните для увеличения)

Рисунок 3. Начало эксперимента

и тестовые URL страницы. В нашем случае «Тестовый вариант» только один. Но в системе есть возможность протестировать одновременно более одного варианта страницы.

(кликните для увеличения)

Рисунок 4. Выбор страниц для эксперимента

Шаг 3. Выбираем цели эксперимента

Оценивать лучший результат рекомендую сразу по нескольким параметрам:

Цель 1: Конверсия в покупки для тестируемых страниц — нам важно не только количество покупок, в целом совершенное посетителями тестируемых страниц, но и сколько из них участвовали в акции. Это отслеживание можно установить в Google Analytics с помощью событий, что мы и сделали заранее. Цель «Транзакция» является основной для принятия решения о победе или проигрыше варианта.

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

Цель 2: Просмотр 2-х и более страниц — был ли совершен дополнительный целевой переход со страницы акции к товарной группе. Т.е. фактически оценить расположение и привлекательность блоков и ссылок на странице.

Цель 3: Конверсия в зависимости от сегмента посетителя. Нам важно отдельно проанализировать конверсию пользователей в зависимости от источника посетителя. В эксперименте будут участвовать пользователи, перешедшие с рассылки и те, кто перешел к акции с сайта. Обычно эти сегменты посетителей показывают разную конверсию на одной и той же целевой странице. Наша задача — увидеть эту разницу и предложить лучший вариант страницы для каждого сегмента, т.к. мы можем этим сегментам показывать разные страницы.

К сожалению, в Google Content Experiments можно задать только одну цель. Но в дальнейшем результаты эксперимента можно проанализировать с точки зрения достижения других целей вручную.

Задаем основную цель эксперимента — «Транзакция».

(кликните для увеличения)

Рисунок 5. Выбор целей эксперимента

Шаг 4. Размещение кодов эксперимента на основной странице эксперимента

Обратите внимание, что код необходимо размещать в начале основной страницы эксперимента, после открывающего тега

(кликните для увеличения)

Рисунок 6. Код для проведения эксперимента

Справка Код эксперимента обязательно должен находиться в секции . При загрузке скрипт тестирования определяет, какой вариант увидит пользователь и производит redirect пользователя на нужную страницу.

Шаг 5. Начало эксперимента, проверка работы эксперимента

Проверить, установлены ли коды на странице, поможет встроенный анализатор:

(кликните для увеличения)

Рисунок 7. Проверка кода на страницах

Но я рекомендую после запуска эксперимента убедиться, что все работает корректно. Для этого:

1. Зайдите на основную страницу эксперимента: www.site.ru/action/ и посмотрите файлы cookies. Попытайтесь несколько раз удалить файлы cookies и увидеть различные варианты страницы. Удалять файлы cookies необходимо, чтобы повторно участвовать в эксперименте.
2. Зайдите на вторую страницу эксперимента www.site.ru/action1/. Поскольку страница тестовая, на ней не должно происходить редиректов и подмены содержания.

Ход эксперимента

Если вы уже проводили эксперимент с помощью Google Content Experiments, то, скорее всего, заметили, что система не делит трафик 50/50 между страницами. Показы распределяются по принципу производительности. Это позволяет снизить риск проигрыша во время проведения эксперимента.

Пояснения После запуска эксперимента в Google Content Experiments трафик будет распределяться не пропорционально между вариантами. Принцип распределения трафика описан как Принцип Гиттинса или Multi-armed bandit problem, http://en.wikipedia.org/wiki/Multi-armed_bandit_problem http://ru.wikipedia.org/wiki/Индексы Гиттинса. Эксперты Google Analytics до сих не могут прийти к единому мнению о том, какой принцип показов лучше: 50 на 50 или основанный на взвешенной оценке показов. Скорее всего, в обновленной версии инструмента появится возможность выбора стратегии показов.

Шаг 6. Анализ результатов

Через некоторое время в интерфейсе Google Content Experiments вы увидите результаты.

(кликните для увеличения)

Рисунок 8. Анализ результатов. Вкладка «Конверсия»

Вкладка «Конверсии» — показывает результаты по выбранной вами цели. В нашем случае это «Транзакция».

Также вы можете посмотреть результаты по другим целям, обозначенным на сайте. Или сегментировать аудиторию.

(кликните для увеличения)

Рисунок 9. Анализ результатов. Вкладка «Набор целей1»

Пояснения В инструменте Content Experiments есть возможность ограничить процент пользователей, которые будут участвовать в эксперименте. Например, вы можете задать условие: «Показывать эксперимент только 50% посетителей тестируемой страницы». В инструменте нет возможности ограничить сегмент пользователей, которым будет показываться эксперимент. Например, вы не можете установить условие: «Показывать эксперимент только новым посетителям сайта». Проанализировать результаты эксперимента на сегменте посетителей сайта — возможно. С помощью стандартного инструмента «Расширенные сегменты» в Google Analytics.

Как посчитать вероятность, если цель не являлась основной?

Я рекомендую пользоваться простым инструментом подсчета статистики, созданным в Excel (скачать файл).

Выводы:

Инструмент является бесплатным и позволяет провести наиболее популярный вид тестирования — эксперимент на основе URL. Но сложные эксперименты, описанные ниже, в нем провести невозможно.

Многие помнят Google Website Optimizer. В 2012 году инструмент был интегрирован в Google Analytics и стал назваться Content Experiments. К сожалению, сделав шаг вперед в интеграции, Google совершил два шага назад по функциональности Google Website Optimizer. Вы теперь не можете:

• проводить мультивариантное тестирование (тестирование одного или нескольких элементов на нескольких страницах одновременно);
• выбирать и задавать процентное распределение трафика между вариантами.

К тому же исчезла «гибкость» инструмента. Но мы уверены, что инженеры Google не оставят рекомендации и предложения по функциональности без внимания и мы в скором времени сможем пользоваться улучшенным и многофункциональным продуктом.

Рассмотрим вторую задачу по тестированию, которую пока невозможно решить с помощью Google Content Experiments. Одновременно исследуем платный инструмент Visual Website Optimizer и его специфику.

Тестируем повторяющиеся элементы сайта на нескольких страницах (элементы шапки, навигацию и т.д.)

Вводная информация по эксперименту: Анализ аудитории и покупок на сайте выявил конверсионный раздел. Условно назовем его «Пазлы». Товары из раздела хорошо продаются, но в раздел приходит малое количество посетителей с сайта, т.к. навигация к нему затруднена. Решено было пересмотреть навигацию к разделу.

Рисунок 10. Пример навигации на сайте

Задача 2: Необходимо протестировать другое расположение категории в меню навигации на сайте. Для того чтобы показать возможности инструмента тестирования, проведем эксперимент на ограниченной аудитории — постоянных покупателях интернет-магазина.

Пояснения В этом эксперименте нет определенной основной страницы для эксперимента. Изменения происходят на всех страницах сайта в навигации. Поэтому инструмент Google Content Experiments не подходит. Описанный ниже тип эксперимента можно выбрать, если вы проводите тестирование: цвета кнопки «Купить» на всех карточках товара; расположения телефона в шапке сайта и т.п.

Цели эксперимента:

Для эксперимента были выбраны следующие цели, отслеживание которых уже настроено в Google Analytics:

1. Повышение продаж товаров из раздела «Пазлы» на аудитории постоянных покупателей. С учетом стоимости товаров в разделе, эксперимент может повысить средний чек магазина и увеличить количество купленных товаров в корзине покупателей. Все эти метрики необходимо будет проанализировать в конце эксперимента.
2. Клик по ссылке в навигации. Нам важно понимать увеличилось ли количество переходов в раздел из навигации сайта. Эту микроконверсию тоже необходимо считать.

Пояснения Если цели, обозначенные выше, не настроены в Google Analytics, то вы можете настроить отслеживание целей в инструменте тестирования. Большинство инструментов тестирования позволяет экспортировать данные в Google Analytics. За счет этого всю аналитику тестирования вы можете проводить в его интерфейсе. Подробнее о выборе инструмента для анализа конверсий читайте в статье «Visual Website Optimizer в действии», которая готовится мною к публикации в конце марта 2013. Далее я часто буду ссылаться на материалы будущей статьи.

Шаг 1. Для реализации эксперимента воспользуемся Visual Website Optimizer — платным инструментом по тестированию содержания. Выбираем A/B тест. Подробнее о выборе типов тестирования читайте в статье «Visual Website Optimizer в действии».

Шаг 2. Первый шаг. Задаем стартовый URL

(кликните для увеличения)

Рисунок 11. Указываем стартовый URL

Т.к. наш эксперимент не зависит от URL, и фактически будет проходить на всем сайте — вводим главную страницу сайта. В дальнейшем система дает возможность изменить или дополнить URL.

Заполненное на данном шаге поле влияет только на то, какая страница будет показана на следующем шаге.

Шаг 3.С помощью встроенного в систему визуального редактора вносим необходимые изменения в навигацию сайта. Подробнее об ограничениях и работе визуального редактора VWO читайте в статье «Visual Website Optimizer в действии»

(кликните для увеличения)

Рисунок 12. Интерфейс визуального редактора

Шаг 4. Переходим к настройке целей эксперимента

Если вы планируете в дальнейшем анализировать результаты эксперимента с помощью VWO, вам необходимо настроить цели в интерфейсе.

(кликните для увеличения)

Рисунок 13. Настройка целей

В инструменте есть возможность задать несколько целей одновременно. Победитель будет определяться по каждой цели в отдельности.

В нашем же эксперименте вся аналитика будет проводиться в Google Analytics, т.к. там заранее были настроены цели. В интерфейсе VWO мы указываем незначимую для нас цель: «Вовлечение», чтобы пройти на следующий этап настройки эксперимента.

Подробнее о целях и ограничениях в настройке целей читайте в статье «Visual Website Optimizer в действии»

Шаг 5. Настройка эксперимента

(кликните для увеличения)

Рисунок 14. Настройка эксперимента

• Тестируемые страницы и аудитория: информация, указанная здесь, влияет на страницы, на которых будет проходить эксперимент. Вы вносите изменения в поле, когда вы хотите, чтобы тестирование проходило на некоторых страницах или на всем вашем сайте.

Если вы хотите запустить тест на всех страницах, которые содержат, к примеру, http://example.com/products/, то вы должны указать http://example.com/products* .

Если вы хотите запустить тест на всем сайте, скажем, на http://www.example.com, то укажите в поле http://www.example.com*

Пояснения К сожалению «*» единственный оператор, который воспринимает система. Другие операторы регулярных выражений Visual Website Optimizer не воспринимает.

• Процент трафика участвующего в эксперименте: указываем 100%.

• Таргетирование на сегмент аудиторий: указываем сегмент постоянных покупателей магазина. В нашем случае, постоянные покупатели имеют cookies esky_LOGIN

(кликните для увеличения)

Рисунок 15. Эксперимент проводится на постоянных покупателях

Для сегментирования есть большое количество условий. Подробнее о них читайте в статье «Visual Website Optimizer в действии».

Другие настройки:

• Карта кликов: полезная настройка, которая включена по умолчанию. Вы можете построить карту кликов как по тестовой странице, так и увидеть комбинированную карту по группе страниц. Это позволяет провести полноценный анализ эффективности страниц с точки зрения карты кликов.

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

• Интеграция с Google Analytics: интеграция осуществляется с помощью пользовательской переменной (уровень посетителя). Посетителю, который видит один из вариантов страницы, присваивается соответствующая пользовательская переменная на уровне пользователя. В интерфейсе вы указываете слот пользовательской переменной (всего их 5).

(кликните для увеличения)

Рисунок 16. Интеграция с GA

В Google Analytics мы видим данные в параметре «Моя переменная (значение 5)»

(кликните для увеличения)

Рисунок 17. Анализ результатов эксперимента в Google Analytics

• Автоматическое отключение неэффективного варианта: не включаем, т.к. анализировать результаты будем в интерфейсе Google Analytics.

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

• Временной таргетинг эксперимента: используйте этот параметр для автоматического запуска или приостановки испытаний на конкретные даты. Задавайте дату или число, к которому/после которого вы хотите начать эксперимент. В нашем случае, этот параметр не указываем.
• Процентное распределение показов: по умолчанию установлено 50 на 50. Не меняем этот показатель для нашего эксперимента.

Шаг 6. IT-отделу (программистам сайта) ставим задачу по размещению кода Visual Website Optimizer на всех страницах сайта. Код размещается один раз, и позволяет проводить все типы экспериментов без повторного размещения кодов и повторного привлечения IT.

Шаг 7. Начало эксперимента

Перед началом эксперимента система позволяет посмотреть, как будет выглядеть тест в режиме предварительного просмотра. Также можно сгенерировать ссылку эксперимента, по которой можно увидеть работу теста. Автоматически строятся скриншоты по экспериментальным и исходным вариантам.

Шаг 8. Анализ результатов

Анализ эксперимента мы проводим в интерфейсе GA. Это очень удобно, т.к. вся аналитика по проекту уже настроена в Google Analytics, и мы можем использовать «Расширенные сегменты».

Выводы:

Основным достоинством Visual Website Optimizer является возможность провести эксперимент с минимальным участием программистов сайта или IT-отдела заказчика, что значительно сокращает время на внедрение эксперимента.

Расширенная функциональность системы позволяет реализовать фактически любой сценарий тестирования.

Самым весомым недостатком Visual Website Optimizer является ценообразование. Вы можете получить бесплатную 30-дневную пробную версию, но помимо этого минимальная стоимость использования системы составляет около $ 50 в месяц.

Если вы владелец сайта и не проводите тестирование на постоянной основе, вам выгоднее обратиться в агентство, у которого уже куплена подписка на Visual Website Optimizer.

Тестируем две версии дизайна сайта в A/B тесте

Задача 3: Необходимо провести A/B эксперимент между новой и старой версией сайта и проанализировать улучшение целевых показателей.

Пояснение Мы не можем использовать предложенные ранее варианты тестирования, т.к. содержание сайта, как и основной URL может быть совершенно разными в двух версиях сайта.

Фактически задача тестирования сводится к разработке скрипта, который будет распределять трафик сайта 50/50 и записывать результат деления в cookies. Пользователю в зависимости от cookies будет показываться один или второй вариант сайта.

Задача анализа результатов решается с помощью Google Analytics. В каждом из вариантов сайта необходимо присвоить пользовательское значение, например:

Видят старую версию сайта: _gaq.push([’_setCustomVar’, 5, ’experiment’, ’Old version’, //вариант, который видит пользователь 1 ]);

Видят новую версию сайта: _gaq.push([’_setCustomVar’, 5, ’experiment’, ’NEW version’, //вариант, который видит пользователь 1 ]);

Задача подсчета статистически значимых результатов проводится с помощью файла Excel (скачать файл), вручную.

Привожу пример скрипта php, который делит аудиторию сайта 50/50.

//Скрипт делит аудиторию на две части для нужного landing page //Landing page $cookieName = ’experimentVariantId’; // Проверяем установлен ли уже id варианта if (isset($_COOKIE[’experimentVariantId’])) { //установлен, читаем из кук $experimentVariantId = $_COOKIE[$cookieName]; } else { $experimentVariantId = rand(1,2); } setcookie($cookieName, $experimentVariantId, (time() + (60*60*24*30*6)), «/»); switch ($experimentVariantId) { case 1: //показывает 1 вариант echo ’Вариант 1′; break; case 2: //показываем 2 вариант echo ’Вариант 2′; break; case 0: default: // ничего не показываем, возникла какая-то неопределенность echo ’Default’; break; }

Выводы:

Последний вариант реализации тестирования универсален, но требует большой нагрузки от IT-отдела, управляющего сайтом. Возможно, стоимость проведения такого тестирования, с учетом затрат на IT, будет выше, чем использование VWO.

Эксперименты и тестирование — это интересный и увлекательный процесс. Желаю всем успехов в тестировании!