Разработка сайта на Битрикс

Анастасия /
менеджер проекта
01
О компании
Компания Сантрек уже более 11 лет занимается разработкой авторских туристических маршрутов по Кавказу, на основе которых проводит сборные, индивидуальные и корпоративные туры.
Первый сайт заказчика был разработан в 2011 году, на заре создания компании. К 2022 году он содержал в себе огромное количество интересной и полезной информации, но визуально и технически уже просто устарел.

В течение последних 11 лет компания предпринимала попытку переработать сайт – разработать новый, более привлекательный дизайн и удобный интерфейс для пользователей.

Эта попытка не была доведена до конца. Однако именно после нее остались наработки, которые мы использовали в дальнейшем, так как к очередному подходу "с нуля" компания была не готова морально и финансово.
15 000
128
12
туристов
авторских туров
южных регионов
02
Сайт проекта
sun-trek.ru
Особенности работы с проектом
03
Цель проекта: осовременить дизайн, улучшить техническую базу сайта и юзабилити.
До 1 млн ₽
6 месяцев
Конфигурация
бюджет проекта
срок разработки
лицензия 1С:Битрикс-Стандарт + индивидуальное решение
Для понимания, можем ли мы использовать наработки предыдущих подрядчиков в своей работе, первым шагом стало проведение технического аудита проекта.

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

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

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

Новые интеграции проводились только в случаях «очень надо» с нашей стороны или «очень хочу» со стороны заказчика.
Слабая техническая база проекта
Ограниченность в функционале
Устаревший и не функциональный дизайн
04
Переработан и усовершенствован дизайн проекта
4.1
Отдельная страница с подробными отзывами туристов – для каждого отзыва можно задать пол его автора, от которого зависит отображаемая на странице иконка.
4.2
4.3
Обратная связь с компанией через формы «Заказать звонок» и «Задать вопрос» – после заполнения формы на почту менеджеру приходят данные пользователя, его вопрос и ссылка на страницу, с которой форма была отправлена.
4.4
Отдельная страница горящих туров с отличным от стандартных разделов шаблоном карточек туров – в нем упор сделан на анонсное изображение тура.
4.5
Привязка карточек туров по двум критериям – тип активности и направление – с последующим выводом в разных разделах и возможностью для пользователя выбирать тур по более важному для него критерию.
4.7
Детальная и максимально подробная карточка тура, из которой туристы могут получить всю интересующую информацию.

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

Возможность формировать ссылку на оплату тура через административную часть проекта.
05
Краткий список технических изменений:
/ git

На сайте используется система управления версиями Git. С её помощью происходит "доставка" изменений на проект, а также контроль версий. Это позволяет следить за изменениями файлов проекта, а также отслеживать любое вмешательство в код проекта.
/ composer

Используется пакетный менеджер Composer. С его помощью установлены пакеты, упрощающие разработку на проекте. Также он может пригодиться в будущем для настройки тестирования работоспособности кода проекта.
/ JS, CSS

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

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

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

В логике сайта, где это возможно, использованы методы из нового ядра битрикса (D7). Новое ядро использует более простые обращения к базе данных и не содержит лишней логики. Уменьшается общее время выполнения кода.
/ grid, flex

Для расположения блоков на сайте использованы css-технологии grid и flex. Это позволяет гибко настраивать позиционирование блоков.
/ jquery

Использована библиотека jquery. Благодаря ей ускоряется разработка js-скриптов, а также сильно расширяются возможности скриптов без необходимости собственных доработок.
/ swiper

Для создания слайдеров на сайте используется js-библиотека Swiper. Она предоставляет обширные возможности для кастомной настройки вида слайдеров и работы с ними (переключение слайда с помощью перетаскивания, кнопок, нажатия по слайду и т. д).
/ svg

Где было возможно, использованы векторные svg-картинки. Они не теряют качества при изменении размера и позволяют настраивать свои стили с помощью стандартных css-стилей.
Хотите получить индивидуальное решение для вашего проекта?
Оставьте заявку, и мы свяжемся с Вами
rus