Разработка корпоративного сайта ЗЕКСЛЕР

Когда агентству нужно разработать сайт для очередного проекта, команда двигает текущие задачи и направляет все свои силы на него. Но как только встаёт вопрос о собственном сайте, работает классическое правило «сапожник без сапог»:) Мы решили разрушить стереотип и кардинально поменять облик корпоративного сайта ЗЕКСЛЕР.

Задача стояла не только в обновлении устаревшего сайта, но и в избавлении «мусора» на нём, смене посылов и более понятном преподнесении информации о наших услугах и работе в целом. А для этого было решено делать сайт с нуля.

МИНУТКА ПРЕДЫСТОРИИ

Команда ЗЕКСЛЕР работает с 2013 года. Естественно, у нас был сайт, который мы разработали практически в начале нашей деятельности. С годами его частично меняли, чуть правили дизайн, «причёсывали», добавляли новые типы материалов (приходилось делать в том же стиле), новый контент. Но за годы он сильно устарел. И так сложилось, что к 2023 году мы имели совершенно неактуальный сайт. Он-то конвертировал заявки, но выглядел, мягко говоря, не как хорошая визитка агентства, которое занимается разработкой сайтов:) Взяли себя в руки, дали пинка команде разработки и пошли делать новый сайт.

В рамках этого проекта мы все дружно решили:

- Определить, какие разделы и страницы переносить на новый сайт, а от каких избавиться.

- Полностью переделать UX/UI дизайн и концепцию сайта.

- Сделать его максимально понятным для пользователей.

- Добавить анимацию.

- Показать свою экспертность в диджитал сфере.

- Максимально конкретно и точно с помощью визуализации и контента показать потенциальным заказчикам, что мы делаем и как.

А теперь, обо всём поподробнее.

Расставаться со старым сайтом было, с одной стороны, жалко, а с другой – проблематично. За годы накопилось просто нереальное количество страниц с услугами, кейсами и статьями под SEO. Возникли вопросы: «Как отделить мух от котлет, то есть оставить нужное, убрать ненужное?» и ещё «Как перенести всё это добро на новый сайт красиво в новой стилистике?».

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

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

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

КОНЦЕПЦИЯ

Одним из первых наших концептов в плане дизайна был стиль русского авангарда. Мы очень уважительно относимся к истории нашей страны, к прошлому и нам это близко. Хотелось взять стилистику старых советских учебников, книг, но не просто брать и копировать стиль, а лишь вдохновиться. И, начав применять это в дизайне, мы как раз-таки ушли от каких-то узнаваемых стилистик этого направления к более простому дизайну, основой которого является чистый лист, минимализм, отсутствие лишних элементов, линий и минимум цвета. Основной фон – белый. Это белый чистый лист, на который нанесён текст с удобной читаемой типографикой. Концепция лёгкости, чтобы ничего не отвлекало, и конкретика в текстах, где всё чётко и по делу и на основе реального десятилетнего опыта.

ШРИФТ

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

НАШИ ПОСЫЛЫ

Главный посыл ЗЕКСЛЕР – комплексный подход. Мы не относим себя к дизайн-агентству или маркетинговому агентству; мы та компания, которая подходит комплексно к развитию бизнеса наших клиентов в интернете. Мы долго прорабатывали свои посылы и то, что хотим донести. И всё это старались отразить именно в контенте. То есть при разработке нового сайта был акцент не на каком-то там супер дизайне, а на донесении всех посылов о том, кто мы такие, что мы делаем, и как строим цифровую инфраструктуру в интернете для реального бизнеса. Об этом мы написали на первом экране.

Мы решили донести свой опыт, свою экспертизу, накопленную за 10 лет. Кратко отобразили основные услуги: разработка сайтов, контекстная реклама, управление репутацией и комплексное развитие бизнеса по всем направлениям.

Далее, на первом экране разместили блок с проектами. Решили показать своих клиентов (большая часть которых – это клиенты из реального бизнеса). По каждому из клиентов даём информацию по выручке или каким-то достижениям, чтобы было понятно, с какими именно заказчиками мы работаем, в каких направлениях бизнеса и какие у них объёмы.

МАКЕТ ГЛАВНОЙ СТРАНИЦЫ:

Мы приняли решение не делать стандартный общепринятый раздел с нашими работами, в которых выводятся просто визуалы и макеты. То есть мы не делаем дизайн лишь с красивыми картинками, мы подходим комплексно. Дизайн с нашей стороны – это не отдельное направление, а часть комплексной работы для клиента. Поэтому по каждому кейсу нам есть о чём рассказать: как мы это делали, какие применяли инструменты для достижения целей и т.д. Будь-то кейс по разработке или рекламе, или какому-либо ещё направлению нашей деятельности, нам есть что рассказать. Поэтому ещё даже до начала работ по разработке нашего сайта, начали оформлять кейсы в виде больших статей с описанием, в которые добавляются визуалы и макеты.

Статьи с описанием работ выводятся в блог, а также прикрепляются в раздел «Проекты и кейсы» в виде ссылок к логотипам клиентов.

В блог кроме наших работ перенесли хорошие и актуальные экспертные статьи. Огромная часть статей осталась на старом сайте. Да, именно осталась, потому что «старичка» перенесли на поддомен old (рука не поднялась, не смогли окончательно распрощаться с родным сайтом:)). А те материалы, которые не теряют актуальности и сейчас, обновили на новом.

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

Как любит говорить наш босс: «больше конкретики». Вот и старались на страницах услуг писать больше конкретики и меньше воды. Чтобы пользователи на сайте видели то, что мы на самом деле делаем и как мы это делаем. Слова (где можно) подкрепляли примерами. Максимально старались показать свой подход.

Сайт разрабатывали на нашем любимом Drupal. Эта CMS по душе и нашим разработчикам и команде контент-менеджеров.

Для скорости сайта оптимизировали код. Изображения, как полагается, перевели в формат WebP. Автоматически конвертируются в формат WebM все видео анимации без потери качества. Так как анимации на страницах много, делали короткие файлы (до 5 секунд), чтобы воспроизведение начиналось автоматически в браузере.

Сделали мобильную адаптацию. Мы её делаем ещё на этапе разработки web-версии. Ведь пользователи сейчас активно используют мобильные устройства, а значит, в этой версии всё должно быть красиво и удобно.

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

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

Были использованы различные JavaScript библиотеки для повышения юзабили сайта. Например, с помощью Toc.js реализовали удобную навигацию по страницам блога. Вместо постраничной навигации везде использовали «ленивую» загрузку контента при скроллинге страниц.

Сложно делать сайт себе самому:) С одной стороны, нет сроков и можно растягивать удовольствие, а с другой – хочется сделать супер-круто, но не бросая при этом клиентские проекты.

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

На новом сайте убрали «воду», добавили конкретные посылы и нашу позицию, и для посетителей наша работа стала более понятной.