Как придумывать красивые идеи? 10 основных правил создания Landing Page

Оптимизация PSD макета для верстки

Опубликовал: Realarts    Категория: Art-Блог / Дизайн
Дата: 07 апреля 2015, 11:49
Просмотров: 1506    Оценок: 0


Будь хорошим дизайнером! Оптимизируй .psd макет для верстальщика и сэкономь время себе и ему. Одна из особенностей работы с макетом и передаче его верстальщику. Помним главный принцип того, что Ваши идеи не будут полностью реализованы, если Вы не позаботитесь о чистоте и порядке своего psd файла. Любому верстальщику будет не приятно работать с не понятным содержимым и в некоторых случаях либо он откажется, либо сделает не то, что требовалось на самом деле.

Дизайн сайтов - это не полиграфия

Предоставляйте макет в традиционном формате .psd (Photoshop). В противном случае сайт будет отличаться от макета.\ и не будет реализован на все 100% от Вашей идеи. Используйте цветовое пространство North America Web/Internet - sRGB. Именно оно используется по умолчанию в веб. CMYK - используется в полиграфии, для web не подходит. Единицами измерения в макете должны быть пиксели, а не сантиметры или другие величины. То же касается размера шрифта и интерлиньяжа.
 

Наводим порядок в слоях

Группируй слои по смысловым блокам с верху в низ и с лева на право, и даем слоям и группам осмысленные, информативные названия. (Шапка, контент, Подвал и т.д.) Объедините те слои, которые не будут использоваться по отдельности. Удаляйте все не нужные слои. Верстальщик сверстает все, что будет в макете, не зависимо от того, скрыт слой или нет. По этому удаляй всё не нужно и не используемые. (пример на рисунке)
 


Ни какой случайности в мелочах

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

Ловушка для верстальщика

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

Обязательные элементы макета

Показывай состояние интерактивных элементов: нормальное, при наведении, активное состояние, не активное состояние и т.д. Показывай всё типографическое оформление текста: Заголовки 1-6 уровней, контентный шрифт, списки, таблицы.
 

Как найти то, не знаю что

Прикрепляй к файлу PSD отдельную папку с материалами для проекта, гду будут храниться все изображения в исходном качестве, а так же все дополнительные материалы. Все нестандартные шрифты обязательно копируй в ту же папку с дополнительными материалами для проекта. Вдруг у верстальщика нет этого замечательного кириллического шрифта. Давай пояснения к элементам, которые могут вызвать вопросы. Если у тебя есть особые задумки, которые не так просто показывать в макете, опишите их текстом.
скачать dle 10.3фильмы бесплатно
Источник
Похожие материалы: