Как разработать сайт без головняка?

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

Сроки тянутся месяцами, стоимость тоже увеличивается в 2-3 раза (причем, чаще это отражается на разработчиках через удешевление их рабочего часа). Люди, которые вроде бы друг друга понимали и прекрасно ладили, превращаются в 2-х боевых роботов, запрограммированных на уничтожение.

Корень всех зол кроется в знаниях. Более 99% предпринимателей и разработчиков — самоучки. Одни не имеют регламентов и правил взаимодействия с клиентами, вторые не имеют никаких регламентов работы с разработчиками и приема контента от них. Каждый мыслит в режиме: «ну я же все объяснил, что не понятного то?».

Разработчикам я не помогаю, их проблемы — это их проблемы, поэтому данная статья только для предпринимателей:) Действуя по инструкции, описанной ниже, любая разработка сайта превратится для вас почти в отдых.

Для того, чтобы все работало как часы, вам, как клиенту, нужно понимать всего 2 момента:

• Какие существуют этапы в разработке сайта.
• Что на конкретном этапе вам нужно делать, чтобы все работало правильно.

Любая разработка сайта всегда делится на следующие этапы (в том или ином виде):

1. Прототипирование сайта: подготовка всех текстов сайта, его маркетинга, черновой чертеж блоков.
2. Дизайн сайта.
3. Верстка сайта.
4. Наполнение сайта: фото, отзывы, может быть какие-то товары.Настройка работы скриптов: работа форм захвата, анимации, метрики и т.д. + финальные тесты.

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

С процессами определились, теперь давайте разбираться что делать.

Прототипирование сайта.

Его в 2022 году в любом случае делает маркетолог, у которого руки по локоть в крови от ежедневной бойни с конкурентами в подобной вашей нише. Если у вас строительная ниша, значит маркетолог, который каждый день штопает интернет магазины не подходит. Этот человек должен ежедневно работать с рекламными кампаниями (не важно в таргете или в контекстной рекламе) и постоянно изучать поведение реальных клиентов через вебвизор.

Если вам озвучили, что рисовать прототип будет дизайнер или сам разработчик, сразу забирайте деньги и уходите. Такой сайт клиентов приводить не будет. Если же все окей и прототип будет делать маркетолог, то идем дальше.

На этапе прототипирования вам нужно:

1. Ответить на все вопросы маркетолога на столько подробно, на сколько это возможно.Минимальный размер любого ответа на любой вопрос — не менее 1000 символов конкретного, сухого текста. Чем более подробно дадите ответы на вопросы, тем лучше ваш проект в итоге будет упакован.
2. Изучить анализ конкурентов, который сделает маркетолог: посмотреть просто переписывает элементы сайтов конкурентов или пытается внедрить свое мнение (если внедряет мнение, запретите) и конечно, сами посмотрите на своих конкурентов, позвоните им, разберитесь кто такие и как работают.
3. Проверить сам прототип и составить список правок.Причем список правок на данном этапе подразумевает просто список опечаток в тексте или исправление неточностей. Например, если у вас изделия из полиэтилена, а маркетолог случайно написал пластик.
4. Выбрать референсы дизайна из представленных маркетологом и получить от него полное ТЗ по наполнению сайта.

На выходе прототип должен выглядеть как сайт, который просто не раскрасили. Все тексты должны быть готовы (никаких «допишем на этапе дизайна»). Формулировки или тексты маркетолога исправлять нельзя, даже если очень хочется.

Если в форме обратного звонка написано, что вы перезвоните клиенту в течение 2-3 минут, значит исходя из анализа конкурентов маркетолог пришел к выводу, что это оптимальный вариант. Если вы перезваниваете клиенту через час или сутки — писать о таком на сайте нельзя. Текст остается без корректировки и придется подстраивать бизнес под него.

Правки обязательно пишутся одним общим сообщением и только текстом. Желательно составлять список в течение 2-3 дней и уже потом его отправлять (чтобы ничего точно не упустить).

После того, как вы утвердили прототип сайта, до момента завершения верстки ни одна буковка в нем не может быть изменена. Даже если прямо с опечатками закончили.

Дизайн сайта.

Тут процесс может поделиться на 2 этапа, если вы заказывали отрисовку мобильной версии сайта отдельно. Большинство разработчиков делает Bootstrap (табличное перестроение элементов сайта в зависимости от экрана, на котором его открывают). Тут буду писать исходя из того, что у вас оплачен сайт с Bootstrap версткой, а значит проверяется дизайн только одной версии сайта — для ПК.

Процесс проверки дизайна долгий. Потребуется 3-4 часа полного погружения в течение 4-5 дней. Нужно будет несколько дней смотреть на дизайн и записывать в блокнот все, что не устраивает. Дизайн — это одновременно и дело вкуса и определенные элементы, которые могут не нравиться, но важны для конверсии.

Адекватные разработчики делают дизайн сайта по референсу (по примеру сайта, который вам понравился), поэтому ситуация, что вам «не нравится» практически не возможна. Проверять вместе с вами может либо тот же человек, что участвовал в выборе референса, либо никто. Нарушите это правило и на этапе дизайна устроите ядерную войну своему проекту.

Близким или друзьям может не понравиться дизайн с референса, на конверсии его вкус никак не сыграет, зато ваше мнение о референсе может поменяться и захочется внести правки, которые к данному референсу не относятся.

И тут либо у вас увеличится стоимость, если разработчик бывалый, либо ваш приоритет в глазах разработчика понизится на более низкий, т.к. стоимость его рабочего часа понизится и сроки начнут растягиваться как жвачка.

На этапе дизайна вам нужно:

1. Сравнить соответствие вашего сайта референсу или нескольким референсам: совпадение шрифтов, цветов, кнопок, форматов блоков.
2. Составить список всего, что по вашему мнению не соответствует референсу или совсем вам не нравится.
3. Сравнить соответствие вашего сайта прототипу и составить полный список отличий (дизайнеры иногда могут какие-то блоки местами поменять или добавить элементы, которые не нужны для упрощения своей работы).
4. В течение 4-5 дней наполнить один общий список правок и передать его на согласование разработчику (список не может содержать предложения по смене элементов, которые были в референсе). На согласование, т.к. некоторые элементы могут быть выполнены в том или ином стиле из-за особенностей в разработке (например, если дизайн готовится для Тильды, то один экран квиза может содержать только 1 вопрос на момент написания статьи, даже если в прототипе их было два).
5. После согласования списка правок с разработчиком и утверждения конечного списка правок, вам нужно уточнить сроки, в которые эти правки будут выполнены.
6. После внесения всего утвержденного списка правок в дизайн, новый список создавать уже нельзя до момента завершения верстки. Если какие-то идеи пришли в голову, отправляйте их в отдельный список, который покажете разработчику после завершения и будьте готовы к тому, что 80% из этого списка уже никогда нельзя будет внести в сайт без доплаты.

В идеальном варианте, дизайн, который вам сдали на проверку, не должен отличаться более чем на 30% по своему составу от референса и не более 10% от прототипа. Если видите иное, то даже не занимайтесь проверкой, а просто отправляйте дизайн обратно на переделку. Если вам и второй раз сдают дизайн, который не соответствует вышеописанным правилам, то просто запрашивайте остаток средств за разработку сайта на возврат.

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

Верстка сайта.

Процесс, на котором идеальный сайт можно превратить в «тыкву». Возьмите на проверку 2-3 дня. В каждый из этих дней уделите сайту примерно по 30-40 минут. Проверьте каждый элемент на сайте и составьте список:

1. Размеры сайта. Частенько верстка бывает либо слишком мелкой, либо слишком крупной по отношению к тому, что было нарисовано в дизайне. Просто потому, что «верстак видит сайт таким»:) Взгляд верстальщика вас волновать не должен. Сайт либо выглядит таким же по размерам, как на дизайне, либо вам возвращают деньги:)
2. 2.Кнопки, которые не кнопки. Верстаки могут запросто оставить кнопку картинкой и не перевести ее кодом в разряд кнопки. Чем это закончится для вас? Снижением конверсии сайта из-за того, что кнопка будет кликаться только по тексту + начнет «мылиться» в некоторых браузерах.
3. Мыльные картинки вместо иконок. Обязательно посмотрите сайт в 3-5 популярных браузерах и обратите внимание на картинки мессенджеров и элементы, которые должны быть иконками. Да, их можно оставлять и картинками, но разработчик должен подобрать размеры так, чтобы браузеры автоматически не урезали их вес и не превращали в туман.
4. Тексты на сайте должны остаться текстами. Пробуйте выделять каждый текстовый элемент на сайте мышкой. Если выделяется не конкретный текст, а блок или экран целиком, значит нужно переделывать.

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

За 2-3 дня составьте список всего, что найдется по верстке + передайте разработчику на согласование тот список правок по дизайну (финальный), что у вас родился в голове, пока выполнялась верстка. От разработчика получите информацию по конкретным срокам на корректировку верстки + информацию о том, что можно добавить из списка правок по дизайну без доплат, переделок и растягивания сроков.

Наполнение сайта.

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

На этапе наполнения вам нужно:

1. Подготовить список всего контента, что описал в ТЗ маркетолог, в том виде и в том формате, которые как раз существует в этом самом ТЗ. Например, если описано, что папка с кейсами должна содержать не менее 5 подпапок, в которых есть не менее 8-10 фото, размером, не меньше указанного в ТЗ, то другое вам туда класть попросту нельзя.
2. Разместить весь контент в облачной папке через любой удобный сервис (Яндекс Диск, Google Drive или любой другой), проверить правильность его размещения самостоятельно (вдруг ссылка не работает).
3. Отправить ссылку на облачную папку разработчику и в течение 1-2 дней согласовать с ним контент. Согласование подразумевает дополнительную проверку контента разработчиком после вашей проверки (вдруг где-то фото слишком маленькое случайно завалялось и нужно заменить).
4. После размещения контента на сайте проверить правильность его работы. Конечно, любой адекватный разработчик проверит самостоятельно, но 2 головы всегда лучше чем одна.

Наполнение — это один из тех моментов, где происходит наибольший излом работы, поэтому к нему нужно отнестись с особой внимательностью. Большинство разработчиков, обозначив вам срок создания сайта — готовы его исполнить, т.к. озвучили сроки с запасом на несколько дней (на случай каких-то непредвиденных обстоятельств). И вот на следующий день после завершения обозначенной даты они в любом случае возьмут в работу нового клиента. Даже если ваш проект не закончен. Иначе им просто не выжить, ведь создавая сайт эконом класса по прототипу за 40-45 т.р. в 2022 году хорошо, если заработаешь на еду. Соответственно, если вы не предоставили контент вовремя, а через неделю, то гарантированно навлечете на себя ситуацию, где ваш сайт будет разрабатываться в перерывах работы над другим проектом. Сроки будут растягиваться просто непомерно, ведь даже обещая выполнить что-либо завтра, разработчик уже не сможет сдержать свои обещания и рассчитывать время адекватно. Одновременно 10-15 сайтов может делать только студия или большая команда, и то при условии, что все сайты делаются разными людьми, а не 10 клиентов у одного разработчика затянули сроки передачи контента, а потом одновременно пришли и создали коллапс:) Тут справедливо было бы подметить, что коллапс у разработчика — это проблема самого разработчика, ведь он не смог создать себе рабочий регламент и объяснить своему клиенту как упростить жизнь и себе и ему. Однако эта проблема моментально превращается в общую, и никакой конфликт ее не решит. Можно сколько угодно говорить разработчику «доделай мой проект, потом делай что-то другое», но этого не произойдет. Проще просто не нарушать сроки. Если же все-таки случилось какое-то Чп и контент вовремя предоставить не удалось, то обязательно уточните когда у разработчика будет перерыв между проектами, чтобы он взял ваш сайт в работу на доделку именно в свободное время. Возможно, время ожидания займет 2-3 недели, но с этим ничего не поделать. Такова цена нарушения рабочего процесса.

Настройка работы скриптов. Финальные тесты.

На данном этапе разработчик настраивает работу всех форм, настраивает передачу заявок на почту, в Telegram боты, устанавливает скрипты аналитики. Все, что от вас потребуется — просто проверить адекватную работу основных систем.

А именно:

1. Отправку каждой формы и доставку сообщения от нее. Обязательно проверить именно каждую форму на сайте, даже если они одинаковые. Любая неправильно работающая форма сильно навредит конверсии вашего сайта. И она может оказаться не работающей даже, если разработчик сайта ее проверял и у него она работала. Частенько после проверки работы формы, нажимаешь кнопку «сохранить» и это сохранение отправляется на хостинг, который в этот момент просто погас на одну секунду. Результат — поломанная форма и разработчик уверен, что все ок, ведь тестировал.
2. Каналы сообщений от форм. Как правило, мои сайты отправляют заявки одновременно: на почту, в Telegram бота, в CRM систему. Если даже 2 канала сломаются, заявка все-равно придет моему клиенту в один из трех. У вас сайт должен отправлять сообщения тоже одновременно в несколько каналов, но в те, на которые вы договорились со своим разработчиком.
3. Формат сообщений от форм. В 90% случаев сайт делается для того, чтобы запустить на него рекламу. Соответственно сообщения ваших форм должны показывать по какой ссылке перешел клиент на ваш сайт (чтобы видеть ютм метку). Это позволит эффективнее работать с рекламой в будущем.
4. На сайт должен быть установлен скрипт аналитики + цели и обязательно оттестированы. Например Яндекс Метрика. Вам нужно зайти в нее и увидеть в вебвизоре все, оставленные разработчиком и вами, тестовые заявки. Если их там нет, значит скрипты не работают. И главное на этом этапе, никогда не слушайте волшебные истории разработчиков о том, что скрипты аналитики на сайт устанавливают маркетологи. Сейчас на рынке сотни самых разных систем управления сайтами и попросту не существует маркетолога, который может быть знаком с ними всеми. Любая попытка исправления кода вашего сайта непрофессионалом (а маркетолог вообще не профессионал в области кода), может с легкостью поломать любые элементы вашего сайта и испортить его. Если же вам попытаются рассказать историю о том, что хотя бы цели пусть маркетолог в метрике создаст, т.к. они мол не знают какие нужны, то тут смело можете ругаться. Абсолютно любой разработчик сайта знает, что сайт созданный для запуска рекламы, должен иметь только те цели, которые обозначат процесс передачи контакта потенциального клиента предпринимателю. Соответственно, вы столкнулись с людьми, которым просто лень составлять список и они хотят потратить ваше время и побесить маркетолога, из-за которого им, несчастным, придется работать на целых 2 минуты больше.

Вот эти проверки вам потребуется выполнить в течение 1-го рабочего дня, постоянно находясь на связи с разработчиком. Сначала сделайте один общий список правок за 1-2 часа, а потом если что-то еще постепенно найдется.

Финал.

Если вы выполните все точно так, как я описала, то разработка сайта упростится для вас примерно в 10 раз и гарантированно будет выполнена в срок, если вы связались с адекватным разработчиком. Адекватного в 2022 проще всего найти по ценам и кейсам. Если цена на разработку эконом лендинга по готовому прототипу 45-60 т.р., значит все хорошо (заработает разработчик с этого 15-25 т.р. чистой прибыли). Если цена ниже, значит беда и какие-то процессы у разработчика не учтены или испорчены. По кейсам можете смотреть примеры в моем портфолио (последние сайты). Если примерно по наполнению и внешности его сайты похожи, значит разработчик подходит, если нет, то скажите ему «до свидания».

Разработка сайта даже с грамотным специалистом, у которого есть хорошие рабочие регламенты, все-равно заставит вас пройти через все, что описано выше. Однако, это относится только к сайтам эконом и среднего сегмента. Премиум сайты можно разрабатывать так, как вы к этому привыкли и ни о чем не думать. Результативность этих самых «премиум» сайтов обычно либо на 1% выше эконом/среднего класса, либо одинаковая. Экономятся только нервы.

Выбор всегда за вами. Надеюсь, эта статья вам помогла или когда-либо поможет:)