Процесс создания сайта
Нам поступает множество просьб описать, что конкретно мы делаем в процессе создания сайта. Т.е. «клиент должен знать, за что он платит деньги». Дабы не повторять множество раз одно и то же, было принято решение составить сей документ.
Как же делается сайт? Если укрупнённо, то разработка сайта состоит из следующих этапов:
Теперь можно расписать некоторые этапы подробнее.
Составление задания
Это один из наиболее трудоёмких и длительных этапов. Часто заказчик сам не может определить чёткие требования к разрабатываемому сайту, и задача формулируется на уровне: «Ну, надо чтобы был сайт…». Поэтому наша работа на этом этапе заключается в следующем:
- Выяснить чего хочет заказчик, в самых общих чертах;
- Рассказать о том, из каких элементов может состоять сайт (зачем нужна система управления, что есть такие штуки, как гостевые книги, системы голосования, формы обратной связи и т.п.)
- В свете открывшихся фактов повторить пункты 1-2, и возможно, не один раз :-);
- Начать разработку документа с описанием функциональности сайта;
- Утвердить описание функциональности у заказчика.
- Если система сложна, то разрабатывается техническое задание, внутренний документ, который адресуется программистам, которые будут работать над сайтом.
Вроде бы требования к функциональности написаны, заказчик их утвердил, сказал: «Да, это именно то, что надо!». И дальше начинается самое интересное — в процессе разработки эти требования начинают изменяться. Потому что заказчик, глядя на первые эскизы, дизайн-макеты, экранные формы системы управления, вспоминает, что забыл мааааленькую такую штучку, из-за которой приходит переписывать половину кода. Или как минимум вносить серьёзные правки в некоторые разделы, в структуру БД, в дизайн-макет. Это, понятное дело, сильно не приветствуется разработчиками. Поэтому вопрос решается так — все изменения поверх указанных в требованиях к функциональности, оплачиваются отдельно сверх оговорённой стоимости работ.
Получение предоплаты
Ну, тут, думаю, всё ясно :-) Предоплату мы обычно берём в размере 30-40%.
Разработка дизайн-макета
Дальше дизайнер начинает придумывать и рисовать дизайн-макет главной страницы сайта. При этом, естественно, учитываются пожелания заказчика, если таковые наличествуют — предпочитаемая цветовая гамма, фирменный стиль компании, логотип и т.п. Также дизайнер учитывает ту информацию, которую нужно представить на главной странице — элементы навигации, текстовые блоки, блоки для голосования, баннеры, счётчики и т.п., т.е. всё, что нужно поместить на главной странице, дизайнер придумывает, КАК разместить. И с помощью графических пакетов рисует дизайн-макет. Дизайн-макет представляет собой просто картинку (т.е. это не HTML-страница, а именно картинка, графический файл), как должна выглядеть главная страница.
Обычно мы делаем два макета, на выбор. Макеты отправляются заказчику на утверждение, из них он выбирает тот, который ему нравится, делает какие-то замечания, мы их устраняем и можно переходить к следующему этапу.
Разработка системы управления
Параллельно с разработкой дизайн-макета программисты пишут систему управления сайтом. Система управления позволяет заказчику самостоятельно изменять содержимое некоторых разделов сайта, например, раздела «Новости» или ещё каких-нибудь, в которых требуется динамическое изменение информации.
Здесь есть два подхода к созданию сайтов. Первый — сайт разрабатывается статический, без системы управления, без БД. Изменение содержимого страниц (размещение новостей, обновление прайсов и т.п.) выполняет либо специально выделенный сотрудник заказчика, либо представитель фирмы-разработчика сайта, за некоторую небольшую абонплату. Такой вариант сайта разработать можно быстрее и стоить он будет дешевле (иногда — значительно дешевле), чем сайт с системой управления.Однако у такой схемы есть и минусы. На строне заказчика должен наличествовать человек, который может разобраться с HTML-кодом сайта и вносить изменения на нужные страницы, не испортив ничего при этом. Либо же нужно заключать договор на обслуживание с разработчиком сайта и ежемесячно выплачивать ему денег за обновление информации. Причём даже в те месяцы, когда информацие, может быть, и вообще не обновлялась.
Соответственно, второй подход — это разработка сайта с системой управления. Такой сайт стоит дороже и работа над ним занимает больше времени, но позволяет сотрудникам заказчика самостоятельно обновлять информацию через удобный веб-интерфейс. Как следствие — от них не требуется знания HTML. Ну и не требуется ежемесячных выплат за обслуживание сайта.
Разработка системы управления — чисто программная работа. На этом этапе проектируется база данных сайта, реализуется спроектированная структура таблиц на выбранном сервере БД и пишутся скрипты, которые позволяют добавлять/редактировать/удалять данные в этих таблицах (а следовательно и в соответствующих разделах сайта). Для пользователя система управления представляется набором красивых окошечек с подписями и кнопками. Логика работы такая — пользователь заполняет нужные поля, нажимает кнопку «Сохранить» и данные сохраняются в БД, после чего они доступны (видны) на страницах сайта. Соответственно, пользователь также может редактировать и удалять информацию из БД, а следовательно, и со страниц сайта.
Вёрстка макета
После того, как макет нарисован и утверждён, можно приступать к вёрстке макета. Как сказано выше, дизайн-макет представляет собой просто картинку, изображение того, как будет выглядеть главная страница сайта. Но картинку на сайт не положить, туда нужно выкладывать HTML-страницу. Для этого картинка дизайн-макета разрезается, оттуда, как из бумаги, вырезаются нужные графические элементы и последовательно верстаются в HTML-страницу, т.е. делается так, чтобы страница сайта выглядела точно так же, как на картинке, но построена была стредствами языка HTML. Тексты на странице тоже рисуются уже не картинкой, а пишутся именно как текст — по буквам :-)
Также при вёрстке составляются так называемые «таблицы стилей», который описывают, как конкретно будут выглядеть отдельные элементы на странице: ссылки, тексты, таблицы, заголовки, абзацы, списки. В таблицах стилей специфицируются шрифты, цвета, расположение элементов на странице, отступы, наличие и вид окантовок-бордюров и тому подобные моменты. Проставляются ссылки, пока что пустые (т.е. ведущие на эту же страницу). Всё это делается для того, чтобы показать, как будет выглядеть страница непосредственно на сайте, и проверить правильность вёрстки, правильность отображения сайта под различными разрешениями экрана и различными браузерами.
«Оживление» сайта
Тоже достаточно трудоёмкий процесс. Трудоёмкий потому, что приходится делать очень много мелких движений :-) И процесс этот выполняется одновременно двумя (как минимум) специалистами: дизайнером и программистом. На этом этапе происходит следующее — свёрстанный на предыдущем этапе HTML-макет главной страницы разрезается на шаблоны, т.е. на части, которые будут появляться на каждой странице сайта (например, меню сайта, логотип, шапка и нижняя часть страницы). Проставляются реальные ссылки вместо пустых.
Как уже говорилось, дизайн-макет представляет собой макет только главной страницы. Но ведь сайт состоит не только из главной страницы, а ещё из других :-) Бóльшая часть элементов других страниц будет взята с главной страницы — те самые шаблоны меню, шапки и т.п. Но есть некоторые разделы, которые отличаются. Вот их и будет прорисовывать дизайнер, чтобы все страницы сайта были в рамках единого дизайна. А программист, соответственно, будет все страницы оживлять — где-то прикручивать JavaScript (например, если на сайте нужно сделать выпадающее меню, типа того, как сделано в программах Windows), где-то осуществлять вывод данных из БД (новостей, прайсов и тому подобных разделов), делать формы отправки писем прямо с сайта, в общем, делать функционал сайта реально работающим.
Тестирование и отладка сайта
С этим этапом тоже, думаю, всё понятно. Здесь проверяется работоспособность всех разделов и скриптов сайта — добавляются ли данные в системе управления, правильно ли указаны ссылки, не расползается ли дизайн на каких-нибудь страницах.
Заключительные этапы
Здесь мы заводим временный каталог на нашем сервере, и переносим туда все скрипты и БД разрабатываемого сайта. Это сделано для того, чтобы заказчик мог «вживую» посмотреть на то, как работает сайт, и высказать критические замечания. Так же на этом этапе, фактически, продолжается тестирование сайта, но уже силами заказчика. Иногда тоже могут всплывать какие-то неисправленные ошибки.
Если заказчик обнаружил какие-то ошибки или внёс замечания, то мы их устраняем. После чего сайт готов к эксплуатации. Скрипты и база данных заливаются на тот сервер, где сайт уже и будет «жить», и разработка сайта считается законченной, осталось только получить денег :-)
