Кейс по созданию и продвижению сайта Katok-komplekt.ru

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

В рамках создания сайта был выполнен комплекс работ, охватывающий аналитику, проектирование, дизайн, разработку, наполнение и запуск ресурса.

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

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

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

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

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

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

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

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

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

Технический специалист перенес сайт на хостинг заказчика и адаптировал его под протокол https. В результате сайт был полностью готов к работе.

Результаты

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

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

Стратегия

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

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

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

У компании «Комплект» очень хорошее и яркое портфолио, на которые мы смогли ориентироваться при оформлении.

Для визуального позиционирования компании в сети мы ориентировались на материалы заказчика. 

Структура

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

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

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

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

• Название и логотип компании.

• Адрес и контактные данные для связи.

• Дескрипт — словесное описание деятельности «МЫ СТРОИМ КАТКИ».

• Блок основных направлений: продукция, проекты, услуги,  информация о компании.

• Кнопка-призыв к действию «УЗНАТЬ ЦЕНУ».

• Слайд-шоу из атмосферных тематических фото.

Эти элементы позволяют посетителю мгновенно распознать назначение сайта и продолжить его изучение. 

Продукция

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

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

Карточки продукции

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

А именно:

• название;

• площадь;

• габариты;

• производитель;

• функционал для заказа.

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

Наличие активных элементов для заказа (даже при отсутствии цен в открытом доступе) — один из маркеров полезности с точки зрения поисковых систем

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

Услуги

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

Этот вариант также позволил оптимизировать страницы под узкоспециализированные запросы. Что дало в последствие профильные обращения.

Проекты

В этом разделе меню мы собрали всю информацию в виде видео материалов, благодарственных писем и других материалов, отражающих масштаб реализованных проектов. 

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

Но, что важно, это должны быть уникальные материалы с канала компании.

Буклеты

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

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

Прототипирование

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

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

Расположение элементов мы сделали максимально простым и понятным, крупные фотографии, отсутствие сложных фильтров.

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

Дизайн

Цветовая гамма была выбрана исходя из фирменных цветов компании с добавлением ярких акцентов в виде желтого и красного. Это выгодно выделяет компанию на фоне конкурентов, которые в большинстве своем использую только гамму холодных оттенков в силу тематики.

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

Цветовая гамма была выбрана в ярких тонах, которые при этом отлично гармонируют с фотографиями проектов.

В ходе обсуждения с клиентом, а также анализа целевой аудитории мы выявили основные элементы, которые были наиболее конгруэнтны для наших задач:

• острые углы;

• яркие акценты;

• прямоугольные элементы;

• плоские формы;

• пространство;

• простые шрифты;

• кнопки плоские и выделяющиеся.

  

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

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

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

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

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

  

Функциональное и удобное решение с большими фотографиями и удобной формой обратной связи.

Верстка и программирование

Мы использовали CMS WordPress так как это оптимальная система для SEO продвижения, достаточно защищенная и простая в обращении.

Упростили загрузку фотографий и работу с каталогом. Сделали отдельные страницы для категорий и карточек товаров. Добавили возможность на любой странице разместить текст и любой товар.

А также учли все технические моменты, которые помогли эффективному продвижению сайта. 

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

Продвижение сайта

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

Мы увеличили поисковый трафик пости в девять раз.

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

Существенно снизили показатель отказов и увеличили глубину просмотров и время на сайте.

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

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

Заключение

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

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

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

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

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