iTEYE

Семинар

29 октября 2007

Итак, прошел по web-разработке. Что было, что давали и о чем говорили. Сразу скажу, что не понравилось. У нас как минимум 90% посетителей используют IE, а показывалось все на Apple. Достаточно много говорилось о преимуществах формата png, но то, что IE очень плохо работает с полупрозрачностью, (я для решения данной проблемы использую pngFix).
Ну, во-первых, очень доходчиво разъяснили про стили и почему верстать лучше блоками. Рассказали про валидность и семантику верстки. Объяснили, почему не надо быть программистами и чего «нельзя» сделать в html.


А теперь обо всем поподробнее: начался (я опоздал на 5 минут) с того, что было сказано о плохом тоне верстать таблицами, хотя я склонен, не согласится с этим, я еще ни разу не встречал объективного ответа на вопрос, — Почему плохо верстать таблицами? Но это каждому как нравится. Сергей основывался на том, что мы не программисты, не надо соблюдать валидность кода, мы делаем это не ради красоты внутренней, а для людей, которые вообще не знают что такое html. На мой взгляд, он прав, и каждый делает, так как считает нужным. Табличная проще для простых шаблонов, где не надо особо думать при нарезке. А также можно запросто сделать резин
овый шаблон. Также Сергей сказал, что на западе считают невозможным сделать шаблон на 100% резиновым при верстке таблицами. Т.е. нельзя чтобы 3, допустим, колонки тянулись… Ну, это на мой взгляд немного неправильный взгляд на западную верстку, все они там могут и примером этому может послужить банальный IPB, где все прекрасно тянется.

Еще одним интересным моментом было представление приоритетов в .
Вот такая структура была представлена. Собственно тут все просто, чем в правиле больше балов, тем она приоритетней при выполнении. Т.е. если мы создаем правило для ID с цветом текста #ffffff, а потом правило с навигатором и классом (item) то приоритетным будет, естественно, правило, где указан класс. И если для класса цвет текста другой, то такой он и будет.

Еще одна страничка семинара была посвящена XHTML и этому ответвлению стандартов разработанных для мобильных устройств. Суть в том чтобы не использовать вложения в теги style, em вместо i, strong вместо b, и вообще придерживаться семантики верстки о которой говорилось дальше. Также было отмечено обязательное присутствие <!DOCTYPE и transitional в нем, для избежания ошибок рендеринга страницы. Был приведен пример с вертикальным расположением картинки в теге div, и остаточной полосой фона, которая создается из-за центровки этой картинки. При использовании transitional — эта проблема исчезает.

Было уделено большое внимание групповой разработке проектов и правильному оформлению таблицы стилей, названий стилей. В качестве примера был приведен следующий пример:

это было представлено вместо таблицы с 2мя строками.

Был также показан очень интересный скрипт на JS, который заменял обычный скролл справа на миниатюры страниц с таблицами, картинками и тегами H, пользуясь им наглядно видна структура просматриваемого документа. Нашел только версию под flash, однако на семинаре была представлена версия на js. Infoscroller.

Очень понравился контекстный поиск реализованный в виде стандартного поля input, но при вводе слова или части слова, на странице оставались только те статьи в которых данное слово присутствовало. Естественно все без перезагрузки страницы.

Еще одним «твиком» было использование кеширования бекграунда с использованием expression и BackgroungImageCache.

Так-же было рассказано о самой семантике верстки. Как представляет ее Сергей в виде направления, а не правил. Т.е. опять же кому как удобно.
Была, совсем малюсенькая часть о фреймворках, а хотелось больше. В итоге о фреймворках было сказано буквально следующее. Все пользуем т.к. он хороший и base2 т.к. он быстрый.

Так-же был затронут раздел анимации на JS, и про функции Роберта Пенера, собственно тоже ничего особенного сказано не было, в общем, хочешь — нагугли.
Касаемо оптимизации предлагалось сокращать количество загружаемых файлов, вынесение во внешние файлы стилей и скриптов. Объединение картинок в 1 файл, например круглые уголки, все 4 запихнуть в 1 файл и потом стилями двигать их как фон. Кстати решение старо как мир. Говорили об ajax на вслух это слово не упоминали, видимо боялись =) А так, например кешировать страницу, а данные, которые разные для каждого пользователя вставлять аяксом используют уже не первый год. И в этом нет ничего нового и непонятного.

Ну а теперь пройдусь по самому больному месту… или не самому… Вообще Сергей ярый поклонник png, это не плохо, но и не хорошо. Я понимаю что в сафари нет никаких проблем с полупрозрачность. Но бог ты мой, мы, же верстаем не для «Африки» — ой простите меня яблочники. Но 90% приходящих сидят с работы, а там как положено IE, а в нем ооочень плохо с полупрозрачностью в png. Да был кривой вариант решения с погружением еще 1 файла. Ужас. Есть PngFix. Это одно из простых решений, можно доделать, чтобы фоны оставлялись в покое.

На этом вроде как должен был подойти к концу. Оставалась финальная стадия, сам, так сказать, мастер-класс — резка макета. Вот тут то мы и застряли до половины десятого вечера. Боже мой, как же муторно работать с блочной верской, зачем плодить столько стилей? Просчитывать в уме все эти проценты, доставлять дополнительные пустые div, чтобы не терялось оформление при использовании float. На скорость я бы сделал таблицами за 15 минут. Но «так не делают». Как же быть мне, честному верстальщику? Скажите мне поисковики придают большое значние таблицам данных? Помоему 99% сайтов на таблицах? Я не прав?

Единственное, что мне понравилось в его резке, так это редактор которым Сергей пользовался. Aptana. Очень миленькая штучка…

Ну на сим закончу свой рассказ. Было приятно присутствовать, буду следить за событиями и ездить чаще.

P.S. Кстати дали ручку и блокнот =)

notes, , , , ,

Leave a Reply

Скидки до 5% на заказ хостинга!