Плохой и хороший верстальщики

Коля Товеровский написал про плохого верстальщика, который не в состоянии сделать как на макете, и за ним надо бегать и подсказывать ему, какой именно цвет или отступ нужно использовать.

Но сделать точно как в макете — это самое базовое и примитивное умение. Без него вообще говорить не о чем, но его недостаточно, чтобы считать верстальщика хорошим. Хороший верстальщик умеет делать не как в макете, а как надо.

В макете могут быть ошибки. Например, пока рисовали главную страницу, делали отступ между абзацами текста 9 пикселей. А когда стали рисовать страницу «О компании», подумали, что 10 будет смотреться получше. Правда, в одном сквозном для всего сайта блоке забыли исправить, и там осталось 9. Но в тексте на полях отступ всего 7 пикселей, и это так специально, потому что колонка у́же. А ещё в одном месте у дизайнера дрогнула рука, и между абзацами 12 пикселей.

Если верстальщик молча сверстает страницу «О компании» как на макете, то есть оставив отступ где-то 9, где-то 10, где-то 7, а где-то 12 пикселей, работать с ним нельзя.

Если верстальщик молча везде поставит 10 и забьёт на разницу в макете, работать с ним тоже нельзя.

Нормальный верстальщик сразу видит всю эту разницу и приходит к дизайнеру с вопросом: «в макете у тебя везде разные отступы между абзацами, как правильно?».

А хороший верстальщик приходит со свёрстанным макетом. Между абзацами и на главной, и в «О компании» отступ 10 пикселей, а на полях — 7 пикселей. Ссылку на свёрстанный макет он сопровождает письмом:

У тебя в макете везде разные отступы между абзацами. Я поставил везде 10, потому что так в последнем макете. Предположил, что между последним и предпоследним абзацем ошибка (там 12). На полях оставил 7 как в макете — видимо так задумано.

Кстати, у нас же в мобильной версии то, что было на полях, переезжает в основную колонку. Я в этом случае там тоже врубаю 10 для единообразия.

Посмотри плиз и скажи, что где неправильно.

Дальше
19 комментариев
Vladimir Obrizan 2018

Илья, как вы боритесь с тем, что в Sketch растеризация шрифтов одним алгоритмом, а в браузере другим? Что в Sketch один color profile, а в браузере и ОС другой? Четкого совпадения пиксель-в-пиксель может и не получится.

Nikolay Frantsev 2018

Профессия верстальщика мертва, сегодня вёрсткой в большинстве случаев занимаются те же программисты, которые пишут помимо вёрстки ещё горы клиентской бизнес логики. Если вы не объяснили программисту логику ваших отступов, а при этом ещё и рука ваша дрожит сильно чаще, чем 1 раз на странице, то получите везде 10 пикселей, т. к. для программиста это по крайней мере логично. Я даже не беру в учёт ситуацию, что отступы у программиста могут быть выражены не в магических числах, а в читаемых и логически понятных константых.

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

Вывод: вместо навешивания меток плохой/хороший, нужно изначально договариваться совместо о формате работы, уважать особенности и опыт работы друг друга.

Андрей Коряковцев 2018

Илюша, вы — мудак?
Какие нафиг 7 или 9 пикселей?
В каком месте рендер субпикскльное сглаживание сделает?
Зачем оправдывать дизайнера — мудака?
Где работа от базовых величин?
Многие работают через 10px = 1rem и счастливы.
А, в случае, когда дизайнер одной рукой дрочит, а второй рисует макет и получает 7, 9, 10 и 12 — работать не стоит с таким дизайнером. Пользователю 2 пикселя счастья не принесут, а стили разработчик засрет.

Leonid Frolov 2018

Какой же ты дрочила

Alex 2018

Илья тут описал не хорошего и плохого верстальщиков, а дизайнера-мудака, который понаделал везде разных отступов, ничего не объяснил и ждет, что верстальщик догадается, где его Гениальный™ Замысел®, а где ошибка. А еще этот дизайнер при каждом расхождении с макетом будет неистово голосить: «Делай как на макете!!! Если не можешь — с тобой работать нельзя!!! Это базовый навык, без него даже говорить не о чем!!!»

NAVINWEB 2018

сделать точно как в макете — это самое базовое и примитивное умение.
@@@
Если верстальщик молча сверстает страницу «О компании» как на макете, то есть оставив отступ где-то 9, где-то 10, где-то 7, а где-то 12 пикселей, работать с ним нельзя.

???
Дядь, ты подумай еще раз пожалуйста.

Илья Бирман 2018

Не вижу противоречия.

Nick McKey 2018

NAVINWEB
Уметь базовые вещи ≠ действовать на выходя за рамки базы. Может тебе, дядя, думать научиться?)

Alex
Когда дизайнер считает заказчика мудаком, но по факту мудак дизайнер. Это экстраполируется и на связь дизайнер-верстальщик.
Нежелание вникать и узость кругозора. Будет неистово голосить — объясняешь, что поддерживать сложнее, ритм страдает. EASY BOY!)

Андрюша, читай выше, и завязывай с письмом. Слог плох. Мысли однобокие, прокисшие.

Kink Ardshock 2018

Все так любят обсуждать «плохих» и «хороших» верстальщиков. Но если верстальщики начнут писать про дизайнеров-космонавтов, то боюсь, что интернета не хватит...

pupiniaaa 2018

До, точно. Видишь что в макете разные отступы, делаешь специально «как в макете», а потом саркастично пишешь что дизайнер то МУДАК)) Хотя можно было подойти к дизайнеру, хлопнуть по плечу и сказать — «Дружище, там отступы гуляют, какие оставить?»

Maxim Girchenko 2018

Следуя вашей логике, если у дизайнера, один и тот же отступ 7, 9, 10 и 12, то работать с ним нельзя, а если он ещё начинает требовать какого-то соблюдения макета, то можно и огрести.

Maxim Girchenko 2018

И да, если дизайнер на вопрос — А что будет с этим элементом на адаптиве, говорит — А я откуда знаю, ты верстальщик, ты и делай, и на вопрос — Зачем тут этот элемент, отвечает — Ну место было, или например — Ну а куда его? То с ним абсолютно точно работать нельзя! Времена тупеньких пеньочков прошли! Нужно думать, что зачем и где, и какую проблему это решает!!!

Nick McKey 2018

Максим, абсолютно верно. Тупых дизайнеров здесь никто не оправдывает, речь о верстальщиках.
Pupiniaaa респект, именно об этом и пишет Илья!

Kink Ardshok, кто все? Пусть пишут, обсудим, дизайнеров-мудаков тоже надо учить.
А вообще, манипуляции с преувеличением, аргументы в стиле «а у других-то ещё хуже» — уровень детского сада.

Anatolii Moldovanov 2018

«Сверстал как в макете» (редкость вообще) — работать с ним нельзя.
«Взял отступ на свой вкус, учитывая что они гуляют по всему макету» — работать с ним тоже нельзя

Следуя вашей логики, с дизайнером, который делает ошибки работать можно? Или для вас время дизайнера ценнее времени front-end разработчика? При таком отношении это не вы с верстальщиком работать не будет, а скорее он прекратит с вами сотрудничество.

В нормальной команде, когда ни о кого не завышено ЧСВ такие проблемы решаются спокойно и без конфликтов.

Ульян 2018

Я сейчас кое о чем подумал, Илья, догадайся, пожалуйста. Не можешь? С ТОБОЙ НЕЛЬЗЯ РАБОТАТЬ КАК ТАК МОЖНО ТО ГОСПОДИ БОЖЕ МОЙ

Иван Метелёв 2018

Помимо отступов на 10 и 7 нормальный верстальщик также проверит, что отступ от заголовка до текста будет не меньше, чем абзацный, но меньше, чем от текста до заголовка. В сопроводительном письме от также допишет: «я сделал 10 и 7, но лучше бы свести всё к четным значениям, а еще лучше к микромодулю в 4, чтобы не потерять общий ритм».
Если верстальщик не нормальный, а «точный», то на поддержке потом будет непросто.

Александр 2018

П**дить лопатой нада таких «малювальників» в которых отступать гуляют, и потом за них нужно их же ошибки исправлять. А если дизайнер на удаленке и контактов вообще нет? кого тогда «по плечу хлопать»? Или писать письмо и ждать пару дней пока их «величество» cоизволит ответить почему там на 2px меньше. Нужно сразу обсуждать спорные моменты и обходиться без сопроводительных писем.

Ирина Лещукова 2018

А почему верстальщик не может уточнить у дизайнера эти моменты перед началом работ? Тогда не придется верстать «не по макету». Как ни крути, отступление от макета для верстальщика недопустимо.
Если перевести ваш пример в другую область, то получается примерно так. Доктор выписал рецепт, по которому нужно пить 2 мл лекарства. Пациент читает справочники, форумы и выясняет, то вроде бы лучше пить 3 мл, а не 2. Выпивает 3 мл и пишет врачу: «Я подумал что вы ошиблись и выпил не 2, а 3 мл лекарства.»

Евгений 2018

то есть никто не заметил, что практической нагрузки от статьи — ноль?)))

Sergey Novac 2019

Anatolii Moldovanov +++

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

Мои книги