Белориентир: как (не)обновить дизайн

Идея

Идея – техническая поддержка сайта турфирмы и предложение решений по оптимизации и улучшению сайта.

Задачи

Улучшение дизайна и юзабилити сайта.
Поддержание высокой работоспособности сайта.
Улучшение отображения мобильной версии сайта.
Регион: Беларусь.

Что было?

Клиент пришел к нам с интересной и непростой проблемой. Белориентир - одна из первых туристических компаний в стране, а потому очень известная. Они на рынке уже 25 лет и естественно их и их сайт отлично знают клиенты.

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

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

До начала работ с нами на сайте турфирмы Белориентир был старый дизайн, который клиенту нарисовала очень давно другая студия.

Дизайн первого экрана часто использовался нерационально и содержал множество пустых мест:

Старый дизайн

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

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

Что изменилось?

изменили шапку;
изменили слайдер;
изменили цвета;
вывели "белориентир рекомендует";
вывели "витрины туров";
поправили вывод отзывов.

Что еще?

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

Мы изменили страницу туров. Добавили туда карту с отображением маршрута и вывели фото на страницу.

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

Улучшение мобильной версии

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

Старая мобильная версия сайта

Она выглядела вот так.

Новая мобильная версия сайта

Мы сделали ее такой.

Ошибки старой версии

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

Мы это исправили

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

Увеличение скорости сайта

Десктопная версия что было

Наш seo-специалист выявил проблему, которая может быть в дальнейшем критичной для пользования сайта. Раньше сайт работал недостаточно быстро, поэтому мы предложили исправить это путем вычистки кода и скриптов.

Десктопная версия что стало

Первоначальные показатели сайта были 9% / 52% (для мобильных и РС соответственно).

Мобильная версия что было

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

Мобильная версия что стало

SEO-аудит

Мы провели SEO-аудит сайта bel-orientir.ru и, помимо уже сделанных доработок, выявили остальные проблемные моменты.

На всех страницах сайта уникализировать title.
Добавить к тем title что есть:
/Текущий title/ | Туроператор Бел-Ориентир
Настроить 301 редирект со страницы https://www.bel-orientir.ru/_club/ на https://www.bel-orientir.ru/club/
Закрыть файлы doc, docx от индексации. В индексе было много подобных url:

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

Например, после первого предложения можно в шаблон выводить характеристики отеля - расстояние до моря, услуги отеля.

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

Что в итоге?

Обновленный дизайн повысил юзабилити сайта.
Увеличенная скорость загрузки: в 5 раз для мобильной версии и в 1,5 раза для десктопной.
Удобная мобильная версия.
Рост количества заказов.
Рост прибыли.

Бел-ориентир: как (не)обновить дизайн

Идея

Задачи

Что было?

SEO-аудит

Что в итоге?