+7 (495) 229-0436 | shopadmin@itshop.ru | 119334, г. Москва, ул. Бардина, д. 4, корп. 3 |
|
|
Как сделать верстальщика счастливым? 13 cоветов веб-дизайнеру14.01.2014 14:03
dejurka
Работать в команде всегда непросто. А сделать так, чтобы тот, кто продолжает сделанную тобой работу был доволен умеет не каждый. Иногда мы сами не подозреваем о том, какие проблемы и препятствия создаем для своих коллег. Частенько такое происходит и в неразлучной связке веб-дизайнер-верстальщик. Как сделать верстальщика счастливым? Специально для читателей несколько советов на эту тему дадут сегодня двое специалистов - Андрей Орлов (web-дизайнер, по первой профессии - верстальщик и php-программист) и Maya Specctra (веб-программист, верстальщик). Андрей Орловweb-дизайнер, по первой профессии - верстальщик и php-программист Ваш макет - это сложное, разобранное (и одновременно собранное) устройство, все детали его составляющие должны быть на своих местах и чётко рассортированы. Иначе и вы и ваш коллега будете сильно страдать пытаясь работать с таким документом. Пример (абстрактный) хорошей организации слоёв: Всё распределено по логическим группам, соответствующим областям страницы (хедер, футер, информационная часть, "плашка" товара и т.д. ), все, даже самые мелкие детали лежат каждый в своей папке, и вы не перепутаете текст описания товара и текст на кнопке под ним, например. Вся иерархия групп и слоёв основывается на структуре страницы. Это главный принцип хорошего макета. Качественный (по техническим критериям) дизайн должен быть разбираем (и модифицируем) вплоть до самой мелкой детали. Поэтому: Никогда не растрируйте слои если в этом нет крайней необходимости; Никогда не объединяйте слои друг с другом; Всегда используйте исключительно векторные инструменты (если только совсем нет другого пути то можно взять Marquee tool, но, всё же, не надо); Никогда ничего не "заливайте" градиентами и не пользуйтесь инструментами, результат работы которых "запекается" на слое и его невозможно изменить (заливка градиентом, заливка паттерном, выделения, обычные фильтры). Замените их процедурными аналогами, для градиента - Gradient overlay, Gradient layer; для выделения - Regtangle (и подобные) tool, растровые маски замените на векторные и так далее; При трансформировании и наложении фильтров на какую-либо растровую графику всегда конвертируйте её сначала в смарт-объект, а только потом всё остальное; Пользуйтесь смарт-объектами! Особенно когда хотите добавить фильтр поверх какого-нибудь слоя. Никогда не растрируйте его, конвертируйте в смарт-объект. Такой подход можно назвать своего рода "процедурностью". А главное её преимущество - гибкость и возможность отредактировать при необходимости практически всё. Как-то так получается, что почти всегда пропорции элементов, зазоры, маржины на макете диктует не чёткий расчёт а случайность. Один из самых частых объектов для насмешек над дизайнерами у разработчиков это всякие цифры типа ширины отцентрированного блока в 997 px. "Именно 997 и никак иначе! Концепция будет разрушена если сделать 1000" :) Гайды. Их реализация в Photoshop хромает, и в случае когда вы в одном документе, разделённом на группы, храните все страницы, а то и несколько вариантов дизайна, появляются проблемы. Поэтому я бы посоветовал намечать гайдами только основные границы. Не перебарщивайте, а то я такие макеты видел, что за синими линиями ничего не разобрать. А для разработчика лучше сделать отдельный слой где вы нарисуете сетку, по которой нужно верстать. Maya Specctraвеб-программист, верстальщик Учитывайте адаптивность дизайна. При разработке макета продумайте, как будет выглядеть конечный результат на устройствах с разными разрешениями экранов. Макет должен тянуться и ужиматься. Если вы решили, что какой-либо элемент макета вам не нужен, удалите этот слой из файла. Иногда дизайнеры решают просто скрыть слой, что в последствии может усложнить работу верстальщика. Также возможны ситуации, когда по случайности остается видимым не тот слой, что приводит к непониманию и длительным разбирательствам. Если в вашем дизайне много ховеров (возникающих или меняющихся при наведении мышки элементов), создайте отдельный макет, в котором будет показан вариант дизайна со всеми активными ховерами. В таком случае и заказчик, и верстальщик смогут сразу увидеть цельную картину. Если у вас есть какие-то особые задумки, которые не так просто показать в макете, опишите их текстом. Постарайтесь сделать это максимально развернуто и понятно. Используйте только стандартные шрифты. Нестандартные шрифты не будут видны у большей части пользователей. Мы благодарим специалистов за советы и желаем плодотворного сотрудничества дизайнерам и верстальщикам! Ссылки по теме |
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
О нас |
Интернет-магазин ITShop.ru предлагает широкий спектр услуг информационных технологий и ПО.
На протяжении многих лет интернет-магазин предлагает товары и услуги, ориентированные на бизнес-пользователей и специалистов по информационным технологиям. Хорошие отзывы постоянных клиентов и высокий уровень специалистов позволяет получить наивысший результат при совместной работе. В нашем магазине вы можете приобрести лицензионное ПО выбрав необходимое из широкого спектра и ассортимента по самым доступным ценам. Наши менеджеры любезно помогут определиться с выбором ПО, которое необходимо именно вам. Также мы проводим учебные курсы. Мы приглашаем к сотрудничеству учебные центры, организаторов семинаров и бизнес-тренингов, преподавателей. Сфера сотрудничества - продвижение бизнес-тренингов и курсов обучения по информационным технологиям.
|
119334, г. Москва, ул. Бардина, д. 4, корп. 3 +7 (495) 229-0436 shopadmin@itshop.ru |
|
© ООО "Interface Ltd." Продаем программное обеспечение с 1990 года |