Как работать с верстальщиком и контролировать его

О том, как работать с верстальщиками аутсорсерами при разовых заказах.

Всё это надо обсудить сразу, т.к. если начать контролировать в процессе работы, то это воспринимается как «недоверие», «нажим» и т.п.

  1. Сразу договориться, что файлы вёрстки всегда доступны! Например верстальщик может править файлы в папке, которая автоматом синхронизируется с dropbox/google disk. Это позволяет контролировать прогресс разработки. Если не dropbox/GD, то какая-нибудь CVS, чтобы можно было смотреть diff между коммитами и понимать, что было сделано за конкретный период.
  2. Если вёрстка должна быть протестирована в нескольких браузерах, то нужны скриншоты процесса тестирования. Во-первых они подтверждают, что тестирование в разных версиях действительно было, а во-вторых можно самому наложить скриншоты в фотошопе один на другой с прозрачностью и посмотреть, есть ли отличия и в чём они.
    Т.е. на выходе index_IE9.jpg, index_FF.jpg, secondpage_IE9.jpg, secondpage_FF.jpg и т.д.
  3. Если не хочется пускать всех подряд в таск менеджер, то заводим 2 документа в Google Docs:
    1. «Список ошибок».markup-bugs
      Поля, у которых шапка с голубым фоном, может редактировать только заказчик (делается через «Защита диапазона»).
      Поля с оранжевой шапкой может редактировать верстальщик.
      Поля A,B,C имеют фиксированные диапазоны значений (делается через «Проверка данных» по типу ENUM поля в базе).
      Поле D меняет фон в зависимости от значений других полей (настраивается через «Условное форматирование» как на этом скриншоте)
    2. «Сроки сдачи макетов».
      dedline Что и кто может редактировать — аналогично списку ошибок. На полях с выпадающими списками — стоит проверка данных.
      Поля A,B,C раскрашены так (условие в последнем инпуте =AND(TODAY()>D1; NOT(ISBLANK(A1)); NOT(ISBLANK(D1)))  )
      Поле D раскрашено так (условие =AND(NOT(ISBLANK(A1)); ISBLANK(D1))   )

Что проверяем при сдаче

  1. Смотрим в разных браузерах и OS (винда и мак). (Если верстальщик верстает под мак, то часто в FF под виндовс появляются разные юникод символы в конце слов или строк)
  2. Смотрим в планшете и телефоне (что-то может не нажиматься, не работать выпадашки, проблемы при зуме, неправильное позиционирование overlay у попапов и т.п.)
  3. Смотрим метатеги. Метатеги для CEO, для соцсетей, верификационные.
  4. Проверяем валидатором HTML и CSS
  5. Нормально ли разбито на блоки, чтобы потом можно было резать вёрстку на шаблоны виджетов
  6. Проверяем относительные/абсолютные url() в CSS (потом могут быть неожиданности)
  7. Наличие .psd для спрайтов

Что придётся доделать

  1. Делаем минифицированные версии JS, CSS. Возможно понадобится оптимизировать PNG.
  2. Вставляем счётчики гугл, яндекс и т.п.
  3. Добавляем метатеги. Метатеги для CEO, для соцсетей, верификационные.

Как работать с верстальщиком и контролировать его: 3 комментария

  1. > Делаем минифицированные версии JS, CSS
    ..и не забываем удалить первоначальные файлы!
    Bravo!

  2. Здравствуйте! Все перечисленные проблемы не от дизайнера или верстальщика, а от того кто требует чтобы сайт был 1 в 1 с дизайном, и не слушает что дизайнер просто на глаз сюда воткнул заголовок, а посередине это то как сейчас на сайте.

Добавить комментарий

Ваш e-mail не будет опубликован.