Блог студии itworks

Пишем про сайты, веб-дизайн, маркетинг в интернете

Как мы делаем ЭТО: процесс создания сайта в деталях

13 января 2016

how-to-do

Первый вопрос, который мне задают клиенты — «Сколько стоит ваша работа?». И следующий, вытекающий из первого — «Что я получу за эти деньги?».
Я уже столько раз объяснял это по телефону, что накопил достаточно материала для статьи. Итак, давайте считать.

 

Сколько стоит?


На этот вопрос нет однозначного ответа. Если разработчик сразу называет стоимость сайта — скорее всего он пытается продать вам шаблонный вариант, которым уже пользуются десятки его незадачливых клиентов. Каждый проект уникален и стоимость его складывается из затрат времени. Затраты времени, в свою очередь, зависят от особенностей рынка, пожеланий клиента и усилий его конкурентов. Такой вот замкнутый круг. Полезное действие у всех сайтов одно и то же, но пути его достижения — всегда разные.

 

Проведу аналогию, чтобы было понятнее. Нам нужно добраться из пункта А в пункт Б. В первом случае наш путь пролегает по прямой асфальтированной дороге, во втором — по пересеченной местности, через горы, пески и болота. Задача — создать средство передвижения, чтобы пройти путь из А в Б за одинаковое время.

 

a-to-b

 

Для проезда по ровной дороге мы можем ограничиться велосипедом. На то, чтобы его собрать уйдет не слишком много времени. Во втором же случае велосипед отпадает. Здесь понадобится что-то помощнее. И вот, собирается команда исследователей и анализирует местность, замеряет перепады глубин, проводит расчеты и делает вывод — придется строить трактор. Команда инженеров проектирует детали трактора, завод эти детали изготавливает, сборщики собирают. А тут еще выясняется, что нам нужно топливо и дополнительные колеса… Я не очень силен в строительстве тракторов, но пример, надеюсь, понятен. Задача одна, условия — разные.

 

Задача сайта — привести клиентов к вам в офис. Полезное действие — звонок, письмо через форму связи, онлайн-заказ в интернет-магазине.

 

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

useless

Примеры бесполезного действия

 

Ключевым показателем качества сайта (то есть нашей работы) мы считаем его экономическую эффективность. А эффективность определяется количеством лидов, которые сайт приносит. Ну и в последствии (при условии качественной работы менеджеров клиента, хорошего продукта и сервиса) — количеством совершенных сделок. То же самое с любым рекламным инструментом — наружкой, промо-акцией, роликом на YouTube (нужное подчеркнуть). Мы привыкли делать свою работу качественно. Зачастую это значит «долго».


Что получаем?


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

 

      1. Сбор информации и подготовка задания

 

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

 

     • Что интересует ваших клиентов, какую информацию и в каком порядке нужно им предоставить?

     • Как справляются с этой задачей конкуренты? Какие приемы они используют в интерфейсах, дизайне, поисковом продвижении?

 

В результате исследования мы получаем два документа:

 

     • Техническое задание, в котором прописано понимание задачи (пример для сайта Водастрой) — ответ на вопрос, зачем и для кого мы делаем сайт;

     • Список работ со стоимостью (пример для сайта Водастрой с выдуманными цифрами) — как и что именно мы делаем.

 

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

 

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

 

tehnicheskoe-zadanie

Популярный пример того, что бывает без техзадания

 

 

      2. Дизайн

 

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

 

design-tweet

 


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

 

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

 

      3. Тексты

 

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

 

paste-lorem-ipsum

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

 

Тексты и дизайн — 95% визуальной части сайта. С ними взаимодействует пользователь, их качество влияет на количество заявок и сделок.

 

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

 

      4. Верстка

 

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

 

lenin-href

 

      5. Программирование

 

Чтобы сайт начал функционировать, сверстанные макеты страниц необходимо интегрировать в систему управления (CMS или «движок») сайта, создать и настроить базу данных. Система управления делает сайт гибким рекламным инструментом. Благодаря ей мы можем быстро добавлять и менять тексты, изображения, прикреплять видеофайлы, собирать информацию о посетивших нас пользователях и оптимизировать содержимое ресурса под поисковые системы.

 

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

 

111

 

      6. Оптимизация

 

Поисковая оптимизация — это ваша позиция в поисковых системах Google и Яндекс. Чем раньше пользователь видит ваш сайт по определенному запросу — тем выше вероятность, что он зайдет на него, и будет сражен наповал вашим первоклассным дизайном и искрометными текстами. Процесс оптимизации неотделим от создания сайта и проходит в несколько этапов:

 

     • Сбор запросов — на этапе проектирования сайта. Важные запросы должны присутствовать в заголовках, пунктах меню и адресах страниц.

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

     • Оптимизация текстов — на этапе дизайна и подготовки текстов. При ранжировании сайтов поисковые системы анализируют в первую очередь тексты. Человек набирает в Яндексе «Купить слона» и если это словосочетание встречается у вас на сайте — видит вас в результатах поиска.

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

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

     • Размещение вечных ссылок — после запуска. Количество внешних ссылок на ваш сайт — еще один важный фактор поискового ранжирования. Чтобы разместить эти ссылки, компания должна в первую очередь присутствовать на Яндекс и Google картах и в справочниках этих поисковых систем.

 

Создание сайта без оптимизации и продвижения — пустая трата денег

 

Каким бы классным не был ваш дизайн, какими бы интересными не были тексты, какой бы быстрой не была система — сайт не принесет ни копейки, пока его не найдут пользователи. А найти его с каждым днем становится все труднее, потому что каждый день запускаются тысячи новых сайтов. Десятки из них — с классным дизайном, интересными текстами и отлаженным движком. Возможно, пока вы читаете эту статью, ваш конкурент празднует попадание в ТОП-3 Яндекса.

 

build-money

 

      7. Техническая поддержка

 

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

 

По желанию, после запуска сайта мы можем составить рекламную кампанию в контекстных системах — Google ADwords и Яндекс.Директ. Это как раз топливо для нашего трактора из первой части статьи (ну или внедорожника, если хотите). Контекстная реклама помещает ваше объявление на первое место в результатах поиска по определенным поисковым запросам. Но это уже совсем другая история.

 

dikerc-screeen

 

 

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

 

С любовью, команда ITworks Studio.

 

Поделиться
Запинить

Ваш комментарий

Ваше имя
Текст