Суть проекта и немного о заказчике
Они предлагают услуги по финансовому аутсорсингу, консультированию и созданию специализированных обучающих материалов, которые помогают различным бизнесам лучше понимать и управлять финансами.
Компания «Нескучные Финансы» специализируется на предоставлении финансовых консалтинговых услуг, а также разработке и распространении образовательного контента в сфере финансов. Основная цель компании — создать культуру эффективного использования инструментов управленческого учета в малом и среднем бизнесе. Они предлагают услуги по финансовому аутсорсингу, консультированию и созданию специализированных обучающих материалов, которые помогают различным бизнесам лучше понимать и управлять финансами.
НФ обратились к нам с запросом на полную переработку своего старого сайта. Главными задачами были переход на российское ПО, редизайн сайта, улучшение скорости загрузки и производительности, а также создание единой целостной структуры. Нашей целью было не только технически улучшить сайт, но и значительно повысить его пользу для бизнеса клиента.
Исходная ситуация
Исторически сложилось так, что как такового "единого сайта" у компании не было. Основные данные размещались на WordPress, а дополнительные лендинги для специфических услуг и продуктов функционировали на Tilda под управлением разных отделов. Эта несогласованность заметно тормозила работу сайта, усложняя управление контентом и синхронизацию данных, ограничивая потенциал роста бизнеса.
Клиент также беспокоился о возможности введения ограничений на использование иностранного ПО. Еще одной проблемой была скорость загрузки – из-за некорректно настроенного серверного окружения и систем защиты от DDoS-атак, страницы сайта открывались долго, что негативно сказывалось на пользовательском опыте и конверсиях.
.png)
Это создавало срочную необходимость в оптимизации и повышении уровня защиты, чтобы ускорить загрузку страниц и максимизировать эффективность взаимодействия с клиентами. Для того чтобы решить все эти задачи и победить имеющиеся проблемы, «Нескучные Финансы» пришли в WEB-AiM.
Переход на российское ПО и создание единой структуры
Первым этапом нашей работы стал перенос сайта с WordPress на 1С-Битрикс, российское ПО, которое соответствует новым требованиям клиента. Мы разработали специальный скрипт, который автоматически перенес более 700 статей с WordPress на 1С-Битрикс. Этот скрипт позволил сохранить все внутренние ссылки, графику и метаданные, что значительно сократило время и затраты на ручной перенос. Важно отметить, что внутренняя статистика просмотров статей также была перенесена. Это помогло сохранить социальное доказательство популярности контента, что играет важную роль в доверии пользователей.
Аудит и доработка дизайна
Затем мы провели детальный аудит предоставленных дизайн-макетов, чтобы убедиться, что все необходимые функциональные элементы присутствуют и правильно адаптированы под различные устройства. Проведение аудита также позволило избежать ошибок на стадии верстки. Тестирование макетов на различных устройствах с разными разрешениями экранов помогло нам создать единый и удобный интерфейс, который одинаково хорошо выглядит как на десктопах, так и на мобильных устройствах.
Верстка и интеграция дизайн-макетов
Мы начали верстку с главной страницы, которая содержала максимальное количество различных элементов оформления и стилей. Это позволило создать основу для последующей работы над остальными страницами, такими как страницы контактов, раздел газеты, кейсы, страницы экспертов, информация о компании, услуги и результаты поиска. Для управления динамическим контентом мы использовали инструмент Storybook. Это дало возможность контент-менеджерам легко изменять и добавлять контент без необходимости привлечения верстальщиков.
Интеграция форм и CRM
Для улучшения взаимодействия с пользователями мы разработали удобные пресеты для форм обратной связи, которые можно легко вставлять и настраивать в нужных местах. Интеграция с AMO-CRM позволила автоматизировать процесс обработки заявок. Данные из форм автоматически передаются в CRM-систему, что позволяет быстрее и эффективнее обрабатывать запросы клиентов.
Оптимизация и аналитика
Для улучшения производительности сайта мы внедрили модуль автоматической серверной оптимизации изображений. Это значительно сократило время загрузки страниц и улучшило общий пользовательский опыт. Подключение Яндекс.Метрики и настройка целей позволили отслеживать эффективность контента и пользовательскую активность, что дало клиенту возможность получать подробные отчеты о поведении пользователей на сайте и оптимизировать контент под их нужды.
Результаты и польза для бизнеса НФ
Проект по переработке сайта «Нескучные Финансы» стал успешным благодаря комплексному подходу к решению задач. Мы не только обеспечили техническую стабильность и производительность сайта, но и значительно улучшили его пользу для бизнеса клиента. Сейчас это единое решение, работающее на стабильном и правильно настроенном хостинг-сервере с нашей поддержкой.
Для «Нескучных Финансов» сайт – один из основных инструментов для продвижения и получения заявок от клиентов. Мы сделали этот инструмент удобнее, стабильнее, быстрее, а также внедрили множество нестандартных решений, чтобы сотрудникам, работающим с сайтом, было удобнее. Поработав отдельно с конверсионными инструментами сайта, мы сделали комплексное решение более анализируемым и надежно работающим в связке с CRM-системой.
Благодаря нашему опыту и использованию современных технологий, нам удалось создать сайт, который отвечает всем требованиям клиента и способствует росту его бизнеса. Если не говорить про конкретные результаты, то рост конверсии горячего лида составил 55%, что как бы очень круто! Вот данные сравнения с данными по старому сайту:
Немного (не)скучных циферок для того, чтобы понять крутость проекта
1. Повышение стабильности, производительности и безопасности:
- Мы сделали сайт в 10 раз быстрее по статистике от Яндекс Метрики. Страницы грузятся почти мгновенно.
- Мы “загнали сайт в зеленую зону” по PageSpeed и получили 100 баллов из 100 по производительности и 100 баллов по оптимизации! Остальные показатели тоже не просели – то есть сайт, по мнению Гугла очень быстрый и отлично оптимизирован.
- Стабильный uptime – даже при существенных нагрузках, uptime 99,7%.
- Используется только российское ПО.
- Есть возможность регулярной установки обновлений безопасности в полуавтоматическом режиме.
- Вместо десяти админок – одна и удобная. Все компоненты сайта связаны как логически, так и дизайн-кодом.
- У контент-редакторов теперь есть классный и удобный инструмент создания страниц, который проще и функциональнее стандартного редактора. При этом он создан с учетом потребностей именно этого проекта.
- Для контент-редакторов создан единый набор правил и стандартов. Для НФ это дало упрощение как в контроле работы, так и при последующем найме и обучении.
- Отпала необходимость привлечения программистов для наполнения страниц сайта.
Интеграция Storybook в CMS Bitrix представляет собой значимый шаг в улучшении процессов управления контентом на веб-сайтах. Это решение приносит значительные выгоды не только для разработчиков, но и для контент-менеджеров, обеспечивая более удобную и эффективную работу с компонентами интерфейса.
Storybook — это инструмент для разработки UI-компонентов в изоляции для React, Vue, Angular и других фреймворков. В нашем случае это нельзя назвать целевым использованием инструмента, но он оказался наиболее уместным и простым для использования контент-менеджером. Также использование Storybook несет за собой последствия в виде inline стилей для элементов. Поначалу нам казалось это неуместным, так как в идеале стили должны присваиваться исключительно для какого-либо селектора, но большое кол-во селекторов будет сложно запомнить контент-менеджеру, да и невозможно предусмотреть селекторы на все случаи, поэтому мы решили оставить имеющийся функционал.
Oсновная проблема написание таких стилей вручную - это допускаемые ошибки. Контент-менеджер может ошибиться при их написании и из за этого редактор битрикса может сломать все содержимое страницы, поэтому в Storybook мы оставили необходимые для редактирования поля (цвет рамки, представленный удобной палитрой для выбора; толщина границы с значением в пикселях и т.д), которые в live режиме показывают как будет выглядеть блок. После настройки всех доступных полей контент-менеджер может просто скопировать весь предоставленный код и вставить в нужном месте.
Преимущества для контент-менеджеров:
- Простота использования готовых компонентов:
Контент-менеджерам больше не требуется писать сложный код или разбираться в технических деталях компонентов. Они могут легко выбирать нужные блоки из библиотеки Storybook и вставлять их в редактор статей Bitrix. Это значительно ускоряет процесс создания и обновления контента на сайте. - Быстрое внедрение изменений:
Используя готовые компоненты из Storybook, контент-менеджеры могут оперативно вносить изменения на сайт, минимизируя необходимость обращения к разработчикам. Это делает процесс управления контентом более гибким и отзывчивым на изменения бизнес-требований. - Консистентность дизайна:
Использование стандартных компонентов из Storybook помогает обеспечить единый стиль и консистентность дизайна в каждой статье. Это важно для создания узнаваемого и привычного визуального облика статьи. - Улучшенная коммуникация:
Storybook служит визуальной и функциональной справочной системой для контент-менеджеров, что способствует лучшему пониманию возможностей каждого компонента. Это улучшает взаимодействие и сотрудничество между различными членами команды.
3. Сохранение и улучшение SEO-позиций:
- Была решена проблема с просадкой органического трафика и потерей позиции при смене движка сайта – удалось не только сохранить трафик и позиции, но и усилить их за счет новых инструментов для внутреннего SEO.
- Новые инструменты и современные подходы позволяют маркетологам клиента получать больше пользы от нового и уже имеющегося контента.
- Надежная и стандартизированная интеграционная схема дала стабильность при работе с заявками. Ни одна заявка не будет потеряна, все заявки передаются в CRM систему, логируются и учитываются в аналитике.
- Все данные для анализа конверсий корректно собираются и используются для оптимизации (сокращения расходов) рекламных бюджетов.
- Корректно размеченные страницы и формы позволяют собирать больше данных для системы сквозной аналитики.
- Сокращено время от оставления заявки клиентом до начала работы с нею командой SALEs.
- Количество ошибок при обработке уменьшено – максимальное количество поступающих данных уже “разложено” по нужным полям в CRM.
- Стандартизация принципов разработки дала фундамент для прогнозируемого развития проекта.
- Есть возможность использовать весь штатный функционал 1С-Битрикс и расширять его за счет кастомизаций и готовых решений.
- У клиента точно не возникнет проблем с выбором команды поддержки в дальнейшем – разработчики смогут поддерживать консистентность и логичность используя документацию и заложенные и описанные в ней принципы. Для заказчика это один из аспектов его безопасности.
Заключение
Проект по переработке сайта «Нескучные Финансы» стал успешным благодаря комплексному подходу к решению задач. Мы не только обеспечили техническую стабильность и производительность сайта, но и значительно улучшили его многим важным аспектам.
На входе это был набор лендингов, а сейчас это единое решение, работающие на стабильном и правильно настроенном хостинг-сервере с нашей поддержкой.
Для Нескучных Финансов сайт – один из основных инструментов коммуникации как с существующими, так и с потенциальными клиентам. Мы сделали этот инструмент удобнее, стабильнее, быстрее, а некоторые нестандартные решения которые мы применили, облегчили работу с сайтом сотрудникам НФ удобнее и логичнее.
Благодаря нашему опыту, системному подходу, знанию и использованию современных технологий, нам удалось создать действительно классный проект, который отвечает всем требованиям клиента и, абсолютно точно, уже способствует росту его бизнеса.
Благодарность клиенту
.png)
Огромное спасибо и ребятам из НФ, которые работали с нами над этим проектом. Вы крутые, с вами было очень комфортно, даже несмотря на плотный график и дополнения к требованиям по ходу этапов.
Мы еще раз прокачались в нашем умении видеть важное для заказчика и в очередной раз отточили наши умения систематизации процессов при работе с распределенными командами.
Спасибо за ясность видения нужных результатов в будущем, умение и, главное, понимания необходимости давать обратную связь!
Нам было безумно приятно работать с командой отлично понимающей что и зачем мы все вместе делаем, к какому результату идем. С удовольствием продолжим сотрудничество!
