Размышления о веб-направлениях, часть 4: Веб-дизайн вкрутую и приветствия SVG

В своем последнем посте Web Directions @media я размышляю о двух презентациях, которые будут интересны как веб-дизайнерам, так и разработчикам…

Энди Кларк: Веб-дизайн вкрутую

Энди Кларк был основным докладчиком во второй день конференции, и для меня его выступление было самым противоречивым. В его новой книге « Hardboiled Web Design» обсуждается, почему процесс веб-разработки должен измениться, чтобы максимально использовать возможности современных браузеров. Его основными пунктами были: 1. Является ли прогрессивное улучшение все еще актуальным? Идея о том, что вы создаете устройства с наименьшими возможностями, а затем расширяете его для современных браузеров, впервые возникла в 2003 году. Энди считает ошибкой начинать с наименьшего общего знаменателя для визуального дизайна. 2. Дизайн сверху вниз Энди рекомендует начать с наилучшего опыта. Затем вы можете удалить функции для меньших браузеров. 3. Сайты не обязательно должны выглядеть одинаково в каждом браузере . Невозможно, чтобы сайт выглядел одинаково в каждом браузере. Энди продемонстрировал потрясающую демонстрацию веб-сайта с использованием CSS3-трансформаций и анимации, которые работали в Chrome и Safari. В других браузерах сайт был привлекательным, но использовал совершенно другой макет и имел гораздо меньше эффектов. Для этого Энди использовал Modernizr : библиотеку JavaScript, которая обнаруживает функции браузера. Например, если браузер поддерживает радиус границы, он добавляет класс «borderradius» к элементу HTML, чтобы вы могли соответствующим образом изменить свой CSS:

#myelement{	background: url(rounded-background-image.png) 0 0 no-repeat;}.borderradius #myelement{	background-image: none;	-webkit-border-radius: 5px;	-moz-border-radius: 5px;	border-radius: 5px;}

Он заявил, что IE6 не является проблемой. Пользователи IE6 могут получить очень простой опыт, но они не знали о дизайне в других браузерах и редко жаловались! 4. Забудьте текущую долю рынка Если вы анализируете свою текущую долю рынка браузера, вы смотрите на ситуацию сейчас. Как насчет будущего? Что пользователи будут использовать через 6 месяцев после выпуска вашего нового сайта? Это была заставляющая задуматься и увлекательная презентация, и я согласен со многим из того, что сказал Энди — хотя он признал, что некоторые из его идей находились в состоянии перемен. У меня было несколько оговорок:

• У прогрессивного улучшения есть свои проблемы, но Энди, похоже, выступает за форму постепенной деградации . С точки зрения чисто визуального дизайна это, вероятно, хорошая идея: сначала вы разрабатываете лучший опыт. Однако разработка кода отличается — обычно логичнее работать снизу вверх.
• Хотя я допускаю, что сайты в разных браузерах могут выглядеть по-разному, большинство из них предлагают аналогичные возможности. Является ли коммерчески целесообразным предлагать 2 или 3 совершенно разных макета? Достаточно сложно разработать концепцию, которая понравится вашему клиенту!
• Энди использовал несколько потрясающих эффектов Webkit в своем примере, но в настоящее время на эти браузеры приходится около 15% рынка. Эта цифра будет расти, и другие браузеры могут наверстать упущенное, но вы по-прежнему тратите большую часть своего времени / бюджета на разработку для меньшинства. Есть много неизвестных, и вам обязательно нужно будет обновить код в ближайшие месяцы. Это может заставить некоторых клиентов немного нервничать.
• Наконец, IE8, Firefox и Opera остаются способными браузерами. Они могут не предлагать ту же магию CSS3, но можно добиться хороших результатов, не прибегая к коду только для Webkit.

Я с нетерпением жду чтения книги Энди, чтобы увидеть, как он решает эти проблемы.

Даг Шеперс: SVG сегодня и завтра

Даг знает его SVG. Шутки в сторону. Забудьте о PowerPoint — даже его слайды презентации были SVG, показанными в Firefox (который он считает самым способным браузером SVG в настоящее время). Как и многие разработчики, я был взволнован перспективой масштабируемой векторной графики, когда они были объявлены в начале век. Это обернулось разочарованием, когда Microsoft проигнорировала стандарт, но спустя 10 лет SVG снова стал модным, и это обещано для IE9. Презентация Дуга была забавной, и он показал несколько мощных примеров SVG. Если, как и я, вы считаете SVG базовыми линиями и формами, вы будете удивлены тем, чего теперь можно достичь. Возможны трансформации, анимация и эффекты фильтра в стиле Photoshop. Я рекомендую вам посмотреть онлайн-презентацию Дуга, а также видео с его выступлением на MIX10 . Наконец, W3C опубликовал бесплатную онлайн-книгу — учебник SVG для современных браузеров — если вы хотите узнать что-нибудь о формате.