Rules for working with web designers

Требования к дизайн-макетам

* Макет должен быть представлен в формате PSD (позволителен формат .SKETCH) и превью макета в PNG, цветовое пространство RGB. 
PDF, AI, EPS, BMP, QXD, QXT и прочие, не говоря уже о расширениях файлов пакета программ Microsoft Office — не допускаются.
* Имя файла должно состоять только из латинских букв, цифр и _ (underscore)
* Если макет дополняет/изменяет уже существующий, то в его имени должен быть суффикс, указывающий версию (например landing_v2.psd). Файлы версий должны лежать по датам перезаписи в папке /archive/_дата, а в корне проекта — только актуальные версии.
* В рамках макета должна быть соблюдена сетка. Сетка в макете должна быть бутсраповская (botstrap) - 12 колонок, ширина колонки - 70px, межколоночное расстояние - 30px.
* Rulers должны быть выровнены точностью до одного пикселя. Полпикселя не допустимо
* В случае фиксированного шаблона должно быть четкое соответствие ширины макета утвержденной минимальной ширине сайта. 
Ширина макета всегда должна быть меньше подразумеваемой ширины устройства отображения на 20-24 пикселей, также ширина макета обязательно должна учитывать отступы справа-слева от края экрана.
* При разработке дизайна «под разрешение» обязательно отрисовывать в разрешение окна браузера, а не монитора (при 1024px ширина браузера 1000px)
* Адаптивные макеты сайта должны лежать в отдельной папке.
* Фон страницы должен быть однородным и повторяющимся. В том случае, если требуется использовать текстурирование — текстура точно так же должна быть однородной и легко дублируемой.
Желательно в виде отдельных файлов прикладывать все паттерны, используемые в макете


Слои (layers)
* Каждый элемент дизайна должен быть представлен в отдельном слое. Это означает, что любой элемент цельного изображения является автономным и может быть в любой момент включен/выключен/удален/изменен — не затрагивая другие элементы, и должен быть назван человечески-понятным именем, а не «layers copy1».
* Все слои одного логического элемента должны быть в одной папке (например, модуль авторизации)
* Если применяется градиент к слою, использовать обычный режим наложения (blend Mode: normal) и его реальные цвета
* Не должно быть никаких полупрозрачных градиентов и сложных режимов наложения типа «multiply, screen, overlay, и т.д.»
* Нельзя использовать сложные режимы наложения (blend mode) на любых свойствах слоя (типа inner shadow, drop shadow и т.д.)
* Нельзя использовать режим «Наложение цвета»
* Нежелательно использовать «слой на слое» для создание различных эффектов (например градиента)
* Нежелательно использовать градиентные границы (border, stroke)
* Нежелательно сводить простые стили слоёв (например отбрасывание тени легко реализуется средствами CSS)

Текст
* Для текстовых элементов обязательно указывать шрифт и его размер
* Размеры (кегль) шрифтов должны быть целыми числами. Использование 14.22 в качестве размера шрифта недопустимо!
* Запрещено изменять высоту/ширину шрифта способом, отличным от обычного изменения размера кегля
* Выгибание текста «аркой», «рыбьим глазом» и прочие видоизменения в рамках работы с текстом — не допускаются, это прерогатива изображений.
* Обязательно прикладывать к макету шрифты, которые были использованы в макете, в формате TTF, OTF
* Шрифт должен быть бесплатным или должна быть приобретена лицензия на его использование.
* Для текстового содержимого должны использоваться стандартные шрифты. В случае использования нестандартного шрифта, он должен прилагаться к макету и в обязательном порядке должен быть указан шрифт-заменитель из стандартного набора.
* Желательно не использовать в макете больше 2-х не стандартных шрифтов, их количествово сильно влияет на рендеринг страницы в браузере 
* Недопустимо использовать прозрачность для элементов содержащих текст
* Для каждого отдельного блока текста - отдельный text box
* Отличный от дефолта (100%) межбуквенный/межсловный интервал должен быть отмечен комментарием
* Из текстовых эффектов допустима лишь тень, и всё что с её возможностью можно эмулировать
* Желательно все текстовые элементы делать без сглаживания

Рыба
* Для повторяющихся элементов (списки и т.д.), рыба должна быть разной (необходимо для элементарной проверки контента на переполненность, тоже касается заголовков)


UI-Kit
Обязательно наличие отдельного макета, в котором представлено оформления стандартных элементов типографики веб-страницы (заголовки, параграфы, таблицы, списки, блоки цитаты)

Кнопки, текстовые поля, ссылки и прочие интерактивные элементы должны иметь несколько представленных в макете состояний:
* Ссылка
    * Обычная (не посещённая, не активная)
    * При наведении (hover)
    * При нажатии (click)
    * Посещённая (visited)
* Кнопка
    * Обычная
    * При наведении (hover)
    * При нажатии (click)
    * Заблокированная (disabled)
* Поле ввода (input, select)
    * Обычное
    * Активное (active)
    * Заблокированное (disabled)
* Checkbox, radio button
    * Обычный
    * Активный (active)
    * При наведении (hover)
    * Заблокированный (disabled)

Выпадающие-выезжающие-разворачивающиеся меню должны быть отображены в двух видах: 
* собранный; 
* разложенный.

Пункты меню должны быть отображены в 2 видах: 
* пассивный (курсор не наведен) 
* активный (курсор наведен).

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