Макетирование является одним из ключевых моментов при создании сайта.
Веб-дизайнеры используют различные инструменты при макетировании будущего сайта. Некоторые используют только графические приложения (Photoshop), кто-то же обходится бумагой, html и css. У каждого из подходов есть свои плюсы и минусы, которые я попробую раскрыть в данной статье.
Photoshop
Используя Photoshop, Вы можете показать готовый макет. Его можно быстро скомпоновать, разметить, добавить изображения, поменять цвета размеры, формы.
Проработать множество различных вариаций макета не составит особого труда. Инструменты Photoshop помогут быстро и качественно создать желаемые графические элементы разных размеров и цветов. Слои, наложения, фильтры и множество других функций Photoshop Вам в помощь.
На предоставление первого варианта макета клиенту у Вас займет минимум времени.
HTML+CSS
Макет сайта представлен в реальном исполнении, где можно перейти по ссылкам, добавить, удалить текст или изображения. Все эти действия можно производить на стороне сервера и результат будет виден и доступен в считанные секунды. В случае с Photoshop Вам придется делать изменения в редакторе, будь-то изменение текста или изображений, после, сохранить в определенном формате и качестве, дабы избежать появление артефактов при сжатии изображения и выложить (или отправить по почте) в интернет.
У Вас и Ваших клиентов есть возможность посмотреть будущий сайт «в живую» при различных разрешениях экрана и в различных браузерах. Если сайт имеет резиновую верстку, то альтернативы этому способу нет.
Как в случае с Photoshop, Вам не нужно будет верстать макет он будет уже и так готов. Вы экономите время на верстку, хотя на предоставление первого макета сайта у Вас займет немного больше времени, нежели если бы Вы рисовали макет в Photoshop. Бумага и карандаш дают больше свободы при создании наброска, чего вполне достаточно для начала макетирования в коде.
Вывод
Каждый использует тот способ создания макетов, который ему более предпочтителен. Если человек только начинает свой путь в веб-дизайне или он занимается только созданием макетов, то ему ненужно знать и заботиться о дальнейшей верстке, он просто рисует. Если же созданием сайта занимается студия, в которой есть и дизайнеры и верстальщики, то они могут работать сообща и в качестве макета предоставить клиенту практически готовый сайт. И есть люди, которые профессионально рисуют макеты и грамотно верстают его.
Пока я использую вариант с Photoshop, т.к. макетирование занимает минимум времени и это единственная причина, по которой мной используется данный метод. Обещаю себе, что в ближайшие несколько проектов перейду на HTML+CSS+Photoshop макетирование :)
* В статье в качестве примера используется графическая программа Photoshop, которая является одной из самых популярных программ при создании макетов для сайтов. Эта программа может быть заменена на любое другое аналогичное приложение.
Комментарии
Ребята, что за бред, вы представляете вообще что значит, злое и беспощадное, слово заказчик, особенно заказчик дизайна сайта?! Это человек которому для тех или иных целей нужен сайт, но он не представляет, ни какой должен быть у него вид, ни функционал, он просто хочет привлечь клиентов к своему бизнесу, либо привлечь внимание к себе, иногда он даже не знает тематику того что он хочет видеть в будущем в виде своего сайта. А теперь давайте подумаем «вместе», дизайн сайта у фрилансера, хорошего, стоит от 200 долларов(только макет в псд), а теперь представьте стоимость у профессиональной студии, и если каждый дизайн который будет рисоваться еще и верстать, то стоимость увеличится раза в полтора, а заказчик не знает что он хочет, по сему перерисовывать и переверстывать придется часто, в том случае если еще и заказчик честный, иной раз он может просто скачать этот представленный мокап, и только ты его и видел, плюс это опять же время, которое уходит на верстку, передизайн, переверстку. Может какие то большие студии и делают так, но могу поспорить что за это, они и к так высокой цене, добавляют наценку за верстку и не работают без предоплаты.