ClickDensity – новая буква в веб-аналитике

2-го марта 2007 года я выступил с докладом на конференции по юзабилити в Санкт-Петербурге. Я рассказал о новом средстве по сбору и анализу статистики посещения веб-сайтов, а именно о heat-map. Сегодня я публикую эту статью для тех из вас, кто не смог приехать на конференцию, а также для тех, кто хочет продолжить обсуждение, начатое на конференции.

В конце статьи вы найдете презентацию моего доклада в формате SlideShare.

Раз стартап, два стартап…
В последние год-два в Интернете появилось сразу несколько стартапов, которые предлагают веб-приложения для построения heat-map по кликам:

• CrazyEgg
• ClickDensity
• ClickTale

Все эти приложения «вертяться» вокруг одной уникальной фичи, а именно:

Чем ярче цвет точки на карте, тем больше кликов по ней сделали посетители сайта.

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

Карта кликов строиться очень просто. Для этого в код отслеживаемой страницы нужно встроить обработчик кликов, который будет передавать на сервер x/y координаты клика, а также идентификатор элемента (если он есть), по которому кликнули. Например, клик передается на сервер веб-приложения ClickDensity в таком виде: http://r.clickdensity.com/Default.aspx?version=2006102401&cx=-109&cy=333
&wx=1260&wy=640&sx=0&sy=0&dt=6.219&kx=240&ky=40&cn=1&tn=&tx=35
&ty=40&siteID=103&sID=66039076&pageID=140122.
Далее, для вывода отчета, веб-приложение скачивает отслеживаемую страницу на сервер и раскрашивает страницу в зависимости от частоты кликов по следующему правилу (пример для ClickDensity):

         1

      3  3  3

   1  3  5  3  1

      3  3  3

         1

То есть точке, куда посетитель кликнул, дается 5 очков, точкам, отстоящим на 1 пиксель дается 3 очка, на два пикселя – 1 очко. Далее, красный цвет назначается точке, набравшей максимальное количество очков, синий – точке с минимальным количеством. Все остальные точки получают соответствующие цвета из заданного спектра.

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

На главной странице блога Guicci выводятся две ссылки на последние статьи. В то время, пока веб-приложение Crazy Egg собирало клики, там выводились одни заголовки, а во время вывода отчета – другие. Crazy Egg запоминает к какой ссылке относятся клики и учитывает их при построении отчета.

В ClickDensity можно вывести отчет без привязки к элементам:

На этом сайте вы можете увидеть динамчиеский блок, в котором выводятся новости. Клики для этого сайта собирались в течение двух дней и новости постоянно обновлялись (менялись позиции, какие-то новости исчезали, какие-то добавлялись). Тем не менее, веб-приложение ClickDenisty смогло “наложить” клики на новое содержимое блока.

Эти приложения позволяют оценить структурную эффективность страницы, при условии, что она не изменяется во время сбора данных. Из предыдущего рисунка видно, какие структурные элементы страницы являются наиболее популярными. Но сравнить (визуально) популярность двух новостных заголовок (стоящих рядом друг с другом) недельной давности невозможно, так как программа не сохраняет страницу каждый раз, когда та меняется – передавать новую страницу целиком на сервер невозможно из-за большого объема траффика. Но это общая проблема унифицированного решения, которую можно элегантно решить, если регистрировать и накапливать такую статистику не на «чужом», а на своем сервере, там, где физически расположен веб-сайт и база данных с динамическими элементами (новости, статьи и т.д.). Это избавит от необходимости сохранять всю страницу – зачем, если структура страницы неизменна и задается в шаблоне, а элементы страницы сохраняются в базе данных. Такое частное решение даст возможность оценивать не только эффективность структуры страницы, но и эффективность динамических сообщений, которая зависит не только от положения, например, новости, на экране, но и от ее соседства с другими новостями и информационными сообщениями (картинка, текст, баннер и т.д.). Но такое приложение еще надо написать…

И в чем кайф?
Очевидно, что карта кликов позволяет быстрее, нежели сырые табличные данные (например все того же Google Analytics) определить относительную популярность элементов страницы: кодирование частоты кликов аналоговой гаммой цветов (в ClickDensity – от синего до красного) в разы ускоряет «считывание» статистических данных и к тому же, числа сложнее сравнивать, нежели цвета в одной гаммы. А ведь мы редко когда анализируем абсолютные данные, чаще всего мы сравниваем, например, популярность двух страниц или двух кнопок.
Второе явное преимущество карты кликов в том, что она позволяет увидеть как именно посетители переходят на следующую страницу. Например, мой запрос к статистике: откуда посетители пришли на страницу регистрации. В Google Analytics я могу ответить на этот запрос:

На одной странице может быть несколько ссылок, ведущих на регистрацию, поэтому на мой уточняющий запрос – каким именно способом посетители пришли на регистрацию с конкретной страницы – Google Analytics не даст ответа (на самом деле GA может дать ответ, но для этого мне придется вставлять в каждую ссылку обработчик onclick и опять же – я получу сырые табличные данные, которые очень сложно вопринимать). По карте кликов можно моментально оценить и сравнить эффективность ссылок, ведущих на регистрацию.

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

Клики, сделанные в течение первой секунды после открытия сраницы браузере:

Клики с 1-ой по 5-ую секунды:

Помимо этих интервалов, в ClickDensity есть еще такие: 6-10, 11-20, 21-30, 33-60, < 5, < 10, < 30, < 60, > 60. Речь идет о секундах.

А в чем засада?
Имхо самый большой недостаток – это формат приложений, то есть веб2.0, который ужасно тормозит процесс вывода отчетов. Ну почему нельзя было сделать клиента в виде настольного приложения? Второй недостаток, который я уже детально описал выше – это отсутствие связи клика с динамическим содержанием сайта. Третий – нету нормальной навигации между страницами в режиме просмотра отчетов. В CrazyEgg навигации в принципе нету, а в ClickDensity она сделана в виде комбобокса с ссылками. Неужели нельзя было сделать переходы по нажатию на ссылки внутри страницы, как в отчете «Наложение данных на сайт» (site overlay) в Google Analytics?

Утопия
Clicktale в принципе и есть утопия. Он записывает в виде видео действия посетителя с мышкой:

Также хотелось бы видеть маршруты посетителя по сайту, наложенные на карту кликов. То есть хотелось бы добавить к клику еще один контекст – контекст маршрута. Тогда бы я мог получить ответ на такой вопрос: как кнопка Join Now на странице Registration proposal работает для посетителя, который пришел на страницу с главной страницы и как она работает для посетителя, пришедшего со страницы с результатов поиска людей (в социальной сети).

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

А если добавить учет клавиатурного ввода, то тогда зачем Morae?

Выводы
Веб-приложения по построению карты кликов появляются на рынке как грибы после дождя. Несмотря на бетовость вебдванольных приложений, некоторые из них уже можно использовать в работе. Это касается CrazyEgg и ClickDensity. CrazyEgg «заточен» под статические сайты, а ClickDensity прекрасно подходит и для динамических сайтов. Основная фича этих приложений – в карте кликов, на которой при помощи цветового кодирования, отмечены клики всех посетителей страницы. Эта карта кликов позволяет в разы быстрее провести анализ популярности контента страницы: чем ярче цвет точки, тем больше кликов было сделано по этой точке. В большей скорости восприятия данных, на мой взгляд, заключается основное преимущество таких веб-приложений по сравнению с числовыми статистическими пакетами (например, Googla Analytics).

Презентация

Статьи по теме:

1. Google Analytics. Часть 1: Откровение для SEO-специалиста
2. Google Analytics. Часть 2: Откровение для владельца веб-сайта
3. Google Analytics. Часть 3: Анализ поведения посетителей сайта

Выражаю огромную благодарность:

• Michael Lazell (ClickDensity) – за предоставленную возможность поэксперементировать с ClickDensity. Спасибо ему за 5,000,000 бесплатных кликов, за его оперативность в ответах на мои вопросы и за искреннее желание постоянно развивать ClickDensity.
• Кириллу Волошину (генеральный директор TUT.BY) – за согласие участвовать в эксперименте.
• Андрею Гриневичу (директор OZ.BY) – за согласие участвовать в эксперименте.

Если вам пригодилась статья (да или просто понравилась), вы можете поощрить работу автора

 Понравилась заметка? Подписывайся на обновления блога!
           

      ЖЖ  E-mail  RSS