Как адаптировать шаблон сайта под клиента за один день: порядок работы и что менять первым

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

Ниже — порядок по часам, список того, что меняется обязательно, чего лучше не трогать вовсе, и как не уехать в переделку на неделю.

Почему день — это реальный срок

Считать надо честно: день — это шесть-семь рабочих часов при условии, что тексты, фотографии и логотип уже лежат у вас в папке. Установка шаблона и импорт демо-данных занимают минут двадцать. Всё остальное время — содержимое.

Вот типичный расклад по одному лендингу услуг на семь-восемь блоков:

Срыв дня почти всегда в третьей строке. Клиент присылает четыре фотографии с телефона в тёмном кабинете и обещает остальные «на неделе» — и проект висит. Поэтому материалы запрашиваются письмом с конкретным списком до старта, а не в процессе. Как это встроить в смету по этапам, подробно разобрано в статье про оценку сроков проекта.

Что собрать с клиента до того, как откроете шаблон

Список короткий и всегда один и тот же:

• Логотип в векторе или хотя бы PNG без белого фона. Если его нет — это отдельная работа и отдельные деньги.
• Название, телефон, адрес, часы работы, мессенджеры — ровно в том виде, в каком они должны стоять на сайте.
• Список услуг с ценами. Не «сделайте как у конкурентов», а перечень.
• От восьми фотографий: помещение, люди, процесс, результат. Одна общая, одна с людьми, остальные по делу.
• Реквизиты и юридические данные для подвала и политики обработки данных.
• Три сайта, которые клиенту нравятся, — чтобы понять его ожидания по цвету и подаче.

Если чего-то нет, это фиксируется до договора. Отсутствие фотографий не отменяет срок — оно его двигает, и клиент должен это услышать заранее.

Порядок адаптации: четыре слоя

Главное правило: идти сверху вниз по влиянию на результат, а не по удобству. Менять цвета приятно, а заявки приносят тексты.

Слой 1. Тексты и структура блоков

Первое, что делается после установки, — проход по всем блокам сверху вниз с заменой текста на настоящий. Демо-текст не остаётся нигде, включая подвал и подписи кнопок.

Здесь же решается судьба лишних блоков. В шаблоне под нишу обычно семь-девять секций, а конкретному клиенту нужны шесть. Лишнее выключается, а не переделывается под другое содержание: блок отзывов не превращается в блок цен — он просто скрывается. Попытка перелепить секцию под чужой смысл — первый шаг к переделке вёрстки.

Что переписывается обязательно:

• первый экран: заголовок с конкретикой вместо «Качественные услуги в вашем городе»;
• подписи кнопок: «Записаться на приём» вместо «Подробнее»;
• блок услуг: настоящие названия и цены;
• блок «о нас»: три факта с цифрами — стаж, количество клиентов, оборудование;
• подвал: реквизиты, телефон, ссылка на политику.

Слой 2. Фотографии

Вторая по силе вещь. Шаблон с чужими стоковыми лицами читается как чужой мгновенно.

Минимум для честного результата — заменить фото первого экрана и блока «о нас». Остальное можно оставить нейтральным (интерьер, предметы, процесс), если у клиента нет своих кадров.

Технические требования, которые экономят вам вечер:

• горизонтальные кадры под широкие слоты, вертикальные — под карточки людей;
• каждое фото ужимается до 200–300 КБ, иначе сайт открывается пять секунд;
• один и тот же цветовой тон: либо все тёплые, либо все холодные, иначе страница рассыпается;
• лица сотрудников кадрируются одинаково — по грудь, глаза на одной высоте.

Если своих фотографий нет вообще, честный разговор такой: снимаем на телефон по вашему списку ракурсов либо оставляем нейтральные кадры и меняем через месяц. Второй вариант нормален, третьего (ждать полгода) не бывает.

Слой 3. Цвета, шрифты, логотип

Тут работает ограничение, а не фантазия. В хорошем шаблоне цвет задан одной-двумя переменными, и менять надо именно их, а не подкрашивать кнопки по одной.

Практическое правило: берите цвет из логотипа клиента и не изобретайте палитру. Один акцентный цвет для кнопок и активных элементов, один тёмный для текста, один светлый фон. Если логотип разноцветный — берите самый тёмный из его цветов.

Шрифты в большинстве случаев лучше не трогать вовсе: они подобраны под раскладку, и замена гарнитуры ломает высоту блоков. Исключение — когда у клиента есть брендбук с прописанным шрифтом. Тогда проверьте, что в шрифте есть кириллица: половина красивых зарубежных гарнитур её не содержит, и сайт молча уедет на запасной шрифт.

Слой 4. Вёрстка

Последний слой, и сюда лучше не заходить. Любая правка отступов, сеток и порядка колонок означает, что дальше вы сопровождаете не шаблон, а свою модификацию: обновление темы её затрёт.

Допустимые правки: скрыть блок, поменять блоки местами, убрать колонку в сетке, поменять текст кнопки. Недопустимые в рамках одного дня: переписать раскладку первого экрана, сделать свой слайдер, добавить калькулятор.

Если вы ловите себя на том, что переделываете больше половины блоков, — вы уже делаете сайт с нуля. Это другая работа и другая цена, и разбираться с ней надо на берегу, когда шаблон вообще уместен, а когда нет.

Что проверить перед сдачей

Чек-лист на двадцать минут, который закрывает большую часть возвратов от клиента:

1. Открыть сайт на телефоне и пролистать целиком. Не в режиме эмуляции браузера, а на настоящем телефоне.
2. Отправить заявку через каждую форму и убедиться, что письмо дошло и в нём есть телефон отправителя.
3. Нажать на телефон в шапке — должен начаться звонок.
4. Проверить все ссылки меню, включая мобильное.
5. Поискать по странице демо-текст: «Lorem», «Пример», «Ваш текст», название темы.
6. Проверить заголовок вкладки и описание сайта — там часто остаётся название шаблона.
7. Загрузить фавикон.
8. Проверить скорость загрузки на мобильном интернете.
9. Подключить счётчик аналитики и убедиться, что он ловит визит.
10. Поставить политику обработки персональных данных и галочку согласия в формах.

Седьмой и десятый пункты забывают чаще всего. Отсутствие политики при работающей форме — это уже не косметика, а нарушение.

Сколько за это брать

Адаптация шаблона — быстрая работа, и дешёвой она от этого не становится. Считайте по своему времени, а не по стоимости шаблона.

При шести-семи часах работы и обычной ставке фрилансера выходит вилка 25 000–45 000 ₽ за сайт «под ключ» с текстами, наполнением и настройкой форм. Отдельно называется стоимость самого шаблона — она проходит расходом и не прячется в вашу цену. Сверху идут работы, которых в дне нет: тексты с интервью, фотосъёмка, перенос со старого сайта, настройка рекламы.

Главное, чего делать не стоит, — брать за адаптацию 8 000 ₽ «потому что это же готовое». Клиент покупает работающий сайт, а не количество ваших часов. Как считать такую вилку и не уйти в минус, разобрано в статье про смету на проект.

Коротко о главном

• Порядок адаптации: тексты и структура → фотографии → цвета и шрифты → вёрстка. Вёрстку по возможности не трогать вообще.
• Все материалы собираются письмом со списком до покупки шаблона, иначе день превращается в неделю ожидания.
• Лишние блоки выключаются, а не переделываются под другой смысл.
• Цвет берётся из логотипа клиента, шрифты остаются родными, если нет брендбука.
• Перед сдачей: телефон, формы, демо-текст, фавикон, политика обработки данных.
• Если переделок больше половины — это уже сайт с нуля, и считать его надо заново.

Часто задаваемые вопросы

С чего начать

Если шаблон под нишу клиента ещё не выбран, начните с витрины магазина шаблонов Flekk: каждый шаблон нарисован под конкретную нишу с нуля, у каждого есть живое демо, которое можно показать клиенту до покупки. Лицензия прозрачная: один сайт — одна покупка, клиентские проекты разрешены.