Как сдать адаптивный дизайн верстальщику?

Question

[Влад]

Привет!
У меня есть последовательность экранов: ∞—1200px — 768px — 320px. Нужно ли делать макет минимальной ширины страницы перед переходом на новый размер экрана?
Если да, то получается что нужно делать два макета (max–width и min–width)?. Следовательно делаю макеты таким образом:

1200px

• 1200px (max–width), первый макет — 769px (min–width), второй макет
  

768px

• 768px (max–width), первый макет — 321px (min–width), второй макет
  

Если не нужно делать два макета, то как верстальщик узнает ширину отступов и блоков перед переходом на новый размер экрана?

Answer 1

[Нерон Лордов]

Чего то ты намудрил совсем. Либо плохо сформулировал вопрос.

Если есть три адаптивных разрешения - то их ты и сдаешь:
1) первый макет - 1200+
2) второй макет (специально словами дублирую) - 768+
3) третий макет (ну ты понял) - 320+

как верстальщик узнает ширину отступов и блоков перед переходом на новый размер экрана?

Вариант №1: сам додумает
Вариант №2: ты сдашь макеты, из которых всё будет ясно)

PS: Скорее всего, нужно учить матчасть. Вдумчиво покури статьи, благо их много. Скачай бесплатные шаблоны, включающие несколько адаптивных вариантов одного и того же сайта, их тоже навалом - лучше один раз увидеть.

Comments

[Влад]

Спасибо за ответ!
Перед тем как задать вопрос я ознакомился с немалым количеством материала по теме, но нигде не встречал информацию о том, как верстальщик узнает о поведении отступов и ширины блоков между брейкпоинтами.
Подскажи пожалуйста, когда я тяну окно браузера с сайтом, к примеру с 1200px до 769px, некоторые блоки и отступы остаются с фиксированной шириной, а некоторые тянутся. На 768px блоки перестраиваются и система с резиной повторяется. То есть на каждом брейкпоинте макет разный. Как верстальщик решает каким блокам/отсупам тянуться, а каким нет? «Вариант №1: сам додумает»?

[Нерон Лордов]

Влад: элементы, которые явно вписываются в колонки, привязаны к ним - тянутся, потому что тянутся/сжимаются сами колонки (и иногда гаттеры - пробелы между колонками). Тянутся, пока не будет преодолён брейкпоинт, меняющий дизайн и вёрстку. Страница преображается, элементы снова тянутся до следующего брейкпоинта.

Обычно по макету с направляющими/колонками сразу видно, какие элементы привязаны к колонкам - эти элементы выглядят как блоки, содержащие в себе контент.

Answer 2

[Андрей Хохлов]

Вот почитайте: https://github.com/andrey-hohlov/psd-templates-req...

Comments

[Влад]

Класс, спасибо большое)