Создание бизнес-сайта для транспортной компании “Авторитет”

В июне 2018 года веб-студия “3840” получила новый заказ на создание сайта транспортной компании «Авторитет» из г. Бердска Новосибирской области. Компания специализировалась на грузоперевозках по России, странам СНГ и Европе. На момент обращения к нам сайта у них не было, но требовался он очень срочно, поскольку без презентации своих услуг и продвижения их в интернете компания уже не могла обойтись.

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

Задачи проекта

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

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

Спустя пару дней заказчик прислал фотографии офиса компании «Авторитет», руководства и сотрудников, автомобилей из собственного автопарка, на которых осуществляются перевозки грузов. Еще мы получили подробный прайс-лист со всеми услугами компании, данные для написания текстов в разные разделы (в том числе факты о компании, ее деятельности и услугах), график работы, перечень конкурентных преимуществ (как их видело руководство ТК “Авторитет”), схему и этапы сотрудничества, условия перевозок, список клиентов, партнеров и т.д.

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

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

Реализация цели

Первым делом было выбрано и оформлено доменное имя tkavtoritet.ru. На домен была поставлена “заглушка” - «Сайт находится в разработке». Затем руководитель проекта занялся подготовкой структуры ресурса, его разделов и категорий, основываясь на материалах заказчика и логике построения структуры у сайтов прямых конкурентов.

Главную страницу решили делать в виде лендинга. В самом верху разместилась полная контактная информация о компании «Авторитет». Ниже расположили блок с красивой картинкой и формой «Оставить заявку на перевозку груза», далее - блок с основными услугами компании, выполненный в виде двух прямоугольников с небольшим описанием. При клике на каждое описание посетитель попадал в соответствующий раздел.

Ниже шел список с дополнительными услугами ТК “Авторитет”, затем блок «О компании» с небольшим текстом, а под ним - блок «Почему мы», содержащий 10 конкурентных преимуществ компании. Еще ниже разместилась схема «Как мы работаем», состоящая из четырех этапов, а под ней - «карусель» с логотипами компаний клиентов, с которыми сотрудничает ТК «Авторитет», а также их отзывы.

В самом низу сайта расположили форму обратной связи для тех посетителей, которые хотели бы уточнить что-то или задать вопросы. Форма содержит не только стандартное поле “Связаться с нами”, но и поле «Комментарий». Еще ниже разместилась интерактивная карта Яндекс, с меткой местоположения компании «Авторитет» и ее адресом - для тех, кто захочет приехать непосредственно в офис.

Разделы основных услуг компании - «Перевозка грузов по России» и «Перевозка грузов по СНГ, международная грузоперевозка» мы также выполнили в виде небольших посадочных страниц, где постарались разместить максимально возможное количество данных об услугах, условиях, сроках и стоимости (постаравшись изложить все максимально кратко, чтобы излишне не загружать посетителя).

На странице «Тарифы» планировалось разместить полный список направлений перевозки грузов до 20 тонн (90 куб. м) и два варианта цены - с НДС и без него. Все это должно было быть представлено в виде простой и понятной таблицы. Страница «Условия перевозок» также стала небольшим, но достаточно информативным лендингом. С подготовленной структурой ознакомили заказчика и получили его полное одобрение.

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

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

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

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

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

После окончания работ над дизайном макеты отправились на согласование и утверждение к заказчику. Дизайн для всех страниц был принят без единой корректировки и мы приступили к следующему этапу работ – верстке. В качестве CMS для сайта использовали Joomla 3.8, самую свежую на тот момент версию. За 8 дней сайт был полностью сверстан и наполнен материалами. Дизайн и верстка – адаптивные.

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

Когда все работы на сайте были завершены, мы проверили его на кроссбраузерность и кроссплатформенность, перенесли с тестового домена на основной, открыли на индексацию поисковыми системами. На создание ресурса «под ключ» у нас ушло 30 дней.