26 Октября 2008
Требования к дизайн-макету сайта
К сожалению дизайнеры у нас валяются на каждом углу, но толковых найти очень сложно. Поэтому я и написал эту статью в помощь дизайнеру, верстальщику и заказчику. Чтобы облегчить труд для всех жаждующих, опишем требования к макету и дизайну
Жесткие требования
К файлу
- Сам макет должен быть представлен в форматах PSD или TIFF, сохранять строго в RGB
- Все слои одного логического элемента должны быть в одной папке (например модуль авторизации)
- Слои не в коем случае не должны быть склеены, кроме дизайнерских фишек
- Выравнивание слоев строго по rulers. Их не удалять. Оставлять в макете.
- Rulers должны быть выровнены строго с точностью до одного пикселя. Полпикселя не допустимо.
- Каждый элемент должен находится в одном слое, названным человечески-понятным именем, а не slice 1,2.
- В случае фиксированного шаблона четкое соответствие ширины макета утвержденной минимальной ширины сайта (а то говоришь что сайт будет фиксированный на 800 пкс, а рисуют 850 макет - что хошь то и верстай после этого).
- При разработке дизайна "под разрешение" обязательно отрисовывать в разрешение окна браузера а не монитора (при 1024 ширина браузера 1000.)
Графические фишки
- Фоны должны быть повторяющимися, текстурированые без логики повтора не принимаются.
- Эффекты подсвечивания не допустимы. Например при наведение на ссылку, фон ссылки становится полупрозрачным "облаком".
- минимум элементов, что потребуют создания графических файлов png-24 (полупрозрачность etc).
- Обязательно должна присутствовать favicon.ico для сайт.а
Текстовое содержимое
- Для текстовых элементов обязательно указывать шрифт и его размер (учитывая что стандартных шрифтов всего ничего), желательно в комментариях, фотошоп умеет их делать. Ни каких трасформаций с текстом. Размер меняется размером шрифта.
- Быть внимательными в использовании нестандартных шрифтов. Стандартных шрифтов очень мало, которые есть в каждой операционной системе. Можно конечно подгрузить шрифт, но 100% не будет работать в старых браузерах.
- минимум изменения стандартных контролов форм
- Все текстовые элементы должны быть без сглаживания, т.е стандартный шрифт
- Описать поведение ссылок в дизайне (неактивная, при наведении, посещенная) в меню/модуле, то же самое касается ссылок отличающимися от дефолтного стиля (например ссылки в меню, pathway и т.д.)
- Обязательно должно быть указано оформление следуюших HTML тего: <p> параграф (абзац), заголовки с 1 по 4 уровень (h1, h2, h3, h4), маркированный список (<ul>), нумерованный список (<ol>).
Легкие пожелания:
- И самое главное - дизайнер должен быть верстальщиком, чтобы он мог сам сверстать то, что нарисовал (пусть не быстро и не 100% валидно, но уметь)
- Элементы навигации, типа стрелок, иконок. Хорошо бы получать в отдельном PSD или TIFF формате на прозрачном фоне.
Минимальный комплект для передачи работы верстальщику:
- Макет в формате PSD или TIFF
- Шрифты
- Иконки
- favicon.ico (еси нет возможности в ICO, то можно в PNG-24)
- Паттерн текстуры, елси используется для фона, в виде отдельного файла PSD
Спасибо beliyadm, poizon и Mitrich за дополнения
Комментарии
Тем более, сделать это ему не сложно. Ответить
трасформаций - трансформаций
следуюших - следующих
:)
Где-то видел примочки типа выдели ошибку и нажмите Ctrl-D или еще как и админ получи сообщение об ошибке. Ответить