Найти тему

Как подготовить дизайн сайта к верстке так, чтобы тебя не проклял верстальщик?

Как подготовить макет сайта к верстке?
Как подготовить макет сайта к верстке?

Помни: верстальщик не экстрасенс, он не умеет читать твои мысли, поэтому ты должен предоставить ему руководство к действию.

  • Я знаю, что некоторые дизайнеры к макету прикрепляют текстовый документ, в котором описывают все свои пожелания. Я люблю оставлять комментарии прямо на макете. Делаю это ярким шрифтом:
Комментарий на макете для верстальщика
Комментарий на макете для верстальщика

  • Если ты хочешь включить анимацию в сайт, расскажи, какая она должна быть.
На эту тему у меня есть отдельная статья, кликай

  • Покажи поведение форм: ошибка, во время заполнения, пустая и заполненная:
Поведение форм на сайте в различных состояниях
Поведение форм на сайте в различных состояниях

  • Если ты планируешь разное состояние кнопок, то эта задача так же лежит на тебе:
Состояние кнопок на сайте
Состояние кнопок на сайте

  • Не забудь, что с тебя не только формы обратной связи, а так же окна спасибо за заказ и т.п.
  • Пожалуйста, приберись на макете, удали все лишнее, объедини в папки послойно.
  • По поводу картинок и иконок. Некоторые верстальщики требуют их отдельным файлом, другим удобнее самим сохранить с макета.
  • Шрифт. Обязательно прикрепи файлы со шрифтами!

Адаптация под все устройства

И, напоследок, жаркая тема: адаптивность. Здесь, как в семейной жизни, нужно договариваться на берегу. Кто-то ненавидит, когда дизайн предоставляют уже с готовой адаптивностью, а кому-то наоборот нужны чуть ли не все разрешения.

Проблема лишь в том, что когда ты рисуешь дизайн, ты не всегда знаешь, кто дальше будет верстать.

Я делаю следующим образом, если сайт стандартный по структуре, отдаю без адаптивности, но я всегда делаю шапку под несколько разрешений и мобильное меню. Если на сайте большой акцент на графику – обязательно рисую мобильную версию, иногда и планшетную.

Я на Behance | Я на Dribbble
Нужен дизайн сайта или сайт «под ключ»?
Пиши мне: Lizar92@mail.ru