Дела сайтостроительские. Разработка
Недавно один из наших программеров в личке поделился сокровенным: оказывается во многих софтконторах, где уровень проектов плюс-минус приближен к нашему, одно из важных требований к программерам - обязательное знание html (xhtml)+css на достаточно глобальном уровне! Надо же… Раньше на эту тему никто у нас и не задумывался, а тут вдруг попёрло что-то, да ещё и подхлёстывается неожиданными дискуссиями в тему “разделения/распределения обязанностей”.
У наших программеров (.NET) такого требования не было и на собеседованиях никто ничего по теме вёрстке у них не спрашивал - основная среда разработки - M$VS, и знания тестировались только возвышенно-программерские. Вёрстку, как следствие, в большинстве своём публика знает только в первом приближении, и в том случае, когда начинается работа с интерфейсом и публике всё же приходится свои рабочие контролы как-то размещать на странице, они городят совершенно безумный код, разумеется, не ручками, а в режиме “design” - этого лучше не видеть, скажу только, что, когда я получаю в работу очередную страницу, основное время уходит на удаление всего того кода, который там предусмотрительно набодяжен.
Клиенты ныне настолько разбалованные аяксом, что требования к интерфейсам (во всяком случае служебным интерфейсам на сервисы) у них довольно масштабные, посему в конторе очень много используют как готовых решений типа telerik, RadControl и иже. Деревья, закладки (имитация виндовых “табов”), хитрые “комбобоксы” с расширенной функциональностью и прочее, и прочее. Иногда прокатывает - просто взять готовое и - напильником (в том числе и визуал), иногда так складывается, что напильником приходится из подводной лодки допиливать реактивный самолёт, и, оценив масштаб /когда готовый контрол доработать теоретически реально, но, для узкой задачи он, с одной стороны, является избыточным и тяжеловесным, с другой стороны - ковыряться детальнейше в больших объёмах чужого кода - то ещё удовольствие/, принимаем решение делать свой контрол (но на это понадобится, к примеру, один рабочий день. Как правило это самое трудное - выбить этот самый один рабочий день).
Недавно, почти довёв до совершенства RadControls Tabstrip`овские закладки под поставленную задачу наткнулись, что как раз незатейливую заказанную клиентом фичечку реализовать просто не получается, контрол же сам по себе - ничего военного, со всем напором юношеского энтузиазма убедили руководство выделить для работы нам время, и сели с программером его сочинять. Я ему прикинула модель тегов, расписала, где нужны будут идентификаторы и где куда мне генерить какие именованные классы (разумеется, использовали в разметке двухуровневые ненумерованные списки) , и какими спанами куда и что обрамить (первоуровневые элементы по событиям визуально становятся похожи на закладки же ж со сглаженными краями, но при этом ПРОИЗВОЛЬНОЙ ШИРИНЫ). Дальше была разделённая работа - я писала таблицу стилей, программер - логику выгребания из xml имён первого уровня, второго уровня, да в зависимости от определённого при авторизации статуса юзера, да… короче, написали. Супер получилось. Вот кстати тогда он и поделился информацией (с ужасом, как мне показалось), что в некоторых фирмах подобные контролы пишутся программерами при НЕЗНАЧИТЕЛЬНОЙ дизайнерской поддержке (ну, там, придумать-нарисовать эти самые картинки на закладки и, возможно, порезать их же).
А мне подумалось, что как раз легче работать “в паре” с теми программистами, которые не заморачиваясь вообще на “размещение” их рабочих контролов на странице кидают их… в столбик на голую страницу. Так кст. говоря, легче, проще и быстрее. Хотя - признаю, всё не так плохо, и программеры часто подходят с вопросами по вёрстке и стилям, и (не часто, но всё же) иногда что-нибудь не сложное пишут сами (предупреждая вежливо, что вот создали класс и описание его закинули в .css файл, ничего? Имя нормальное? описание не безграмотное? Ничего, говорю, нормально-красиво-до-стерильности-сама-доведу).
А хуже мне с моими дизайнерами. Как-то почти месяц назад с одним из чуть конфлик не возник. Что-то он там недодоговорился про оплату, закапризничал, типа оценивает свои знания выше. В общем то не важно, там отчасти сам парень прорастяпился, юный ещё, несерьёзный, как дитё малое, отчасти руководство “таке затуркане, таке затуркане”, но то не о том речь. А о том, что в начале недели я собрала тех дизайнеров, которые типа “технические”, в общем, верстальщики, и по оценке их труда за месяц честно им сообщила: ребята, верстать вы нифига не умеете. Не умеете. И, благо, работа им на первое время была не сложная и малоответственная (и малокомандная опять же - что тоже имеет значение) - дофига пятистраничных сайтов с практически похожей структурой (модульной сеткой и типовыми страницами). Рисующие рисовали, верстающие за ними верстали. Писала о начале их творческой жизни здесь и здесь. Посчитала я, что такая не особо ответственная и простая (html-ная) вёрстка - самое то, что нужно новичкам на раскачку. Но уже, когда проводилась работа над ошибками (с каждым из), мягко говоря, была под впечатлением.
И я не против, когда разработчик хочет себе высокую оплату своего труда, и сама убеждаю руководство, что платить надо больше, и меня, разумеется, радует, что учиться они всё-таки хотят, только реально учатся пока медленно почему-то, но повторять стопятый раз фразы типа “у таблицы нет атрибута valign!” “что опять делает padding в стиле картинки? Создаёт поле от картинки до неё же?” “опять незакрытые теги! Опять не закрыты картинки, br`ы, но ладно, здесь просто обучиться. Но абзацы-то, абзацы мы научимся закрывать?” Я уж не говорю про лекции о семантике и логике, обычной логике. Ладно один из верстальщиков (оправдываясь, обиделся) говорит “я же говорил, что ещё не освоил дивную вёрстку и буду верстать пока таблицами, вы же разрешили!” - Б-блин. Да. Подтверждаю. Разрешила. Сделать колоночный макет таблицей. Но.Напрудить мне десяток (а в целом - 24) вложенных таблиц для того, чтобы РАЗМЕТИТЬ В ОДНОЙ СТРОКЕ ПЯТЬ ЗАГОЛОВКОВ И ПЯТЬ СТРОЧЕК ТЕКСТА вложенными таблицами - это уже не имеет отношение к дивной вёрстке, это, извиняюсь, имеет отношение к ОСНОВАМ HTML и ОСНОВАМ ЗДРАВОГО СМЫСЛА, будут они обижаться или нет. Ок, разобрали с ним вёрстку на примере того, что делал он и того, что переделывала я (не изменив своего обещания разрешить таблицу для колоночного макета, свести весь макет из 24 таблиц к одной), отметили те атрибуты, которые просто являются ошибкой (т.к. не существуют и не работают), те атрибуты и теги, которые являются логической ошибкой (т.е. нарушают логику документа и, как следствие, усложняют вёрстку, прежде всего из-за непредсказуемости ошибок, хрен найдёшь потом почему у него что-то куда-то уползло), и те, которые в целом написаны верно *(с т. зр. логики вёрстки), но избыточно, т.е. код, который в оптимизированном виде использовать проще, да оно и нагляднее получается с т.зр. читабельности всего созданного филе другим разработчиком или даже этим, скажем, через недельку.
Со вторым там всё ещё более запущено. Меня, конечно, безмерно радует энтузиазм, желание быстрее научиться и делать правильно, но ошибки, которые генерит второй, пугают больше. Сами понимаете, если верстальщик не закрыл, к примеру, абзац, большого горя он никому не принёс. А вот если какой-то рульный контейнер (div), описание которого задаёт поведение всех дочерних объектов, а потом пол дня ищет, почему у него всё разъезжается, или ещё хуже, делает плавающую модель и удивляется, почему соскакивает блок (не понимаю, говорит, почему, я же размеры линейкой из макета в фотошопе снимаю!), а обнаруживается, что родительскому объекту задан фиксированный width (ой, а откуда это? я этого не писал! это DW сам прописывает!) потому что в режиме “Design” в DW он где-то как-то за что-то потянул, а потом в коде не проверил… и.. ой, ну там короче много всего, больше похожего на анекдот (я почти уверена, что он не издевается, что он не специально).
В общем получается, что на большие дотнетовские проекты вывести ни одного из них не могу. Для примера показывала им среду VS, объясняла, что валидатор должен быть включен у всех программистов, но если на одну программерскую ошибку валидатор станет выдавать двести ошибок вёрстки дизайнерской, то это… несколько усложнит работу над проектом в целом… и отношение к такому усложнившему работу дизайнеру будет даже не с профессиональной т.зр., а с чисто человеческой, отнюдь не суперским. Ещё тёмную устроят. Шутка.
Заодно пришлось подгонять откровенным шантажом. Объяснять одну простую тупую вещь. Если я из одного проекта в другой буду каждый вечер сидеть до десяти вечера в офисе и ПЕРЕДЕЛЫВАТЬ работу, набодяженную нашими капризными и такими требовательными к уровню зарплаты труженниками веб-девелопмента, то нафиг надо тратить фирме зарплатный фонд на поддержку их капризов? Я согласна на премиальные, сделаю сама, как и раньше - когда я одна работала, в целом работы, может быть, было и поменьше, но не в шесть раз, точно не в шесть, и - успевала, тяжело было, но хотя бы контролируемо (хочешь сделать хорошо, сделай это сам!)
Тут я, разумеется, лукавила. Потому что даже послеотпускной трёхнедельный дедлайн в августе-начале сентября, когда надо было, и сделали, и круто, и зарплату подняли, и сверхурочные заплатили, и премию, и казалось бы - с чего бы мне быть недовольной? А вот с чего. Нафиг такие напряги. Здоровье подорвало, бессонницы начались, приступы странные с вызовом скорой в офис, с мужем проблемы слёзные, хозяйки мол дома нет - не в деньгах ведь счастие, так?
Всё, что вы здесь пишите, больше похоже на кошмарный сон. Одним словом, тихий ужас.
В конце концов закидайте их ссылками на вебмаскон и подобные ему ресурсы с вечерним пересказом прочитанного за день.
Искренне желаю вам выучить ваших утят и сосредоточиться на себе любимой
Тяжело с молодыми, растет мастерство - растут амбиции - снижается критический порог оценки своего труда. А понимание того, что “хороший парень - это еще не профессия” к хорошим парням приходит лет через 5-7 не самого легкого труда.
Это проблема всех работодателей - берешь опытных - брюзжат и требуют много денег, берешь молодняк - жалуются что их прессуют и требуют внимания, ах да - и денег канешна
А вот и не надо было разрешать. «Пусти свиню під стіл, то вона на стіл вилізе»…
Лучше всего — «пока не освоишь дивную верстку, не освоишь и зарплату».
В одном крупном проекте, где мне довелось участвовать, порядок был “программист накидывает контролы, затем верстальщик оформляет страницу”. Довольно удобно, пока не сталкиваешься с тем, что до верстальщика (меня, например) страница доходит через месяц после “сдачи” программистом, а там некоторые непонятки… Типа у нас пейджинг делается списком ссылок, а программисту было куда удобнее сделать его кнопками. Он и сделал. Свято веря в то, что мы волшебники - ведь можем же сделать ссылку “кнопкой”, значит и наоборот не проблема. Потом оба мучаемся, перелопачивая код.
Некоторое время (очень короткое) мы пробовали наверстывать страницы и отдавать их программистам, чтобы они сразу “готовые” делали. Так оказалось гораздо хуже. Они приходили в ужас от количества кода и дело стопорилось.
В итоге сложилось так - чуть малейший вопрос по HTML’ю у программистов, они идут к нам в гости за уточнениями. Мы получаем “контролы в столбик”, а если кто из программистов перфекционист - то он тихо приходит за личными консультациями и выдает странички немного “раскрашеные” инлайновыми стилями и с раскидаными блоками для наглядности (в первую очередь - для него). От таблиц такие перфекционисты отучились сами, и крайне быстро - просто от нелюбви к большому количеству кода (когда им показали замену).
Правда, отношения у нас были хорошие. Нам (верстальщикам) льстило их восхищение финальными страничками, а мы, в свою очередь, под их чутким руководством осваивали основы JSP (поскольку ни один до этого проекта данного зверя в глаза не видел).
Но с вами две значительные разницы - Java, а не .NET (и практически никаких готовых контролов) и много времени…
>ведь можем же сделать ссылку “кнопкой”, значит и наоборот не проблема.
Fenrir, вы здорово поняли проблему, гораздо ближе к теме, чем многие читатели; оформить ссылку кнопкой или кнопку визуально типа ссылкой большой проблемы нет, но в конечном счёте у нас похоже выходит - контролы в столбик раскидываются вёрсткой и базовой таблицей стилей, а прочий тюнинг - уже совместно с порграммерами по ходу дела.
Причём были большие проекты и на Java, это последний год в офисе основная технология - .NET. Как-то сделали довольно значительный сервис, работали в паре с программером, идеально просто сработались, и это не смотря на то, что работали удалённо, необходимые переговоры по каждой странице отдельно - по аське. Это было легче и, честно говоря, профессиональнее, чем сейчас в офисе с asp-шниками.
Просто такая знакомая проблема
А “сработаться” могут только “совместимые” люди, по-моему… Вот на днях не получилось с удаленным дизайнером. Да и в офисе с ним, скорее всего, можно будет работать в паре только каждые 15 минут заглядывая через плечо. Так что если человеку все равно, работать с ним тяжко.
На тему таких “верстальщиков” - перед тем, как лезть в код, прогнать валидатором. Хоть один warning - тут же отдавать обратно, не проверяя. Тоже шантаж, но эффективный. Против 24 таблиц, правда, не поможет… Тут, если есть хоть мизерный запас времени, тоже не принимать, пока не переделает. Пять итераций доведут до белого каления кого угодно. И если он самом деле не собирается учиться - уйдет. Тоже, конечно, не хорошо, но и регулярные марафоны по переделке - не подарок.
Тут суть в чём: мне бы хотелось, чтобы они поняли логику разметки. Увидели эту самую семантику. Тогда для того, чтобы отверстать пять строчек текста, им не понадобится шесть таблиц, а будет достаточно пяти абзацев.
А валидатор - да, слабый стимул, но помогает. В пятницу именно чекать валидаторами и были отправлены верстальщики, пока у меня не было времени проверять их код индивидуально.
Вообще никогда не проверяйте, если валидацию не проходит! Время же не резиновое.
Семантика - вопрос больной. Я не знаю способа объяснить человеку зачем она нужна. Даже такой простейший аргумент против засилья таблиц, как количество кода, и то не срабатывает
Ну с семантикой я до фанатизма тоже стараюсь не доводить. Но если технически нет проблем отверстать любой сложности горизонтальное двухуровневое меню ненумерованными списками - рекомендую именно списками. Если есть абзац текста, и все вокруг видят, что это абзац текста, и он выглядит, как абзац текста - значит я не вижу причин, почему его публиковать не в теге P.
Это такие основы основ, что мне трудно не раздражаться, когда я вижу совершенно бесполезные навороты в вёрстке там, где достаточно семантически определённых именно для этих целей тегов.
А конструкции типа
<div align="center"><b><i><font size="3" color="#0000ff">Это так мы блин форматируем заголовок, который является заголовком первого уровня и выглядит как заголовок первого уровня!</font></i></b></div>вместо того, чтобы воспользоваться специально заточенным для этих целей h1 и дооформить его в css - ну тут уже и не сдерживаюсь.
Аналогично
Но столько нервов гробится, прежде чем научишь человека видеть такие банальности, как заголовки, абзацы и списки! Логического мышления у них нет, что ли?
Я бы попробовал эдакий кейс-тест для верстальщиков.
1. Запретить использовать инлайновые стили и атрибуты типа “border=0″.
2. Пока валидация не проведена, не сдавать. Если сдал невалидный код, подзывать, показывать пальцем и ничего(!) не говорить.
3. Готовый макет верстальщик должен открыть в браузере с отключеными стилями (FireFox + WebDeveloper), пустить на печать. Если это будет похоже на печатную версию, значит с семантикой должен быть порядок. Проверяем пп. 1 и 2.
4*. Для большей безопасности проверять это с отключеным JavaScript. А то есть умельцы.
страница должна быть читабельна без стилей и скриптов - согласен. однако п.3 проверки - это уже фанатизм!
И нифига не фанатизм. Если без стилей в тексте не остается ни одного заголовка, списка, банальных расстояний между абзацами… Значит семантики нет. Банальной семантики, “без фанатизма“!
Еще в список стоит добавить пункт “без картинок”. Цвета тоже нужно расставлять правильно, связь, она такая - сегодня картинка есть, завтра побилась.
[...] Сержусь. На дотнет, микрософт, билагейтса и ленивых программеров. Можно сколько угодно говорить о валидной вёрстке, с умным видом вещать о том, что таблицы в гипертексте используются для табличных данных, а макет, все контейнеры документа, весь этот дизайн - для этого есть другие теги, что избыточность в вёрстке - это дурной тон, код должен быть оптимальным и совершенным, как алмазная призма. А потом с таким старанием размеченный шаблон верстальщик отдаёт программеру, и на стерильность можно забить уже через пять минут (и, кстати, не первый раз на эту тему пишу). [...]