Сайт, который не стыдно показать клиенту: из чего он на самом деле состоит
Красивый сайт и сайт, который приносит заявки, — разные проекты. Разбираем по частям, из чего состоит второй.
Почти каждый второй запрос к нам начинается одинаково: «нужен сайт, красивый, как у вот этих ребят». Дальше выясняется, что у «вот этих ребят» три года работы над продуктом, отдел маркетинга и аналитика, а красивая обёртка — последнее, что они делали. Разбираемся, из чего складывается сайт, который приносит заявки, а не просто существует.
Сначала решение, потом макет
Дизайн начинается не в Figma, а в разговоре. Кто приходит на сайт, что человек уже знает о компании, какой у него следующий шаг — на эти вопросы должен быть ответ до первого экрана.
Если пропустить этот этап, получается типовая история: красивый лендинг с анимациями, который не отвечает ни на один вопрос клиента. Человек долистывает до конца и уходит, потому что так и не понял, сколько это стоит, с кем он будет работать и что будет, если что-то пойдёт не так.
Откройте свой сайт и попробуйте за 5 секунд ответить, что компания делает и что от вас хотят. Если не получается — проблема не в шрифтах.
Скорость важнее эффектов
Больше 70% трафика в Узбекистане — мобильный, и далеко не всегда на хорошем соединении. Это меняет приоритеты: тяжёлая 3D-сцена на первом экране красиво выглядит на демо-ноутбуке и убивает конверсию на телефоне в маршрутке.
Что реально работает:
- картинки в WebP/AVIF и адаптивные размеры вместо одного файла на 4 МБ;
- ленивая загрузка всего, что ниже первого экрана;
- шрифты с
font-display: swap, чтобы текст читался сразу, а не после загрузки гарнитуры; - критический CSS в разметке, остальное — отдельным файлом, который браузер закеширует;
- анимации на
transformиopacity— они не заставляют браузер пересчитывать всю страницу.
Ориентир простой: Largest Contentful Paint до 2,5 секунды на 4G и вес первого экрана в пределах 1 МБ. Всё, что не укладывается, должно доказать свою пользу цифрами, а не словами «так эффектнее».
Текст, который отвечает, а не украшает
Самая частая правка, которую мы вносим в чужие сайты, — выбрасываем половину слов. «Инновационные решения для вашего бизнеса» не значит ничего. «Собираем интернет-магазин за 6 недель, с интеграцией с 1С и оплатой Payme» — значит.
Хороший текст на сайте устроен как ответы на вопросы, которые человек и так задаст:
- Что вы делаете и для кого.
- Сколько это стоит хотя бы порядком — вилка лучше, чем тишина.
- Сколько времени займёт и из каких этапов состоит.
- Что будет, если результат не понравится.
- Кто конкретно будет работать над проектом.
Если на эти пять вопросов сайт не отвечает, менеджер будет отвечать на них голосом — по сто раз в неделю.
Доверие собирается из мелочей
Доверие на сайте — это не блок «нам доверяют» с серыми логотипами. Это конкретика, которую можно проверить.
Работают: кейсы с цифрами до и после, живые фото команды и офиса вместо стоков, реальные отзывы с именем и компанией, юридические реквизиты, понятная политика обработки данных. Не работают: абстрактные «10 лет на рынке» без единого примера и счётчики достижений, нарисованные в дизайне.
Один честный кейс с цифрами закрывает больше возражений, чем пять экранов с преимуществами.
Техническая база, которую не видно
Часть работы клиент никогда не увидит глазами, но именно она определяет, придут ли люди из поиска и не развалится ли сайт через полгода.
| Что | Зачем |
|---|---|
| Семантическая вёрстка, один H1, логичные H2–H3 | Поиск понимает структуру, скринридеры читают страницу |
| Уникальные title и description на каждой странице | Клик из выдачи зависит от них больше, чем от позиции |
| Canonical, sitemap.xml, robots.txt | Нет дублей, страницы индексируются предсказуемо |
| Микроразметка Schema.org | Расширенные сниппеты, организация и услуги распознаются корректно |
| Аналитика и цели с первого дня | Без данных любое улучшение — спор о вкусах |
Подробнее про то, как это устроено у нас, — на странице веб-разработки.
Что происходит после запуска
Сайт — не памятник, а инструмент. Первые два месяца после запуска дают больше информации, чем месяц обсуждений до него: видно, где люди останавливаются, какие блоки листают мимо, с каких страниц уходят.
Минимальный цикл улучшений выглядит так: собрали данные за 2–4 недели → нашли одно узкое место → изменили один элемент → сравнили конверсию. Менять всё сразу бессмысленно: потом не понять, что сработало.
Чек-лист перед запуском
- За 5 секунд понятно, что за компания и что делать дальше.
- Цена или хотя бы вилка есть на сайте.
- LCP до 2,5 с на мобильном 4G, вес первого экрана в пределах 1 МБ.
- Все картинки в WebP/AVIF, с указанными размерами и lazy-загрузкой.
- Уникальные title, description и canonical на каждой странице.
- Есть sitemap.xml, robots.txt и микроразметка.
- Подключены аналитика и цели на отправку формы.
- Формы работают с телефона и присылают заявку туда, где её увидят.
- Есть хотя бы два кейса с конкретными результатами.
Если по списку набирается меньше шести пунктов — дело не в редизайне. Дело в том, что сайт пока не доделан.
