ЗАПИСАТЬСЯ НА КУРС!
сайт своими руками  →  Уроки  →  Введение  →  План работы над сайтом

План работы над сайтом

Не важно, разрабатываете вы сайт для клиента или делаете свой собственный проект, этапы разработки будут примерно одинаковы. Как показывает практика, для себя делать сайты даже несколько сложнее, ведь бороться со своими собственными сомнениями и перфекционизмом подчас сложнее, чем вести переговоры с клиентом :)

Порядок работы над проектом

  1. Заполнение брифа
  2. Заключение договора
  3. Составление технического задания
  4. Эскизы дизайна
  5. Разработка дизайн-макетов
  6. Верстка
  7. Сборка на CMS, наполнение контентом
  8. Перенос на хостинг, настройка

Бриф

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

Цель заполнения брифа: детализация задачи как для клиента, так и для вас.

Договор

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

Договор заключается после составления и обсуждения брифа, согласования общей стоимости проекта и перед созданием Технического задания.

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

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

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

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

Эскизы сайта

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

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

Проследите за тем, что после того, как эскизы готовы и все корректировки учтены, клиент поставил дату и свою подпись на всех страницах с эскизами! 

пример эскиза главной страницы сайта

пример эскиза главной страницы сайта

Дизайн сайта

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

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

В общем случае: Уникальный дизайн - долго и дорого, "Дизайн-шаблон" - быстро и дешево.

Какой из вариантов подходит вашему клиенту? Это зависит от многих факторов и выясняется на этапе предварительных переговоров и заполнения брифа.

Важно! Если проект включает этапа разработки уникального дизайна, никогда первый вариант не отправляйте клиенту по почте. Только личная встреча! Клиент не обязан знать что "вот тут будут блоки сменять друг-друга, тут, при наведении у нас появится окошко с пояснениями" и т.д. Все эти моменты нужно презентовать и объяснять лично.

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

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

После утверждения дизайна страниц сайта мы переходим к этапу верстки.

Верстка - это работа по переводу дизайн-макета сайта из макета Photoshop в страницы HTML+CSS шаблона. В результате мы получаем готовые типовые страницы, их можно посмотреть в браузере, у них работают кнопки и т.д. Но это пока еще не полноценный сайт, а только форма страниц. Вся теория и практика современной верстки с большим количеством примеров и обсуждением ньюансов и подводных камней подробнейшим образом разбирается на занятиях курса.

Сборка сайта на CMS

После верстки наступает этап создания полноценного сайта с системой администрирования содержания или CMS (Content Management System). Сайт на системе управления контентом позволяет контент-менеджеру добавлять, редактировать и даже менять структуру страниц и логичестких блоков сайта без каких-либо особых дополнительных знаний. Другими словами, управление содержанием современного сайта для обычного человека является такой же простой задачей как, например, постинг "фотографии котика" и подпись к ней в любой соц.сети. И на этом этапе как раз и происходит эта "магия", которая включает следущие пункты:

Интеграция HTML+CSS шаблонов в CMS (систему управления контентом).
Настройка модулей: меню, лента новостей, каталог, формы обратной связи и т.д.
Написание (программирование), если необходимо, дополнительного функционала.

В рамках курса мы подробно разберем, как это все делается на примере CMS MODX Evolution.

Перенос сайта на хостинг

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

Перенос готового сайта с локального компьютера на удаленный сервер в сети.
Настройка сервисов аналитики, работы почты и т.д.

Итог

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

Удачи и до встречи на курсе "Сайт своими руками"!