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

 1. Сбор первоначальной информации

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

 2. Отрисовка макета

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

3. Создание html-структуры

На этом этапе верстки сайта с нуля начинает использоваться код и различное ПО для верстки (Dreamweaver, Notepad++ и др.). После «нарезки» элементов из макета, они с помощью блочной модели расположения приобретают свое место на шаблоне. Если работу по шаблону выполняет команда, то здесь также важно уметь правильно передать сделанное следующему исполнителю. В данном случае для программиста, который будет работать после верстальщика. Необходимо видеть начало и окончание блоков, иерархические отступы и правильно оформленный код. Также на этом этапе вполне целесообразным будет показать предварительную работу заказчику.

 4. Программирование шаблона

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

 5.Тестирование и проверка шаблона

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