Дизайн сайта: стоимость, влияние на конверсию и когда переплата не нужна
Я много раз открывал сайты, за которые заплатили больше ста тысяч, и секунд десять искал, где записаться. Тёмный фон, фото на весь экран, шрифт с засечками — и кнопка в цвет фона в правом нижнем углу. По счёту это дизайн. По результату — нет. Разберу, за что в дизайне сайта стоит платить, сколько это стоит и как за один вечер проверить макет, не потратив ни рубля на рекламу.
Дизайн — это маршрут глаза, а не картинка
Когда заказчик говорит «хочу красивый сайт», он имеет в виду «хочу, чтобы сайт работал». А работающий сайт — это управляемый маршрут: человек открыл страницу, за пару секунд понял, что здесь продают, увидел, чего это стоит, и нашёл, куда нажать.
Наши сайты для студии массажа ДОМ ТЕЛА и интерьерного бюро KVADRATIKA начинались не с цветов, а с листа бумаги: что человек должен понять за пять секунд и какое одно действие сделать.
Дизайнер в этом смысле — регулировщик внимания
Он решает, что человек увидит первым, что вторым, а что не увидит вообще. Размер шрифта, отступы, цвет кнопки — не украшения, а приоритеты, записанные визуально.
Отсюда критерий
Хороший дизайн — тот, где путь от первого экрана до заявки короткий и очевидный. Плохой — где красиво, но глазу не за что зацепиться, а до формы три экрана прокрутки и ещё один клик. Стоимость дизайна сайта с этим критерием связана слабо: я видел дорогие макеты, которые его проваливали, и шаблоны, которые проходили.
Что реально поднимает конверсию
Контраст кнопки
Кнопка заявки должна быть самым заметным элементом экрана — не в тон фирменному стилю, а контрастной ему. Если на макете кнопку приходится искать, её будет искать и клиент, а он ищет хуже вас: он не знает, что она там есть.
Один призыв на экран
«Записаться», «Рассчитать стоимость», «Написать в Telegram», «Скачать прайс» — если всё это на первом экране, человек не выбирает ничего. Один экран — одно действие, остальные ниже.
Читаемость на телефоне
Макет нужно смотреть на телефоне, а не на мониторе дизайнера. На мониторе три колонки и серый текст на тёмном фоне выглядят благородно, на экране в шесть дюймов это каша, которую промотают.
Скорость
Тяжёлый видеофон на мобильном интернете — не дизайн, а барьер. Deloitte Digital в исследовании «Milliseconds Make Millions» для Google разобрала 30 миллионов мобильных сессий: ускорение загрузки на 0,1 секунды дало ретейлу рост конверсии на 8,4 %. Заметьте: единственная цифра в этой статье — о скорости, а не о шрифтах.
Понятный первый экран
Заголовок отвечает на вопрос «что тут и для кого», подзаголовок — «почему вам», кнопка — «что сделать». Если на первый экран ушла метафора вроде «Мы создаём пространство для вашего успеха», конверсию уже потеряли.
Что конверсию не даёт, но стоит денег
Анимации
Плавно выезжающие блоки нравятся заказчику на презентации макета. Клиент, который зашёл с рекламы узнать цену, их не замечает, а на слабом телефоне ещё и ждёт, пока они отыграют.
Уникальные иконки
Нарисованные вручную пиктограммы для «Гарантия», «Быстро», «Качество» стоят дизайнерских часов и не меняют ничего: человек читает подпись, а не картинку.
Слайдеры на первом экране
Пять баннеров по очереди — это пять первых экранов, из которых человек увидит один, случайный. Каждый слабее, чем был бы единственный.
Я не против красоты
Но сначала отлаживается маршрут до кнопки, а красота докладывается сверху, когда бюджет позволяет.
Сколько стоит дизайн сайта
Самостоятельно на Tilda
Тариф Personal — 500 ₽ в месяц при оплате за год, 750 ₽ помесячно; есть бесплатный тариф с урезанной коллекцией блоков и без своего домена. Шаблоны рисовали дизайнеры, и иерархия внимания в них в среднем лучше, чем у сайта от «племянника, который разбирается». Минус — неделя вечеров, и результат зависит от вашего вкуса.
Фрилансер на шаблоне
Тот же конструктор, но собирает человек с опытом. Это десятки тысяч рублей с большим разбросом: на цену влияет скорее репутация исполнителя, чем объём работы. Точную вилку не назову — публичных исследований с методикой я не нашёл, а прайсы агентств в блогах это реклама, а не статистика.
Индивидуальный дизайн в Figma
У студий это сотни тысяч, и здесь легко переплатить за всё, что перечислено в предыдущем разделе.
Наши цены
Лендинг — 30 000 ₽, сайт до пяти страниц — 60 000 ₽, с разработкой брендинга — 100 000 ₽, срок от трёх дней. Что входит в каждый вариант, расписано на странице сколько стоит создание сайта. В эти деньги входит то, о чём эта статья: структура, первый экран, путь до заявки, проверка на телефоне.
Главное про стоимость
Цена дизайна почти не связана с конверсией. Связь есть с другим — думал ли кто-то над маршрутом человека или сразу открыл палитру.
Когда переплачивать за дизайн не нужно
Тест гипотезы
Если вы не знаете, будут ли покупать новую услугу, сайт должен стоить как один день рекламы, а не как месяц. Шаблон, один экран, форма, бюджет на Директ — и через две недели у вас есть ответ.
Локальный бизнес с трафиком из карт и рекомендаций
Салон, автосервис, стоматология в одном районе. Человек уже знает, куда идёт, ему нужны адрес, цены, телефон и кнопка записи — это шаблон за вечер.
Мало трафика
Если на сайт заходят сто человек в месяц, разница между конверсией 2 % и 3 % — один клиент. Деньги окупятся быстрее, если вложить их в трафик, а не в макет.
Переплата оправдана, когда есть трафик и есть что терять
Сайт — основной канал заявок, чек высокий, конкуренты в той же выдаче на соседних строчках. Тогда каждый процент конверсии — деньги, и вложение в дизайн считается, а не чувствуется. Как подобрать формат сайта под размер бизнеса, я разбирал отдельно: какой сайт нужен малому бизнесу.
Как проверить дизайн до запуска: пять человек, один вопрос
Найдите пять человек не из проекта и не из вашей сферы — друзей, родственников, соседей по офису. Покажите каждому первый экран на телефоне на пять секунд и уберите. Спросите одно: что здесь продают и что нужно нажать.
Если четверо из пяти ответили правильно, первый экран работает
Если двое замялись, а один спросил «это про недвижимость?» — переделывать заголовок и кнопку, а не спорить с дизайнером про оттенок.
Затем дайте телефон и попросите оставить заявку, не помогая
Молчите и смотрите. Где человек остановился, промотал мимо формы, попытался нажать на некликабельную картинку — там дыра в маршруте.
После запуска ту же работу продолжает Яндекс Метрика
Вебвизор показывает записи реальных сессий, карта кликов — куда жмут на самом деле. Первые две недели я смотрю их каждый день. Там всегда находится что-то, чего на макете не увидел никто из нас.
Что делать завтра
Откройте свой сайт на телефоне и засеките пять секунд. Понятно, что продают? Видно кнопку? Если нет — это не повод для редизайна за двести тысяч, а повод переписать заголовок и перекрасить кнопку. Если сайта ещё нет или он совсем не тянет, посмотрите, как мы подходим к задаче: дизайн сайта у нас начинается со списка действий клиента, а не с палитры. Остальное разбираю в блоге на своих проектах — подписывайтесь, если тема близка.
Частые вопросы
Самое неудобное — тоже здесь. Лучше спросить до старта, чем после.
Сколько стоит дизайн сайта для небольшого бизнеса?
От тарифа Tilda за 500 ₽ в месяц, если собирать самому, до сотен тысяч за макет в Figma у студии. У нас лендинг — 30 000 ₽, сайт до пяти страниц — 60 000 ₽, срок от трёх дней.
Правда ли, что дизайн влияет на конверсию?
Влияет, но не тот, о котором обычно думают: контраст кнопки, один призыв на экран, читаемость на телефоне, скорость загрузки. Анимации, уникальные иконки и фирменные шрифты почти ничего не дают.
Можно ли обойтись шаблоном Tilda?
Для теста гипотезы, локального бизнеса и сайта с небольшим трафиком — да. Индивидуальный дизайн оправдан, когда сайт — основной канал заявок и каждый процент конверсии стоит денег.
Как проверить дизайн до запуска без бюджета?
Показать первый экран на телефоне пяти людям не из вашей сферы на пять секунд и спросить, что здесь продают и что нажать. Потом попросить оставить заявку и молча смотреть, где человек застрял.
Хотите обсудить проект?
Расскажите задачу — получите план и расчёт за 24 часа