Верстальщики и программеры, продолжение

Из прошлого поста о верстальщиках и программерах могло сложиться (и у некоторых, судя по переписке, сложилось) неправильное впечатление: да, я писала о кривом коде, порождаемом визуальными редакторами, да, я недоумевала – как же так, не ВасиПупкины, не начинающие веб-дизайнеры — вполне себе сложившиеся программисты, и вдруг – режим Design в VisualStudio для быстрого создания типовых форм. Но ведь и фраза “а что, у нас программеры уже напрочь ручками код перестали писать?” не имеет ничего общего с рекомендациями “писать” в блокноте, ни разу. И более того, когда касается не программирования, а вёрстки – своим ребятам я категорически запрещаю верстать в notpad`e, а программерам я вообще не указ. Просто – чем больше проект, тем меньше работы для дизайнера и верстальщика в проекте (когда уже написана общая таблица стилей, уделить пять минут тюнингу новой части сервиса — когда продумана и разработана концепция иконочек, маркеров и прочих фишечек, нарисовать новую козявочку — никакой сложности), но тем больше работы, связанной с тем, что ломается и “едет” дизайн после того, как программер поработал с проектом.

И здесь работа не для тестировщика, ему-то что, он таск отправил – что видит, о том и написал. А техническому дизайнеру – разгадывать шарады, почему что-то куда-то уехало. На днях звонит канадский программер, говорит — “я там ничего такого особого не делал… а блок с прелоадером (очередная крутящаяся козявочка с надписью “Loading…”), которая показывалась всегда в центре экрана, уехала в левый верхний угол“. Что делает дизайнер? Правильно, ломится проверять таблицу стилей – вдруг где-то правила сбились, вдруг где-то и в самом деле неграмотно написано… вроде всё честно. Ломится в код – бывало такое, когда программер добавлял контейнер (div) в код “не правильно”, а где ему показалось удобнее, но в коде тоже всё корректно. В чём глюк, разумеется, нашла – раньше прелоадер показывался на довольно простых условиях, когда генерилась таблица статистики, или подгружались ещё какие-то объёмы данных; но сейчас сценарии усложнились, и блок с картинкой (с тем же, как бы, идентификатором) программеру пришлось сделать серверным контролом. Т.е. с динамически создаваемым именем идентификатора. Т.е. правила, в соответствии с которыми прелоадер показывался в центре экрана, правила, которые назначались блоку по имени идентификатора, больше не применяются – имя-то меняется.

Здесь моей работы-то было понты – найти в чём прикол и рассказать, что нужно сделать переменную, в которую передавать имя, и уже этой переменной назначать правила. Порешали. Но найти дизайнеру эту “ошибку визуального дизайна” не всегда бывает легко. Или вчерашнее: явно визуальный глюк. вылазят данные за декоративные границы блока. Как не кручу, как не экспериментирую с правилами в стилях или с вёрсткой – вылазят, гады, и всё тут. И, вроде, дизайнерская проблема… убила некоторое время на этот блок, кода на странице – больше 20 экранов, случайно обнаружила, что появился какой-то странный идентификатор в контейнере… имя явно не я давала, да и ID в моих контейнерах стараюсь не пользовать без особой нужды, а IDшники программерские по ходу всё равно большей частью динамические, я на них стараюсь и внимания не обращать (т.е. не обращаться по этим именам к блокам со своими .css правилами). Задаю поиск по всему проекту – кто и где использует это имя… Точно. Обнаруживаю в скриптовом файле обращение по этому id, и там идёт переназначение размеров блоку. Зачем это понадобилось – уже никто не помнит, но точно понадобилось ещё где-то в сентябре месяце, когда проект был значительно проще, и в этот блок информация выводилась линейная (а сейчас в зависимости от условий – 4 разные формы и на ещё две на сайте написано COMING SOON). Ага, очень дизайнерский “визуальный баг”. И такое – постоянно, ежедневно, в порядке вещей, да, подобными глюками у нас занимается дизайнер. А у вас?

Но тема из позапрошлой заметки была совсем о другом. Я, конечно, понимаю, что у VS и (помните ещё такого) уродского FrontPage одни родители; ожидать от режима “Design” чего-то другого было бы даже странно. Но вы представляете себе преогромный проект, да ещё и такой, где на каждой .aspx странице 90% кода визуализируются не сразу, а в зависимости от условий, а ещё на некоторые можно попасть (уже) только под реальными логином/паролем, да ещё и транзакцию провести – тестировать и обнаруживать ЕЖЕДНЕВНО визуальные глюки с самопрописанными размерами контейнеров, потому что продвинутые программисты в этом самом режиме “Design” очередной раз неаккуратно кликнули+дёрнули что-то мышкой? Или когда ещё один продвинутый программист написал минимодуль на странице, и скопировал туда копи-пастом из этого же режима контент, а потом они сутки меня ждали, чтобы я нашла, почему “расползлось” и при клике на крестике блок не показывается как должен по сценарию, а до этого минимодуля этот же блок нормально работал и показывался? А оказалось, что программер не посмотрел в коде – нужная информация была обрамлена в ОПРЕДЕЛЁННЫЙ контейнер с явно заданным именем идентификатора, по которому и скрывался-показывался. Т.е идентификатор с блоком просто потерял. Нашла, поправила, заработало. Но сам факт.

В комментах некий Евгений написал странный отзыв: “Ага, правильно, пускай программисты и за тебя работу делают, а ты будешь просто зарплату получать.” Мне бы очень хотелось, чтобы мне автор отзыва или другие программисты прояснили – что этими чудесными словами человек хотел мне сказать? Что есть две касты участников проекта – программисты (высшая каста) и дизайнеры (низшая), и что программисты, как высшая каста, имеют право работать в режиме Design, плодить для ПРОСТЕЙШИХ форм десяток вложенных друг в друга таблиц, терять свои же идентификаторы (что приводит к визуальным глюкам, которые решать, разумеется, должны дизайнеры) и ежедневно каждый на своей части проекта развлекаться и менять размеры контейнеро, участвующих в коде, а дизайнеры (низшая каста) должны работать уже с кодом, и за ними так же ежедневно ходить и делать одну и ту же работу про проверке – а что у нас тут “само” прописалось в коде на этот раз? Это правильно, это работа дизайнера? А слова “программисты и за тебя работу делать” – это в смысле, что если они не будут привносить мусорный код в документы, то это для них и будет “работать за дизайнера”?

В общем, всё не так плохо. Есть у нас программеры, с которыми я работаю уже не первый, и не второй год. И, кажется, с некоторыми даже не третий. Описанная выше проблема их не касается. С ними старая договорённость – да кидайте вы ваши серверные контролы В СТОЛБИК, и пишите свою логику дальше. Я заберу (через SVN), оформлю формы на высшем уровне. И работать с ними проще, и работы меньше, и глюков (почти) не бывает. Так где здесь они делают за меня мою работу?

А что касается дизайнеров (технических), то… я в самом деле запретила им верстать в нотпаде. Один паренёк долго сопротивлялся… Но там какие-то странные приципы и убеждения, вера в авторитеты (в его случае в совершенство ALS) и брезгливое отношение ко всем без исключения средствам разработки, предназначенных :) для разработки. Только код у него был… ну, в общем, как бы это помягче сказать… дело не в том, что сложнотабличное макетирование, дело даже не в постоянном мусоре и опечатках, дело в том, что человечку этому, видимо, совсем не надо вёрсткой заниматься – не видит он макета. Не умеет анализировать. Не логичная вёрстка. Какая там семантика. И вот интересно – такую же вёрстку можно было бы забабахать тем же FrontPage`м – так чем здесь гордиться? В общем, и у нас он не задержался (у нас были другие требования к вёрстке), и в следующей конторе тоже (именно за неряшливую вёрстку). Славный паренёк, но ему бы лучше только визуальным дизайном заниматься, необычным (где нет требований к юзабилити), эксклюзивным. Я бы порекомендовала посмотреть в сторону полиграфической рекламы. Или даже видео.

Но я не об этом. О том, что сама воспитанная на Macromedia HomeSite (помните такого чудика?) – до сих пор простую вёрстку в оном собираю. Но уже тесно – многих сервисов для кода у него нет и, понятное дело, уже не будет. Когда-то, в давние времена, приходилось верстать очень-преочень много “текстов” – там только абзацы-списки-картинки-ссылки, редко когда было более сложное макетирование. В хомсайте у меня были забиты функциональные клавиши на все сколько-нибудь однотипные операции, потому получалось быстро. Дизайнерам, дабы не мудрствовать и не изгаляться, предложила юзать DW, как наиболее на сегодняшний день гибкий для вёрстки кода и css (и в перспективе – не кинут, как HS) – не только подсветка кода (под почти все наши технологии), но и подсказки, не только для тегов, но и для css, работает с любыми кодировками включая уникод (в отличие от HS), только в режим Design не переключайтесь, говорю, на всякий случай, дабы не привыкать и впредь не повадно было :) А в той же VS, кстати, совершенно замечательнейший редактор кода! И очень удобное, очень преудобнейшее сворачивание контейнеров – как ни где в другом редакторе, не знаю почему. И подсветка парных тегов (наступил на тег из пары – можно в коде видеть где его пара. Или – что пару потеряли, тоже частая проблема). Ага, вот на страницах, где, как выше было написано, больше 20 экранов кода, только это и спасает.

В общем, даже для быстрого редактирования какого-то, пусть даже простого кода, я рекомендую пользовать продвинутые редакторы, потому что знаю, что пройдёт ещё много времени, прежде чем верстальщик сможет сказать о себе, что он профи, что он код чувствует, что у него гарантированно не возникнет ситуации, что открыл один тег, а закрыл другой, или вообще потерял закрывающий. Пока он досконально выучит весь синтаксис, как xhtml, так и css, чтобы не пихать (Жень, помнишь, сколько ругала?) за использование несуществующих атрибутов (а продвинутый редактор верстальщику это подскажет, подсказывая в теге только теми атрибутами, которые у этого тега есть), пока он научится анализировать макеты, чтобы создавать оптимальный код шаблона, чтобы не приходилось сидеть и показывать то, что мне было видно сразу – почему этот последний макет пришлось перевёрстывать и где было продумано, что часть кода уйдёт в шаблон, часть – в динамические контролы, а часть будет уже рабочим контентом?

Опять многа букоф? Ок, я молчу, теперь слово за вами. А как у вас? А что у вас? А как вы вообще?

Эта запись была опубликована в рубрике дизайн, офисное и отмечена метками , , , , , , , , . Добавить в закладки ссылку.

5 в ответ на Верстальщики и программеры, продолжение:

  1. Zigzag пишет:

    Да, Татьяна, были времена HS, с трепетом их вспоминаю! =) Работал тогда в связке HS+TS. Сейчас все пишу в NP++, мега удобный и мегашустрый редактор. Кроме того, он постоянно обновляется и динамично развивается.

    ПО поводу форма я аналогично прошу делать программеров, т.е. они в столбик через br выставляют все, а я уже правила пишу.

    По поводу опыта верстальщика. Да, нужны годы!!! Я все еще учусь, но когда в итоге становишься профи, переключаешься на более высокие материи уже =). Так случилось и с Максом Россомахиным, анпример, и с Вадмом Макеевым, да и я уже, как и они, не то что поглядываю в сторону ИА, юзабилити, проектирования интерфейсов, а вполне серьезно взялся за изучение этих тем.

  2. Junior пишет:

    …в сторону ИА, юзабилити, проектирования интерфейсов

    Хм, та же история :)
    Верстка -> простой дизайн -> прототипы -> ИА -> юзабилити -> простой (но уже осмысленный) дизайн :)

    Татьяна, могу порекомендовать взглянуть на HTMLPad 2006. Умеет все, что и HS5.5 и даже кое-что особенно интересное — свои куски кода по своим комбинациям со вставкой курсора в нужное место.
    Верстка стандартных вещей идет пулей, не говоря уже о контенте. ;)

    p.s. И уж куда как дешевле DW.

    • nundesign пишет:

      Тут прикол в том, что для меня лично нет большой разницы — в чём верстать, да и не о том заметка. Наши большие проекты, сервисы, которые пишутся на дотнете, я ВСЁ РАВНО буду верстать-довёрстывать, адаптация и правки плодящихся ошибок, всё это я буду делать в Visual Studio, такая особенность, тут без моих уже предпочтений.

      А программку поищу-взгляну, в самом деле интересно. Но интересны функции, приведенные в заметке: подсветка парного тега, удобное (!) схлопывание и расхлопывание содержимого пары, подсказки по атрибутам тегов и по значениям css в соответствии с указанным доктайпом.

Оставить комментарий

Ваш email не будет опубликован. Обязательные поля отмечены *

*

Вы можете использовать это HTMLтеги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>