О порядке разработки сайта

Роли разработчиков.

Можно выделить членов команды разработки сайта, а это: Проект-менеджер (Project Manager - PM), Веб-дизайнер, html-верстальщик он же front-end developer, программист, тестировщик.

Теперь подробнее о каждом, их взаимозаменяемости.

Проект-менеджер (Project Manager - PM)

Разработка сайта начинается с того момента, когда клиент в веб-студию, digital агенство или любую другую компанию, которая предлагает ему создать сайт. Проект-менеджер (Project Manager - PM) отправляет клиенту  бриф (анкета, опросник - называют по разному) на разработку сайта, которую заполняет клиент. Именно на основе опросника составляется техническое название (ТЗ) на разработку сайта.

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

Сам по себе Проект-менеджер (PM) - это человек, который взаимодействует как с командой, так и с клиентом, следит за сроками и за выполнением всех требований, прописанных в ТЗ. Кроме этого, знает методы управления проектами, такие как Waterfall, Agile, Scrum, Kanban и прочее. Но важно не путать с менеджером по работе с клиентом, это абсолютно два разных человека. Менеджер по работе с клиентом только коммуницирует с клиентом, не знает технической части, как правило, очень сильно осложняет всем жизнь, если его ставят на управление проектом - а это бывает и часто.

Веб-дизайнер

После согласования ТЗ оно попадает к веб-дизайнеру, который на основе ТЗ готовит растровые дизайн-макеты. Но не путайте с графическим дизайнером. Графический дизайнер, в большинстве случаев, отрисовывает продукцию для типографии в векторе - флеры, каталоги и прочее. Профессиональный веб-дизайнер макеты для дальнейшей передачи в вёрстку готовит их в Adobe Photoshop или подобной программе для работы с растровой графикой или в оналйн-инструментах, таких как Figma, Invision, Zeplin - самые популярные на сегодняшний день. Смысл в том, чтобы макет был в 72dpi и имел слои (шрифты, изображения).

Если макет будет изготовлен в Adobe Illustrator, Adobe Indesign или Coreldraw - их делал человек, который к веб-дизайну имеет далекое отношение. Даже, если клиент заказывает только дизайн-макеты и у него есть свои программисты, то ему на выходе должны отдать макеты со слоями, а не jpg/png картинки.

html-верстальщик

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

Но не путаем установку верстки на CMS (Content Management System) - систему управления сайтом, таких как Joomla или Wordpress. Создание темы (шаблона) это не программирование как таковое.

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

Программист

Свёрстанные дизайн-макеты в виде html страниц отдаются программисту для дайльнейшей работы. Он создает или шаблон на CMS со всеми необходимымы расширениям, это может быть написанием дополнительных модулей/плагинов или создает сайт на основе какого-нибудь фреймворка, к примеру, это может быть фреймворк Yii, Symfony, Django.

Тестировщик

Тестирует сайт на основе заявленных в ТЗ требованиях и проверяет на соответствие с макетами. Отправляет на доработку верстальщику или программисту.

Это финальный этап. После него PM отправляет сайт на утверждение клиенту и согласовывает сроки для размещения сайта на сервере клиента.

Касательно взаимозаменямости

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

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

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

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