Если вы хотите получать уведомления о новых записях на блоге Mannodesign.Com, то просто подпишитесь на RSS-рассылку.
Спонсор месяца: Dizweb.ru — Веб дизайн. Блог о веб дизайне
В новый год с новыми идеями! Именно такой настрой должен быть у каждого уважающего себя креативного хомо сапиенса, к числу которых веб дизайнер относится в первую очередь. Почему в первую? Да просто потому, что без Интернета современным мир немыслим. Современный человек практически живет в нем. Кто-то погружен на все 100%, а кто-то просто следует тенденциям и пользуется массой предоставленных Интернет-услуг потому что это удобно, стильно и в чем-то даже полезно. Это и не хорошо и не плохо, это просто есть. А раз есть, то веб дизайнеру и карты в ручки.
Какие же тенденции в веб-дизайне следует ожидать в наступившем 2010 году?
Прежде всего, продолжится активная интеграция сторонних сервисов в содержимое веб сайтов. Flickr, Facebook, Twitter, YouTube, аудио и видео подкасты — без этих фишек современный сайт выглядит если не бедно, то уж точно не в ногу со временем. В буржунете это зовется емким словом lifestream — жизненное, текущее, “я в теме”. Соответственно, появляется масса новых и интересных решений по внедрению всего этого добра в дизайн сайта. Вот, к примеру, способы отображения активности в качестве твиттерянина:





Популярность: 6%
Спонсор месяца: Dizweb.ru — Веб дизайн. Блог о веб дизайне
* Автор статьи — Кирилл «Erlang» Панфилов, http://blog.erlang.com.ru/
Специально для www.mannodesign.com

В веб-разработке, как и везде, есть своя мода. К счастью, веб-дизайнеры не собираются на помпезных показах и светских тусовках, о них не пишут скандальные таблоиды, поэтому новинки, тенденции и смелые находки нужно собирать в бесконечных поисках по дизайнерским блогам. Сегодня мы рассмотрим несколько современных практик, которые завоёвывают всё большую популярность.
1. Используем возможности CSS третьего уровня
Современные браузеры всё больше приближаются к CSS Level 3, которые направлены не только на гибкую вёрстку, но и позволяют более корректно распечатывать веб-страницы на принтере и воспроизводить их на звуковых устройствах, а также расширяют обычные возможности разметки. Например, сейчас в коде многих сайтов можно встретить такое:
::selection {
background: #600;
color:#FFC;
}
::-moz-selection {
background: #600;
color:#FFC;
}
Этот кусочек кода позволяет изменять цвет фона и текста, который вы выделяете на веб-странице мышкой. Вставьте эти строки в начало своего CSS-файла, выделите фрагмент текста, и вы увидите, что текст стал бледно-жёлтым на красивом бордовом фоне. Работает это, разумеется, везде, кроме браузера Internet Explorer 6: он оказался очень далёким от модных тенденций.
Мы бы, конечно, с удовольствием использовали и падающую тень от букв:
h1 {
text-shadow:0 1px 1px #363;
}
Но понимает такое свойство, к сожалению, похоже, только Opera.
2. Начинаем код с CSS-фреймворка
Фреймворк — это некоторый фрагмент кода, который позволяет решать часто используемые задачи. Те, кто программирует сложные веб-приложения, наверняка знают о таких программных фреймворках, как Yii, Zend, Kohana, CodeIgniter, Struts, Ruby и других (в них сразу реализованы и методы работы с базами данных, и системы безопасности, и процессы авторизации и регистрации пользователей, и обработка пользовательских данных). Если вы часто используете возможности языка JavaScript, то, вероятно, вы не обходитесь без фреймворков jQuery, Mootools или Prototype (динамическое построение веб-страницы, анимация и сложные эффекты, сравнимые с Flash). Сложно говорить о HTML-фреймворках, но вот CSS-фреймворки используются достаточно часто.
Что они делают? Обнуляют отступы, исправляют браузерные разночтения, касающиеся таблиц, границ и размеров, описывают часто используемые элементы. Например, я вёрстку всех своих проектов начинаю со вставки своего же небольшого фреймворка, который я не обновляю уже достаточно долго, потому что он решает все нужные мне задачи:
Популярность: 12%
Спонсор месяца: Dizweb.ru — Веб дизайн. Блог о веб дизайне
Итак, вторая часть Марлезонского балета обзора тенденций веб дизайна 2009 по версии журнала Smashing Magazine. В двух словах тенденция такова, что креативные дизигнеры пытаются всеми возможными и невозможными способами сломать стереотип восприятия сайта как некоей «коробки», куда ссыпана кучка инфы и более-менее там упорядочена. Приемчики используются самые разнообразные. От попыток вовлечения посетителя внутрь экрана, до намеренного частичного сокрытия текста (Черт! Что там у них написано-то? Ну-ка, ну-ка…) и гигантских картинок, мгновенно приковывающих внимание. Но обо всем по-порядку.
Сколько уже было поломано копий между сторонниками безудержного креатива и суровыми приверженцами новомодного слова «юзабилити» (удобство использования) по поводу «казнить нельзя помиловать». Однако пусть и со скрипом, но коробочная эстетика сайтов все-таки постепенно меняется на более динамичные и интересные формы. Самый простой и доступный способ выйти за пределы шаблона — отодвинуть страницу вглубь экрана и явно это показать. Например, выступающими за пределы страницы элементами, уходящими за нее, вглубь и в дали неведомые. Или как на следующей иллюстрации — своеобразный эффект игры от первого лица:
Популярность: 9%
Спонсор месяца: Dizweb.ru — Веб дизайн. Блог о веб дизайне
Упс! Глюк случился небольшой. Пришлось базу данных вертать взад на несколько дней. А потому постик этот и последующую вторую часть пишу повторно. Сорри всем тем, кто уже прокомментировал первую часть, комменты потерялись вместе с постом.
Smashing Magazine опубликовал обширный отчет в двух частях о тенденциях веб дизайна 2009. Заглянув в трэкбэки, я не нашла достойного перевода текста, а потому решила восполнить этот пробел. Сегодня я публикую лишь первую часть, а в следующем посте будет продолжение. Иначе получится многабукаф. Перевод сокращен до полезного минимума, так как в первых абзацах одна вода.
Итак, тенденции веб дизайна 2009 по версии журнала Smashing Magazine.
1. Letterpress или оттиск.
Буквально — выдавленный текст или иные символы. По мнению авторов журнала, это довольно неожиданная тенденция, вызванная, скорее всего тем, что ранее мало использовалась вообще. Такую технику теперь стали в изобилии применять для представления дизайнерских продуктов и на сайтах онлайн-сервисов.
Читать полностью »
Популярность: 10%