sobaka@pavlova.cc
+7 (812) 320-57-87

Спрашивайте — ответим.

Стыдные вопросы про верстку и сетку

Собака Павлова
2018

ИНТЕРФЕЙСЫ

Все больше разговоров о том, что дизайнер должен уметь верстать, кодить, писать рекламные тексты, вышивать на печатной машинке и сушить белье взглядом. Это все мифы и легенды, хорошему специалисту хватает своей работы. Другое дело, что результат хорошо бы передавать дальше по конвейеру максимально безболезненно. А для этого — любить и знать особенности следующего этапа производства.
Анонимно собрали у коллег стыдные вопросы про верстку, для чистоты эксперимента озадачили внешнего эксперта, верстальщика Александра Аверьянова, и теперь делимся с вами.

В современном фронтенде сетки используются всегда или бывает, что и нет?

Всегда. Реализация только может быть разной, grid-ами или flexbox-ами. С точки зрения внешнего вида разницы никакой, верстка на grid позволяет располагать блоки в любом порядке и верстать довольно сложные макеты.

При ресайзе окна ресайзятся и колонки, и межколонники или бывают варианты?

По-разному. Чаще всего межколонники задаются в пикселях, сами колонки — в процентах. В адаптивной верстке при достижении какой-то ширины задаются другие значения для межколонников. В идеале, конечно, межколонники тоже должны быть в процентах.

В рамках одного адаптивного шаблона при ресайзе может измениться количество колонок или это уже изменение шаблона?

Типа того, есть базовое количество колонок, которое при уменьшении экрана может меняться, и шаблон перестраивается.

Если в макете сетка никак не размечена, что ты [верстальщик] делаешь?

Сам накладываю сетку, выбирая базовое количество колонок — 10, 12, 16.

Допустим, мы вообще не используем сетку. Можем ли мы случайно сделать такой макет, под который нормально не ляжет даже самая подходящая сетка? То есть верстальщику придется существенно его менять (размеры блоков, отступы и т. д.).

Да, если в дизайне ты не следуешь какой-то сетке, то верстальщику подобрать сетку может быть проблематично. Либо верстка будет сильно отличаться от дизайна, либо верстать нужно будет кастомно — без использования сетки. Если так задумано и должно быть в дизайне — то ок, просто будет более кастомная сетка, или придется сетку брать с большим количеством колонок, чтобы учесть все варианты.

Если в макете какой-то блок стоит не по сетке, в верстке он все равно привязан к ближайшей колонке, просто со смещением?

Да, можно блок помещать в колонку и смещать его потом, если этого требует дизайн.
* * *
Если у вас вдруг тоже есть вопросы про верстку и сетку — пишите нам на sobaka@pavlova.cc, попробуем ответить :)
27 сентября 2018
Собака Павлова
Дизайн сложных интерфейсов
Другие статьи

Нужно ли UX-проектировщику тратить время на то, чем занимаются графические дизайнеры? Если да, то зачем?

Эти вопросы задавали члены закрытой группы на «Фейсбуке», которая посвящена всякому разному диджиталу. Мы не любим закрытые сообщества, поэтому публикуем и вопросы, и ответы.

Ответы на вопросы про дизайн, которые все желающие могли задать нам абсолютно анонимно