Rookee
Россия+7 (495) 960-65-87

Юзабилити-лаборатория: eye-tracking исследование туристических сайтов greenfox-travel.ru и onlinetours.ru

Россия+7 (495) 960-65-87
Шрифт:
1 12585

В апреле редакция SEOnews и компания «Ашманов и партнеры» запустили новый проект «Юзабилити-лаборатория». Суть проекта: раз в месяц специалисты «Ашманов и партнеры» выбирают один сайт и делают для него бесплатный юзабилити-аудит, результаты которого затем публикуются на SEOnews.

В сегодняшнем выпуске «Юзабилити-лаборатории» мы будем разбирать два сайта туристической тематики — greenfox-travel.ru и onlinetours.ru.

В текущий выпуск «Юзабилити-лаборатории» мы решили включить небольшое исследование с использованием компактного eye tracker TheEyeTribe для отслеживания движения глаз пользователей. В исследовании принимали участие 10 представителей из целевой аудитории (5 женщин и 5 мужчин в возрасте от 23 до 48 лет). Eye tracker имеет ряд ограничений, поэтому для тестирования пользователям предъявлялись веб-страницы в формате изображений, доступных для вертикального скроллинга. Подробнее о самом устройстве можно прочитать здесь.

«В самом разгаре сезон летних отпусков. И вы тоже подумываете об отдыхе. Друзья посоветовали сайт туристической компании, услугами которой недавно пользовались...». Так начинается вводная инструкция для пользователя в проведенном eye-tracking исследовании. Мы проанализировали по 4 страницы с каждого сайта: главную, каталог горящих туров, страницу акции и карточку отеля. В этом обзоре мы поделимся с вами результатами нашего исследования, а также продемонстрируем на живом примере отличия в восприятии страниц между мужчинами и женщинами.

Главная страница

Greenfox-travel

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

1.png
Фрагмент тепловой карты главной страницы greenfox-travel.ru

Рекомендации:

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

Onlinetours

Основной акцент главной страницы сделан на сервисе поиска туров. Кроме ручного ввода параметров также доступен выбор направления отдыха «в 1 клик». Пользователи оценили функцию как полезную с одним «но»: в блоке поиска «Названия и ценники читаются с трудом».

2.png
Сервис поиска туров на главной странице onlinetours.ru

Рекомендации:

  • Используйте контрастные фоновые подложки для текстовых элементов, например:

3.png
Продуктовые блоки на главной странице greenfox-travel.ru

Наблюдение:

R Один из пользователей отметил: «Изображения людей привлекают внимание сильнее, в частности девушки. Хотя на сайтах это редко бывает, чаще всего показывают что-то типа отеля или пляжа».

Информация к размышлению: возникает вопрос относительно целесообразности размещения информационных материалов на главной странице. По данным тепловой карты greenfox-travel.ru, большая часть пользователей переходит по ссылкам на страницы туров, не просматривая главную страницу до конца (в ее нижней области размещены статьи из блога). А на сайте onlinetours.ru главная страница вообще включает в себя только блок подбора и конкретные предложения туров. Все просто.

4.png
Информационный материал на главной странице greenfox-travel.ru

Горящие туры

Greenfox-travel

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

5.png
Карта движений глаз в каталоге «Горящие туры» greenfox-travel.ru: пользователь бегло просматривает каталог, и неактуальные сроки действия акций не попадают в фокус внимания

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

Onlinetours

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

Это наглядно подтверждает карта Burnthrough («прожигающий взгляд» пользователей на скриншотах ниже подсвечивает зоны наибольшего внимания). На первом скриншоте — главная страница: внимание сфокусировано на строке поиска и блоке подбора. Также выхвачена ссылка «Горящие туры» в «шапке».

6.png
Главная страница onlinetours.ru

На втором скриншоте — каталог горящих туров: сервис поиска уже не привлекает внимание, турист переключился на список предложений.

7.png
Каталог горящих туров onlinetours.ru

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

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

Рекомендации:

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

Когда пользователь интересуется горящим туром, то его прежде всего заботят два вопроса: когда вылет и сколько стоит тур? Стоимость на странице выделена достаточно активно и связана с целевой кнопкой перехода на страницу тура. А вот даты начала и окончания тура пользователи замечали не сразу.

Рекомендации:

  • Акцентируйте внимание аудитории на ключевой информации.

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

8.png
Каталог горящих туров onlinetours.ru

Наблюдение:

R Мужчины при планировании отдыха часто задаются вопросом «Сколько стоит?» и потому обращают внимание на эту информацию.

9.png
Каталог горящих туров onlinetours.ru: МУЖЧИНЫ

В то же время женщин больше заботит вопрос «Что же выбрать?». Как видно на скриншоте ниже, информация о цене попадает у девушек в «мертвую зону». Однако фразу «Купили новое бикини и не терпится не белоснежный пляж?» они не оставили без внимания. :)

10.png
Каталог горящих туров onlinetours.ru: ЖЕНЩИНЫ

Страница акции

Greenfox-travel

На главной странице расположен блок «Свежие горящие туры», но при переходе на страницу конкретной акции эта особенность тура никак не обозначена. Пользователь: «Я бы не понял, что тур горящий. Непонятны даты и сколько дней до вылета».

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

  • Стоимость на странице указана в формате «от...» и в двух валютах. Неочевидно, нужно ли их суммировать. Кроме того, у пользователей могут возникнуть сложности при конвертации валют. Девушка-респондент: «Для меня всегда проблема переводить доллары или евро в рубли. Обязательно ошибусь...».
  • Наличие дополнительных трат (авиаперелет, топливный сбор, входные билеты в музеи и пр.) не позволяет представить, какой будет итоговая сумма.

11.png
Страница акции greenfox-travel.ru: не указаны даты вылета и итоговая стоимость

Рекомендации:

  • Отображайте итоговую стоимость за услугу в российской валюте.

Еще одной критичной проблемой является отсутствие призыва к действию и кнопки заказа выбранной услуги. После просмотра страницы пользователь чувствует себя «брошенным» и возникает вопрос: «Что делать дальше? Куда кликать? Я зависла...».

Рекомендации:

  • На странице должна быть очевидная возможность совершить целевое действие и четкий призыв к нему («Узнать больше», «Заказать» и пр.), чтобы дать заинтересованному посетителю связаться с вами.

В процессе исследования мы еще раз убедились, что яркие сочные фотографии активно притягивают к себе внимание пользователей: «Я всегда сначала смотрю фотографии, так легче понять», «Люблю, когда много фотографий». Но фото-слайдер размещен в самом низу страницы акции и доступен только тем посетителям, которые проскролили ее до конца.

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

12.png
Страница акции greenfox-travel.ru: фото-слайдер размещен внизу страницы над «футером»

Рекомендации:

  • Разместить фото-слайдер вверху страницы, чтобы сделать его легкодоступным для аудитории. По разным исследованиям, доля визуалов среди людей колеблется от 35 до 45%. То есть примерно 1/3 аудитории оценивает и запоминает предложение по тому, как оно оформлено. Поэтому сочные и привлекательные фотографии могут стать весомым мотивирующим фактором для совершения заказа.
  • Следует реализовать на сайте возможность просмотра увеличенных версий изображений по клику.

Страницы акций greenfox-travel.ru оформлены по-разному. На некоторых из них недостаточно фото-материалов и данных о том, какие конкретно отели участвуют в акции. Пользователи искали кнопку «Подробнее» или «Узнать больше» перед тем, как перейти к заявке. Им было просто недостаточно данных, чтобы принять решение.

На примере ниже после просмотра кратких данных об условиях акции пользователь кликнул (место клика — красный кружок) по текстовому элементу «Отель 4*», ожидая перехода на карточку отеля.

13.png
Страница акции greenfox-travel.ru

Onlinetours

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

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

Пользователи положительно оценили информационный блок «А что с погодой?», но хотели бы видеть в нем не только общие данные, а актуальные данные о погоде на текущий день.

14.png
Страница акции onlinetours.ru: список преимуществ отеля недостаточно заметен

Рекомендации:

  • Сократить первый текстовый блок, чтобы привлечь внимание аудитории к описанию отеля (списку преимуществ) и поднять ближе к первому «рабочему экрану» конкретные предложения вылетов.
  • Расширить информацию про отель: разместить фотографии и указать на карте его расположение, а также создать самостоятельный компактный блок с отзывами туристов, которые побывали в этом отеле.

Карточка отеля

Greenfox-travel

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

На данный момент посетители greenfox-travel.ru вынуждены приложить усилия, чтобы оценить удаленность отеля от аэропорта и центра ближайшего города (нужно самостоятельно искать на карте). Ссылка на отзывы об отеле вынесена на виджет «Карта», так что никто из респондентов ее не заметил. Однако несколько пользователей оценили присутствие карты и отметили, что эта информация для них важна: «Обычно смотрю, что рядом и куда можно съездить» .

15.png
Виджет «Карта» на странице отеля greenfox-travel.ru

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

16.png
Нижняя область карточки отеля greenfox-travel.ru

Рекомендации:

  • Необходимо разместить на странице подробную информацию об отеле. Призыв «Узнайте более детальную информацию об инфраструктуре отеля у наших экспертов» не воодушевляет, а скорее является барьером для формирования интереса к предложению.
  • Для отзывов следует создать самостоятельный блок.
  • Пользователи отметили, что было бы полезно разделение на платные и бесплатные услуги: «Что доступно в отеле, а за что нужна доплата?». Например, как на сайте onlinetours.ru.

17.png
Страница отеля onlinetours.ru

Onlinetours

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

18.png
Страница отеля onlinetours.ru

Пользователи не сразу смогли обнаружить вкладку «Карта и фото», ожидая увидеть виджет с картой на основной вкладке отеля.

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

Рекомендации:

  • Акцентировать внимание пользователей на датах перелета и длительности отдыха, например, использовать оформление со страницы акции

19.png
Страница акции onlinetours.ru

  • Расположить блок «Услуги отеля» сразу после таблицы с предложениями перелетов. Также в верхнем блоке с краткой информацией об отеле можно поставить «якорную» ссылку на более подробную информацию об услугах отеля.
  • Стоит подумать над размещением виджета «Карта» на основной вкладке отеля.

Информация к размышлению: по данным статистики, в среднем пользователи обращают внимание на отзывы в 2 раза чаще, чем на рейтинг.

Наблюдение:

  • В отличие от женщин, мужчины обращают заметно большее внимание на рейтинг отеля и наличие Wi-Fi :)

20.png
21.png
Карточка отеля onlinetours.ru: МУЖЧИНЫ

22.png
23.png
Карточка отеля onlinetours.ru: ЖЕНЩИНЫ

И в заключение: если сравнивать длительность визитов респондентов во время исследования на протестированных страницах, то некоторое преимущество имеет сайт onlinetours.ru.

24.png
Общая длительность визита (в миллисекундах)

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

Удачи Вам!


(Нет голосов)
Читайте нас в Telegram - digital_bar

Есть о чем рассказать? Тогда присылайте свои материалы Даше Калинской


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
  • Roman Nomack
    2
    комментария
    LANG_NO
    читателей
    Roman Nomack
    больше года назад
    Еще такая тепловая карта есть www.plerdy.com/ru/heatmap/
    -
    0
    +
    Ответить
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Рейтинг Известности 2018: старт народного голосования
Михаил Р
1
комментарий
LANG_NO
читателей
Полный профиль
Михаил Р - 1. Demis 2. кокс 3. Ашманов 4. Скобеев 5. Digital Strategy
Рейтинг Известности 2018: второй этап народного голосования
Константин Сокол
3
комментария
LANG_NO
читателей
Полный профиль
Константин Сокол - Кто был ответственный за дизайн таблицы голосования? Копирайтер?
Сколько ссылок помогут продвинуть молодой сайт
Павел Андрейчук
29
комментариев
LANG_NO
читателей
Полный профиль
Павел Андрейчук - Дело в том, что вряд ли в ваших платных "качественных" кейсах найдётся хоть пару % действительно новой и полезной информации которой бы не было на общедоступных источниках.
Сайт на WordPress: за и против
Мира Смурков
1
комментарий
LANG_NO
читателей
Полный профиль
Мира Смурков - Людмила, я согласен с большинством комментаторов. Вы хоть один полноценный магазин сделали на этих движках? Woocommerce это система с супер возможностями. И к ней есть дополнительные модули, с функционалом, который вряд ли появиться на Битрикс. А самому это программировать - сотни тысяч рублей на разработку. А приведя в пример сложности с robots.txt и Sitemap вы ставите под вопрос вашу компетенцию в понимании Интернет-бизнеса и веб-разработки в целом. Во-первых это такие мелочи, а во-вторых это все делается на вордпресса за 2 минуты, и опять же с возможностями многократно превышающими Битрикс.
Кейс: вывод лендинга по изготовлению флагов на заказ в ТОП 1 по Санкт-Петербургу
utka21
5
комментариев
LANG_NO
читателей
Полный профиль
utka21 - Кейс как кейс. Для некоторых станет вполне возможно полезным. ( Для конкурентов точно) . А вот с комментариями , что то пошло не так )
Google обошел Яндекс по популярности в России в 2018 году: исследование SEO Auditor
Рамблер
1
комментарий
LANG_NO
читателей
Полный профиль
Рамблер - Вот вроде отечественный - это сказано верно.. «Я́ндекс» — российская транснациональная компания, зарегистрированная в Нидерландах. Так говорится в Википедии. И с хрена ли ОТЕЧЕСТВЕННЫЙ поисковик зарегистрирован в Европе? И где платится основная часть налогов? Ну-ууу, точно не в России. И если запахнет жаренным, то был Яндекс и нет Яндекса!
Обзор популярных CMS: плюсы и минусы
Гость
1
комментарий
LANG_NO
читателей
Полный профиль
Гость - У Битрикса техническое seo сильно страдает, чтоб оно там было нормальным придется все переделать. Безопасность у Битрикса тоже низкая, особено если надо дорабатывать функционал, как только правиться функционал у Битрикс , то уровень ее безопасности определяет тот разработчик , который этим занимается. Самые безопасные движки те, что нет в общем доступе и где нельзя ничего редактировать в коде. =)
8 методик в SEO, от которых давно пора отказаться
Евгений Сметанин
11
комментариев
LANG_NO
читателей
Полный профиль
Евгений Сметанин - Факторов вообще очень много, согласитесь, вы будете использовать максимальное их количество, особенно, если в ТОПе засели агрегаторы с сумасшедшими ПФ. В таких случаях, вхождение ключа в домен для маленького профильного сайта, сыграет свою положительную роль. Конечно же, если контент на страницах хорошего качества. У меня есть несколько успешных кейсов на эту тему. На сайте продают несколько видов товаров, а выстреливает в ТОП тот, название которого присутствует в доменном имени. Как корабль назовешь, так он и поплывет, верно?))
Инструкция: настраиваем цели Яндекс.Метрики через Google Tag Manager
Roman Gorkunenko
1
комментарий
LANG_NO
читателей
Полный профиль
Roman Gorkunenko - Здравствуйте. Подскажите, пожалуйста, можно с айпи метрики вытащить среднюю стоимость клика по утм меткам? В метрике есть такой шаблон tags_u_t_m, но он не совместим с меткой директа, у них разные префиксы.
Аудит структуры интернет-магазина мебели от «Ашманов и партнеры»
Дмитрий
9
комментариев
LANG_NO
читателей
Полный профиль
Дмитрий - Сергей, а вы допускаете, что вся ваша жизнь - seo-миф?
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
373
Комментариев
344
Комментариев
262
Комментариев
246
Комментариев
171
Комментариев
156
Комментариев
137
Комментариев
121
Комментариев
100
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
80
Комментариев
73
Комментариев
67
Комментариев
60
Комментариев
59
Комментариев
57
Комментариев
56
Комментариев
55

Отправьте отзыв!
Отправьте отзыв!