August 21, 2020

Этапы разработки сайта

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

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

Как это должно выглядеть на самом деле:

• Предпроектное исследование

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

• Проектирование

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

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

• Исследование удобства прототипа

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

• Техническое задание

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

• Визуальный дизайн

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

• Верстка

• Программирование

• Тестирование

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

• Доработки

По результатам опроса проводим последний раунд правок на сайте, тут бывают работы и в технической, и в визуальной части, но чаще всего это — вопрос юзабилити, потому что мы подумали, что клиенту будет удобно то, что удобно нам. А это, поверьте, часто бывает не так.

• Обучение клиента CMS

• Наполнение

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

• Аналитика

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

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

Обязательно подписываетесь на блог везде, где только можно, читайте там, где вам удобнее:
https://www.facebook.com/bespoleznyim/
https://zen.yandex.ru/id/5b3609cb4f4b9400a95756fc
https://t.me/bespoleznyi_m
https://vk.com/bespoleznyim