Диалог: верстка и прогресс
26 Дек 2008
Этот пост не совсем обычный — большая его часть написана не мной. Эти мысли прислал мне Владимир «Bolzamo» Большаков, я их только немного откорректировал и добавил свои комментарии. Итак, читаем.
В наши дни web-разработка уже совсем не та, что была в 90-х, а еще через пару лет она изменится ещё больше. На дворе XXI век, и Web 2.0 принёс нам XHTML, Ajax, микроформаты, OpenID, RSS и прочие вкусности.
То, что раньше «лепилось вслепую», теперь уже перерабатывается, проходит стандартизации и спецификации. Это касается и web-технологий, в частности — языков разметки и описания web-интерфейсов: HTML и CSS, о которых и пойдет речь.
Жилинский: А что 90-е? Я в ВГТУ получал сертификат по web-программированию в 2001 году — нам тогда давали PHP3 и говорили, что «некоторые веб-мастера уже иногда используют для верстки DIV-блоки с абсолютным позиционированием, но полностью сделать страницу на них невозможно.»
Но речь пойдет не о самих языках, а о закономерностях их развития и факторах, способствующих или препятствующих ему.
Будучи web-программистом, и ходя большей частью по сайтам таких же гиков и фанатов развития новых технологий, иногда начинаешь считать, что весь web красив и продвинут, что Web 2.0 прочно вошел в нашу жизнь, что красивый ненавязчивый дизайн (разработанный согласно требованиям юзабилити) и блочная семантическая верстка — это обыденность, это нормально…
Но иногда возвращаешься и в реальность, заходя на сайты начинающих разработчиков, или наоборот — специалистов конца прошлого столетия, которые не удосужились оглянуться вокруг. Да и просто на старые сайты, которые интересны контентом, но исполнение которых ужасно. Если со старыми сайтами все более-менее понятно, то тот факт, что многие сайты уже рождаются устаревшими, не может не огорчать.
Сколько их, этих ресурсов, построенных на табличной верстке, в коде которой сломаешь обе ноги, руку и голову? Чья кодировка — windows-1251, перенос строки формата — cr/lf, а у некоторых в еще и <META NAME=»Generator» CONTENT=»FrontPage 4.0″>…
Жилинский: Много. Очень много. Даже в корпоративном сегменте, не говоря уже про Юкоз, Народ и леса сателлитов...
Когда в социальных сетях, тематических блогах или конференциях разработчиков обсуждаются проблемы современной web-разработки и интернет-маркетинга, мало затрагивается тот момент, что когда человек решает заняться web-дизайном, он начинает с изучения табличной верстки, а потом не хочет переучиваться, так как для этого нужно не просто прочитать еще одну книжку, но и перестроить мышление.
Почему HTML изучают с таблиц? Элементарно! Потому что в учебниках написано изучать HTML с таблиц. Все учебники, самоучители и методические пособия вышли в далеких 90х годах, когда CSS рассматривался, разве что, как средство выставить шрифты и расцветку сразу для всего сайта. И слыхом никто не слыхивал о разделении контента и представления.
Есть, конечно, и новые учебники. Полистал недавно парочку… Нашел в них перепечатку старых. Только версия FrontPage поменялась и добавилось пара глав о CSS и блочной верстке. Почему-то авторы этих учебников ни разу не задумываются о том, что, чтобы научить человека чему-то хорошему, надо для начала не учить его плохому.
Кто не согласен с тем, что табличная верстка — это плохо? Почитайте спецификацию: тег table предназначен для представления табличных данных, равно как микроскоп предназначен для изучения микроскопических объектов, а не для забивания гвоздей.
Как-то я разговорился на эту тему с одним программистом, который иногда зарабатывает созданием простеньких сайтов на заказ для местных организаций. Сайты делает просто удивительные: верстка табличная, картинки увесистые, скрипты самописные, ЧПУ даже и не пахло. На все мои увещевания, что это неправильно, что надо стремиться к лучшему, он просто ответил, что веб никогда не был и не будет правильным. Что HTML — это куча мусора, к которой добавили еще одну кучу мусора — CSS, и теперь пытаются присобачить третью кучу мусора, называя ее стандартами веб-разработки. Классная формулировка, которая для многих может показаться вполне резонным оправданием, чтобы продолжать забивать интернет этим самым мусором. А какая разница? Заказчик ничего в этом не смыслит, ему красиво — он доволен.
Жилинский: Да, я как-то тоже разговорился с таким специалистом и счастливым обладателем жуткого сайта. Остались при своих мнениях, кстати.
Вот так мы и находим основные факторы, убивающие мотивацию к дальнейшему развитию себя как web-разработчика, изучению технологий и стандартов:
1. Делаем, как привыкли. Уже научились верстать в таблицах, кажется очень сложным изучать все тонкости и хитросплетения CSS, вдумываться в структуру документа, воевать с багами IE, чтобы достичь кросс-браузерности. На самом деле, блочная верстка куда проще и логичнее, просто сначала стоит изучить вопрос.
2. Заказчику всё равно. Заказчик хочет отдать деньги и увидеть сайт, похожий на картинку, чтобы было очень красиво и иногда еще и понятно написано.
А мне кстати говоря, как программисту, было куда интереснее разбираться с новым материалом, коим была блочная верстка.
И таки чем больше разбираешься в тонкостях, тем больше она мне нравится.
Таблицы, как справедливо подмечено, предназначены для табличных данных, и никак ни для позиционирования структурных элементов страницы =)
>>Почему-то авторы этих учебников ни разу не задумываются о том, что, чтобы научить человека чему-то хорошему, надо для начала не учить его плохому.
Владимир, может ты напишешь дельных советов по верстке? :)
Хм… Может Большаков напишет? У меня в этом деле практика не настолько большая и современная, чтобы дельные советы давать.
Если человек уперт в table, лечить его скорее всего бесполезно.
Потом, DIV`ы все-таки осваивать надо, ибо хорошо (просто супер!) в спеках, пока дело до браузеров не дошло. Гладко было на бумаге…
А как (насколько) это реализовано в браузерах, может просто отпугнуть. Поэтому, тот кто не занимается сайтостроительством на постоянной основе может просто забить и сляпать все table`ом.
С DIV`ами на родных веб-просторах тож не все просто. Полно любителей запихнуть в отдельный DIV почти каждую фразочку. Типо тег параграфа и прочие уже не нужны. Перекосы на местах…
Я с большим удовольствием и интересом переходил с табличной на блочную верстку. Блочная верстка и верстка по стандартам очень удачно вписываются в мой принцип: минимум кода, и контент должен занимать бОльшую часть исходного кода страницы.
К тому же, в блочной верстке гораздо проще управлять элементами страницы.
«Все учебники, самоучители и методические пособия вышли в далеких 90х годах, когда CSS рассматривался, разве что, как средство выставить шрифты и расцветку сразу для всего сайта. И слыхом никто не слыхивал о разделении контента и представления.»
Ну… не стоит так пессимистично :) Есть книги по современным способам верстки (Молли Хольцшаг, Энди Бадд, книги издательства «Орейлли»). Начинающие начинают не оттуда.
«Кто не согласен с тем, что табличная верстка — это плохо?»
Плохо, еще и потому, что содержание, намертво прибитое к форме очень сложно модифицировать, например — добавить новый блок на страницу (ячейку забыл добавить во _всех_ столбцах, и поехала верстка).
«Если человек уперт в table, лечить его скорее всего бесполезно.»
Если тип верстки решает задачу (сляпать хомячок), то и не нужно, насильно мил не будешь.
Потом, DIV`ы все-таки осваивать надо, ибо хорошо (просто супер!) в спеках, пока дело до браузеров не дошло. Гладко было на бумаге…
А как (насколько) это реализовано в браузерах, может просто отпугнуть.
Мы все знаем, в каком браузере div’ы реализованы «отпугивающие».
Поэтому Яндекс пока далеко не strict :)
«С DIV`ами на родных веб-просторах тож не все просто. Полно любителей запихнуть в отдельный DIV почти каждую фразочку. Типо тег параграфа и прочие уже не нужны. Перекосы на местах…»
Разработчик так и не понял идеологию разделения контента и представления.
http://www.artlebedev.ru/tools/technogrette/html/some-html-principles/ в помощь.
Что, собственно, вас беспокоит? Сайт делают, чтобы решить какую-то задачу. Если он решает поставленную задачу, значит сделан правильно.
Зачем нужно разделение кода и представления? Так проще сопровождать и развивать систему. И что, много сайтов сопровождается и развиваются? А если они не сопровождаются и развиваются, нафиг там всякие заумности типа разделения кода и представления.
Все делают плохо, а вы — хорошо. Так это не повод горевать, это повод радоваться! У вас офигенное конкурентное преимущество! Вы мигом вынесете всех этих недоразработчиков с рынка! Что, не выносятся? Так может быть это не такое уж офигенное преимущество?
Я не за табличную верстку и не за дивы. Я за то, чтобы разработчики прекратили заморачиваться на всякой ерунде, вроде table vs div, а занялись более важными делами — разработкой систем, нужных и удобных для пользователя. И пофиг, как они сделаны, на таблицах, на дивах, на mxml или на Visual Basic. Технология вторична, забудте про нее и подумайте о важном.
У меня такое чувство, что теперь тут Хабр, мне это не нравится.
Мы не о том, что надо-верстать-блоками, это и ежу понятно. Мы о том, что литература не успевает за технологией и в результате её же и тормозит.
Тут согласен. С литературой беда. Тормозит ли это технологию? Возможно. Проблема и это? На личном уровне — нет, на уровне общества — пожалуй да.
Хорошо, что есть люди, которые занимаются проблемами общества. Просто часто бывает так, что эти люди забывают заниматься личными проблемами. То есть, пытаясь научить других, как надо программировать, сами учиться перестают. Если это не относится к авторам, я искренне рад.
Стоит, однако, заметить, что по правильной верске хорошая литература имеется, причем в достаточном количестве. Только вот авторы все забугорные, не наши.
Да тут дело даже не в борьбе. Борется, например, Opera Software, тратя деньги и гоняя специалистов по ex-СССР.
Мы не учим никого, я лично не учу никого. Тут цель другая совсем — общение, определение проблемы, обсуждение. Донесение информации до тех, кто желает её получать.
И как раз в свободное от решения личных проблем время :-) В этом смысл блогосферы…
Ну, значит, цели достигли: пообщались, проблему определили и обсудили, информацию донесли.
Вы обратили внимание на позитивные моменты — есть энтузиасты, которые с этим борются. И вы сами в их числе (за это спасибо, однако). Позитивная позиция — тоже хорошо.
Если уж придираться, то я бы хотел более четкого определения, в чем проблема. Вы жаловались на плохую верстку. Я заявил, что это не проблема. Вы не возразили. Вы жаловались на плохие книги. Я заявил, что есть и хорошие. На это вы тоже не возражали.
Но можно и не придираться. Интуитивно проблема понятна, и без четких формулировок.
Сорри, позволю себе влезть еще раз. Сейчас перечитал написаное, и понял, что я неясно выразил свою позицию насчет «правильной верстки» и только ввел в заблуждение. За это извиняюсь.
Попробую прояснить иначе. Дело в том, что мир HTML-верстки и сайто-делания относительно невелик, правил в нем не так много и их польза очевидна. Правила эти повторяются многократно почти в любых источниках, относящихся к верстке. Из-за этого одни люди начинают воспринимать их как религиозные догмы, другие — отвергают просто потому, что надоело.
Между тем, программирование — гораздо более обширная сфера. И рекомендаций по «хорошоему» коду существует множество, разной степени полезности. Поэтому хороший программист относится к ним критически и всегда оценивает в контексте конкретного проекта.
Главная мысль, которую я хотел сообщить: правила нарушать не только множно, но иногда даже нужно.
Боюсь, и этому я не смогу возразить. Нарушение правил — это сильный ход профессионала, который делает его профессионалом.
И это не только в программировании или верстке — это везде. Но так ли много вокруг профи… =)
Нарушение правил профессионалом — это не есть плохо, согласен…
А вот когда не-профессионал с порога отвергает технологию, даже не изучив ее, и при этом доказывает другим, что поступает единственно верно, это уже проблемный момент.
А именно так чаще всего и бывает у сторонников той же табличной верстки.
ЗЫ. Не бывает правил без исключений. Правила без исключений есть исключение из этого правила.
Понравилось описание трех куч мусора. Конечно с практической точки зрения это утверждение сомнительно, но если рассматривать в историческом плане — святая истина.
А если по сути: ругать стоит не только учебники по HTML, которые начинают учить с табличной верстки, а еще и
1. армию пользователей обладающих способностью выйти в интернет и начать с горем пополам клепать сайты, но не обладающих способностью изучить некоторые технические особенности работы интернета и собственных браузеров
2. визуальные редакторы — уж в них то верстка только табличная
3. бесплатные хостинги — предоставляющие возможность любому выставить свои сайты на всеобщее обозрение
4. браузеры, которые понимают web-стандары как им заблогорассудиться.
5. и много чего еще.
так что проблема похоже будет всегда, тем более что человек способный на сайте внятно изложить по данной теме материал и человек способный реализовать это технически — это очень разные люди.
То, что перечилил vikeng похоже на саму суть веба. :)
Если кому-то захочется очень стандарного гипетекста — поиищите, ведь, были и есть проприетарные гипертекстовые среды.
Что касается моей позиции по вопросу, то я полностью поддерживаю первый коммент yzh44yzh и частично остальные.
Так ли важно, как сделан сайт, если он генерируется программно и разделение кода и контента задолго до его публикации в веб?
С другой стороны, есть цели и задачи, когда таблицы противопоказаны. Например, если принимаются в расчет требования accessability или экономия траффика.
Т.е. по башке надо бить не дизайнеров, а постановиков задач и проектировщиков. Ну а когда они все в одном лице… всем должно достаться! :)
Посмотреть на Яндекс.Фотках
Это иллюстрация к статье, присланная Аликом Кирилловичем. Новый критерий «приличности» сайтов был введен в книге А. Чиртика HTML. Популярный самоучитель (2-е издание), 2008 г. Книга продаётся на Озоне.
Оказывается, необходимым условием «приличности» сайта является… табличная верстка!
Ну, ребят, я так скажу: в 2008 говорить о том, что кто-то еще верстает таблицами — моветон как минимум. Такому человеку должно быть стыдно. Табличная верстка — это капец изврат, и я согласен табличные тэги могут использоваться только для обозначения этих самых таблиц.
Не могу согласиться с постулатом, что мол, разницы нет, главное чтоб сайт хорошо выглядел. Разница есть, и технология — это то же самое юзабилити (скорость загрузки сайта и т.д.).
Вообще, когда читаю в портфолио «смешанная верстка» — хочется плакать. А такого ведь и правда реально много осталось.
Насчет защитников таблиц — хотелось бы увидеть хоть один пример того, что можно сделать таблицами и нельзя сделать CSS.
>Популярный самоучитель (2-е издание), 2008 г.
Ну так она вышла в 2008. А написана может и в 2006..
Я, как начинающий, с удовольствием изучал блочную вёрстку. Когда исходного кода Намного меньше, чем контента. Плюс, использую div-ы, можно легко вынести контент в начало кода, что хорошо для seo, а всё прочее вниз…
Дайте уж тогда названия\линки на правильные учебники…что-бы не учиться плохому.
Я верстаю и таблицами и дивами и даже совмещаю их по необходимости. Например, в особо извращенных случаях когда требуется сделать быстро и пофиг как, чтобы заказчик не имел мозг, появляются страшные варианты типа таблицы со структурой сайта (шапка, меню, контент, подвал) и заполняются дивами с содержимым.
По поводу разделения контента и представления вопрос спорный, и необходимость его зависит от целей создания сайта, в крупных проектах разделение необходимо, а, например, для визитки в 5 страниц делать базу с динамической подгрузкой контента из бд нет смысла, имхо.
По устареванию литературы согласен полностью, поэтому давно изучаю все новые технологии либо, читая материалы по конкретным вопросам на тематических ресурсах, например, статьи типа «как сделать *** на голом css» либо по видеоурокам итп т.к. они обычно довольно свежие, хотя качество материала бывает довольно паршивым.