Дизайн и верстка значимая часть проекта, которой часто пренебрегают. Закажем на фрилансе, сами сделаем, купим шаблон.
Видение
Проект должен быть пропитан единым стилем в оформлении. Если у вас нет брендбука, то скорее всего через год проект внутри и снаружи будет выглядеть как елка, которую украсили тем, что было под рукой.
Процесс
Поработав некоторое время с командой tut.by, я был удивлен их процессом изменений на сайте. Например, возникла идея передвинуть кнопку. Дизайнер делает графический макет с новым положением кнопки, после чего макет рассматривает менеджер проекта. Двигают еще раз и так далее, до момента принятия макета. Далее вступает верстальщик и программист. Бодрый программист скажет, что это долго и глупо, что можно подправить стили и все готово. Однако, такие быстрые решения приводят к коллапсу через месяцы.
Отвественность
Только один человек решает каким все должно выглядеть, при этом он обязан собирать мнения, модулировать и отсеивать по собственному вкусу. Компромисс, особенно в дизайне, играет негативную роль.
Стандарты
Если дизайнера в штате нет, для web-проекта должен быть выработан конечный набор стилей, который условно можно назвать Application Design Interface. Как известно, набор шрифтов графических элементов, шрифтов и их размеров не может быть бесконечно большим. Более того, он обязан быть бесконечно малым. Так, необходимо выработать документ, в котором будут описаны все визуальные блоки — шрифты и прочие элементы в виде таблицы соотвествия картинок (скриншотов стандартных блоков, шрифтов) и CSS классов. В coding guidlines должно быть добавлено простое правило — аттрибут style запрещен внутри HTML.
Подход в верстке
При выборе верстальщика необходимо заранее оговорить стиль, а лучше посмотреть на его работы и выбрать подходящий вариант. Все множество подходов я разделил на два типа - контекстный и ортогональный.
Контестный вариант подходит в случае, если финальная цель, вид и назначение сайта ясны, при этом все согласны, что набор функций удовлетворит потребность клиентов на несколько лет. Это относится к сайтам-визиткам, информационным сайтам. Плюсы такого подхода — очень простая структура HTML. По сути, в таком проекте может использовать не более 5 классов и идентификаторов в сумме. Минусы — отсутсвие гибкости.
Ортогональный вариант лучше подходит для активно меняющихся проектов, где новые функции идут потоком по ходу развития бизнеса. Каждый блок оформлен классом, при этом перемещение этого блока никак не скажется на внешнем виде этого блока.
Стоимость
Игнорирование стандартизации визуального оформления через 3-6 месяцев приведет к тому, что время на исправление ошибок вырастет в несколько раз, отбирая время на реализацию бизнес-требований.
Итог
- не разрешайте программистам "дизайнить" напрямую
- выработайте набор стилей для продукта, используйте только то, что есть.
- проверяйте код на отсутствие style.