t. +7 (495) 620-58-99
+7 (495) 620-58-99
Начнем знакомство?
Начнем знакомство?
/
/
A/B-тестирование сайта
Блог
4522
30.03.2017

A/B-тестирование сайта

Для разработчиков создание мобильных приложений, сайтов, программного обеспечения сопряжено с решением следующих вопросов:

  • кто является целевой аудиторией;
  • какой дизайн предпочтительнее;
  • какой контент будет интересен пользователю и т.д.

Едва ли можно говорить о непреодолимости этих проблем – в итоге они все решаются успешно. Как показывает практика, настоящие трудности возникают тогда, когда взгляд пользователя (потребителя) и владельца сайта на продукт диаметрально противоположны. Это неудивительно, ведь каждый из них преследует свою цель: владелец хочет реализовать товар на максимально выгодных условиях, а потребитель – быстро получить необходимые сведения о продукте. Достичь компромисса в сложившейся ситуации бывает непросто.

Одним из путей примирения потребителя и владельца как раз и выступает А/В-тестирование. В ходе его проведения удается определить, какая форма подачи информации импонирует пользователям, и объективно оценить прототип. Часто выходит так, что тестируемый вариант как раз и выступает наиболее эффективным (подробнее об этом ниже в статье). Нередки случаи, когда изначально скептически относящийся к различным доработкам/изменениям структуры сайта или дизайна владелец, увидев результаты тестирования, кардинально меняет свое мнение и соглашается на внесение корректировок.

А/В-тестирование сайта на примере автомобильного дилера на странице конкретной модели авто

В эксперименте участвуют две версии страницы:

  • «A» – оригинальная/исходная;
  • «B» – тестовая/новая.

Механизм A/B-тестирования следующий: 50% посетителей видят только вариант «А», остальные 50% – вариант «B».

Первый этап тестирования

Работа начинается с детального анализа сайта. На его главной странице указана сфера деятельности компании, контакты, преимущества сотрудничества и иные важные для бренда сведения, иными словами – лицо компании. Однако суть в том, что далеко не всем пользователям необходима эта информация. Прежде всего, посетителей такого портала интересует стоимость авто, его технические характеристики и комплектация, ассортимент (модельный ряд) и акции. Вот почему трафик на главную страницу на многих сайтах составляет всего 10–30% от общего количества посещений. Нужно узнать, какую из страниц пользователи посещают чаще всего. Если все же основной трафик скапливается на главной странице, то следует уделить больше внимания её анализу и оптимизации. Если же основной поток трафика сконцентрирован в другом месте, то «крючком» для пользователя может выступить страница товара/модели. Глубокая проработка карточки товара способна в разы повысить эффективность вашего портала.

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

Основные составные части первого экрана
1. Заголовок – обозначает тему и дает представление о том, что расположено на странице.
2. Изображение – формирует визуальное восприятие товара.
3. Призыв к действию.

Главная задача первого экрана – привлечь внимание пользователя и склонить его к дальнейшим действиям.

Подготовка к проведению теста

Рассмотрим вышесказанное на примере А/В-тестирования сайта автодилера. Как видно на графике, основной поток трафика сконцентрирован на страницах моделей.

А вот так выглядит первый экран страницы модели:

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

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

Макет измененного варианта представлен ниже.

Внесенные изменения должны помочь выяснить:
1. Как повлияет доступность левого меню с первого экрана на взаимодействие пользователей.
2. Чаще ли пользователи станут совершать целевые действия после размещения кнопок.

Ход тестирования

Для проведения тестирования был выбран сервис optimizely.com.

Бесплатный тарифный план сервиса включает:

  • проведение А/В-тестирования;
  • реализацию мультивариантного тестирования;
  • тестирование приложения;
  • проведение базовой сегментации (источник: мобильный/не мобильный, браузер);
  • интеграцию с GA;
  • использование визуального редактора страниц;
  • тестирование двух отдельных URL;
  • постановку событий на кнопки или привязку к событиям в GA;
  • использование комьюнити, базы знаний и Академии.

Порядок создания проекта

1. В списке проектов выбираем https://app.optimizely.com/projects/manage
2. Задаем заголовок проекта
3. Подключаем взаимодействие с GA
4. Переходим на вкладку «Integrations» в проекте:
5. Далее открываем вкладку «Settings» и копируем код, который следует вставить на сайте после открывающего тега <head>

Далее приступаем к проведению эксперимента.

Обратите внимание на то, что сервис допускает настройку фильтра пользователей.

1. Переходим в настройку аудитории
2. Создаем новую аудиторию
3. Фиксируем:
  • источник трафика;
  • тип устройства;
  • дополнительно отсеиваем страницы с параметрами (на тот случай, если контекстная реклама Яндекса принимается за поисковый трафик).
4. Настраиваем фильтр: не только на бесплатный трафик, но и отсекаем рекламный трафик по соответствующим меткам:
utm_medium=cpc
tgb
banner
utm_source содержит _calltouch

Важно! «Устройство», «Источник трафика», «Параметры запросов» следует указывать через «and also…» – логическое «И». А в рамках «Query Parameters» указываем через «or» – логическое «ИЛИ».

Ниже приведен пример настройки для десктопов:

Создание тестового варианта

Одним из преимуществ сервиса optimizely.com является возможность создания страницы заново. Кроме прочего, каждый ее элемент можно редактировать отдельно, что существенно упрощает подготовку макета для теста.

Далее происходит настройка поставленных целей и запуска теста.

Чтобы результаты тестирования были максимально точны и корректны, следует обратить внимание на:

1. Статистическую достоверность

    Она должна составлять не менее 95%. Для ее расчета можно воспользоваться калькуляторами на сервисах тестирования  https://www.optimizely.com/resources/sample-size-calculator/.

2. Сроки проведения тестирования

    Необходимо стремиться к получению 100 и более конверсий. В связи с чем преждевременная остановка теста не рекомендуется. Точность результатов напрямую связана с объемами выборки.

3. Трудности сайтов с низким трафиком
Не стоит начинать А/В-тестирование, пока сайт не обладает бурным потоком трафика и конверсиями. В таком случае эксперимент может затянуться на месяцы. Лучше провести анализ карты кликов, скроллинг и установить причину проблемы.

Также можно начать А/В-тест на схожих страницах. В данном случае на страницах моделей, для которых собственно и разрабатывался макет.

Результаты тестирования

1. Изменения в отображениях левого меню привели к тому, что взаимодействие пользователей возросло на 11,3%.
2. Добавление кнопок действий, в частности «Запись на тест-драйв», повлияло на более частую запись пользователей на тест-драйв.

Сравнение исходного и тестируемого варианта

Исходный вариант:

Тестируемый вариант:

При этом стоит указать, что ранее кнопка записи размещалась в шапке сайта. Однако количество кликов по ней увеличилось только после размещения ее в отдельном блоке.

Итоговая конверсия страницы значительно увеличилась.

Выводы и рекомендации

А/В-тестирование следует проводить на каждом из этапов создания и продвижения продукта. Оно позволяет:

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

При этом получить корректные результаты можно только при условии грамотного планирования теста и верном выборе гипотез.

Хотите создать востребованный продукт? Команда специалистов Artox Media Digital Group будет рада вам в этом помочь!