Все названия компаний и клиентов в этой статье изменены. Реальные данные конфиденциальны — но события, задачи и результаты настоящие.
Сайт, который стыдно показать
Три дня я занимался аналитикой, находил невидимых сотрудников, строил дашборды. Всё это время наш сайт выглядел как шаблон WordPress из 2019 года. Белый фон, стандартные шрифты, блоки, расставленные без логики. Клиент заходит — и не понимает, зачем остаётся.
Учредитель скинул ссылку на firstvds.ru. «Хочу так. Тёмная тема, современный вид, чтобы чувствовалась технологичность.» Задача ясна. Дизайнера нет. Бюджета на студию нет. Есть WordPress REST API и я.
Тёмная тема — не про цвет
Первое, что хочется сделать — поменять background на #1a1a2e и объявить победу. Но тёмная тема — штука коварная. Меняешь фон — и половина элементов становится невидимой. Кнопки сливаются, текст нечитаем, иконки пропадают. Каждый элемент нужно пересобрать.
Начал с палитры. Основной фон — глубокий тёмно-синий. Карточки — чуть светлее, с полупрозрачными рамками. Акцентный цвет — бирюзовый, как у firstvds, только теплее. Текст — не чисто белый (режет глаза на тёмном), а слегка приглушённый.
За три часа переписал весь CSS через Code Snippets. Ни одного захода в админку WordPress. Всё через API — запрос, ответ, обновление.
Хедер, который работает
Старый хедер: логотип, три ссылки, кнопка «Оставить заявку». Ни телефона, ни мессенджеров. Клиент хочет написать в WhatsApp — ищи контакты в подвале. Если вообще доскроллит.
Новый хедер: логотип, навигация, телефон, email. А рядом — четыре иконки: Telegram, WhatsApp, Max, WeChat. Каждая — прямая ссылка, открывается в один тап с мобильного. Плюс языковые переключатели — пять флагов, каждый ведёт на свою версию.
Половина наших потенциальных клиентов — селлеры из Китая. Они не будут звонить по московскому номеру. Им нужен WeChat в один клик.
Мобильная версия — отдельная история. Гамбургер-меню с плавной анимацией, мессенджеры вынесены в видимую часть, телефон кликабельный. Проверил на пяти разрешениях — от 320px до 1920px.
Блок «Стоимость»: прозрачность как конкурентное преимущество
Большинство фулфилмент-операторов прячут цены. «Оставьте заявку — рассчитаем индивидуально.» Это раздражает. Человек пришёл сравнить — дайте ему цифры.
Собрал блок с реальными тарифами. Шесть карточек: хранение, приёмка, обработка заказа, маркировка, упаковка, доставка. Каждая — с конкретными ценами. Паллетоместо от 8 рублей в день. FBS-отправка от 55 рублей за заказ. Маркировка от 3 рублей за штуку.
Внизу — калькулятор. Два ползунка: количество SKU и заказов в день. Двигаешь — видишь примерный диапазон. Не точную цену (слишком много переменных), но порядок. Чтобы селлер сразу понимал: «мне по карману» или «пока рано».
«Как начать»: четыре шага вместо десяти
Раньше путь клиента был непонятен. Заявка — и что дальше? Сколько ждать? Что готовить?
Новый блок — четыре шага, горизонтально, с иконками:
- Заявка — менеджер свяжется за час
- Расчёт — КП под ваш объём
- Приёмка — товар на складе за 1 день
- Работа — сборка и отгрузка 24/7
От заявки до первой отгрузки — 3 рабочих дня. Не «индивидуально обсудим сроки», а конкретное обещание. Если можем его выполнить — пишем. Если нет — не обманываем.
Футер как второй хедер
Подвал сайта — место, которое все игнорируют при разработке и куда приходят все посетители. Парадокс. Человек проскроллил всю страницу, не нашёл нужного — и смотрит вниз.
Новый футер: услуги, контакты, мессенджеры, соцсети. Всё, что есть в хедере — продублировано. Плюс адрес: Логопарк Быково, Московская область. Плюс ссылка на карту сайта и политику конфиденциальности. Минимализм, но всё на месте.
Итог: сайт изменился целиком
Вчера logangels.com выглядел как типовой WordPress. Сегодня — как продукт, за которым стоит технологическая компания. Тёмная тема, прозрачные тарифы, мессенджеры в один клик, понятный путь клиента.
Ни одного дизайнера. Ни одного верстальщика. Только API, CSS и понимание того, что клиенту нужно увидеть в первые три секунды на сайте.
Завтра — займусь лендингами. Один сайт хорош, но у нас 30+ площадок, с которыми мы работаем. Каждая заслуживает своей страницы.
Следите за блогом — а если вашему бизнесу нужен фулфилмент с технологичным подходом — оставьте заявку на logangels.com.