Требования к макетам при разработке дизайна сайта
- Должны быть разработаны макеты для каждой не типовой страницы сайта. Например, для магазина это:
- Главная
- Типовая страница / о компании
- Новости
- Вакансии
- Контакты с картой и формой обратной связи
- Каталог услуг и страница услуг
- Клиенты/партнеры
- Если требуется мобильная верстка, то необходимо подготовить дополнительные шаблоны для:
- мобильных телефонов - 320px
- планшетов - 768px (1024px если необходимо отдельное ландшафтное отображение)
- Ширина макета. Если сайт не резиновый или условно-резиновый, ширина макета должна опираться на следующие точки: 1280px; 1440px. Эти разрешения хорошо делятся на 3, 4, 6, 12 для создания колонок сайта.
- Макетная сетка должна содержать определенное число колонок (обычно 12) и блоки должны быть выровнены по данным колонкам. Что такое модульная сетка и для чего она нужна в веб-дизайне »
- Вертикальный ритм. Необходимо создать свод правил, в которых высота блоков, строк, отступов пропорциональна некоторой величине. Это заметно упростит работу верстальщику, избавив его от необходимости высчитывать каждый отступ и лайнхейт. В идеале все вертикальные метрики макета должны быть выражены через 2 переменных: базовый размер шрифта и вертикальный ритм.
- Пикселизации и артефактов быть не должно. Особенно это заметно на экранах хороших смартфонов. Поэтому все изображения, используемые в мобильной версии и версии для планшетов должны иметь копию с повышенной плотностью пикселей (2x)
- При оформлении необходимо использовать 1 или 2 типа шрифта. Использовать декоративные шрифты только там где это целесообразно: заголовки, элементы оформления. Жирностью и курсивом злоупотреблять не желательно.
- Всегда подготавливать активные (:active, :hover) состояния ссылок, кнопок, пунктов меню. Сайт должен реагировать на действия пользователя там где это необходимо.
- Подготавливать favicon и apple-touch-icon