Сегодня Веб 2.0 силен как никогда, новые тенденции в дизайне прослеживаются на каждом блоге, который вы посещаете и только собираетесь посетить. Снова и снова мы находим новые элементы дизайна, которые становятся обязательными для каждого модного, элегантного и стильного сайта разработанного в эру его величества Веб 2.0.

Вспомните сайты с серыми кнопками, заголовками гарнитурой Comic Sans и видимыми счетчиками eXtreme, которые мы посещали несколько лет назад. Сравните их с последними разработками, изменилось действительно многое, больше нет этих кнопок, заголовков и счетчиков.

В этой статьей мы начинаем серию публикаций о последних тенденциях в веб-дизайне, которые веб-разработчик должен помнить, создавая современный сайт.

1,2,3… Старт!

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

Интересно то, что в стремлении к простоте дизайнеры приходят к похожим решениям. Больше нет длинных списков требований (на самом деле он обычно написан внизу страницы мелким шрифтом) или детальных мануалов в .pdf на главной странице. Обычно в глаза бросаются «три шага» и «быстрый старт» в центре странице, которые подчеркивают, что вы можете начать пользоваться сервисом за несколько кликов. Для привлечения внимания используется графика или Flash.

Быстрый старт в сервисах веб 2.0
friendster.com

Быстрый старт в сервисах веб 2.0
fon.com

Быстрый старт в сервисах веб2.0
communitywalk.com

Быстрый старт в сервисах web 2.0
blish.com

Быстрый старт в сервисах web2.0
dpolls.com

Значки

Возможно одна из наиболее популярных тенденций эпохи Web 2.0 это значки с острыми или закругленными уголками и различные вариации на тему цветов, которые часто можно было найти на пакетах молока в 90-х.

Значок в стиле веб 2.0
sixapart.com/comet

Значок в стиле веб 2.0
goowy.com

Значок в стиле веб 2.0
ajaxload.info

Значок в стиле веб 2.0
haveamint.com

Значок в стиле Веб 2.0
conversate.org

Значок в стиле web 2.0
sidejobtrack.com

Значок в стиле web2.0
zerohex.org

Значок в стиле веб2.0
secondsite.biz

Бета

Вы пытались найти хотя бы один релиз среди множества Веб 2.0 сервисов? Почему среди Веб 2.0 ресурсов, чаще встречаются бета версии, а не релизы? Конечно, новые идеи рождаются так же часто, как и несколько лет назад, но сегодня они сразу же реализуются и предоставляются публике как бета версии.

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

Пометка «Бета» становится своеобразной торговой маркой для всего нового и интересного, она стала стандартом для новых проектов и часто подчеркнута ярким, привлекающим внимание, цветом в логотипе сайта.

Метка Бета в названиях Веб 2.0 сервисов
clickcaster.com

Метка Бета в названиях Веб 2.0 сервисов
bubbleshare.com

Метка Beta в названиях Веб 2.0 сервисов
shozu.com

Метка Бета в названиях Веб 2.0 сервисов
riya.com

Метка Бета в названиях Веб2.0 сервисов
picpix.com

Метка Beta в названиях Web2.0 сервисов
redtoucan.com

Метка Бета в названиях Web 2.0 сервисов
mabber.com

Облака тегов

Облака тегов могут, как упростить навигацию, так и наоборот, запутать посетителя. При правильном использовании они могут показать тематику ресурса и наиболее популярные на нем темы. Тем не менее, иногда они оформлены неправильно и только ухудшают юзабилити и читабельность, в основном это связано c ошибочной настройкой типографики или базовой логики (например, если высота строки задана в px, а не в em).

Облако тегов
shadows.com

Облако тегов
connotea.org

Облако тегов
blogmarks.net

Облако тегов
imeem.com

Облако тегов
browsr.com

Огромные поля ввода

Не один веб-дизайнер не отважился бы на такое всего несколько лет назад, потому что не каждый браузер отображал поля ввода правильно. Теперь этой проблемы нет, и все больше дизайнеров оформляют элементы форм оригинальным образом, а огромные поля ввода появляются там и тут, как грибы после дождя.

Огромное поле ввода
Совершенно неожиданное решение. Огромное поле ввода поисковика seekum.com

Огромное поле ввода
podbop.org

Огромное поле ввода
feedpile.com

Огромные шрифты

Оформление заголовков становится важным элементом стиля любой страницы. Заголовки, оформленные в виде изображений, уступают место текстовым заголовкам, оформленным с помощью CSS. Уходит время мелких заголовков, они становятся крупнее, иногда даже слишком крупными, крупнее становятся и другие элементы страницы, такие как меню и вводные тексты.

Огромный шрифт
krugle.com

Огромный шрифт
clearleft.com

Крупные шрифты в Веб 2.0
blog.qype.com

Крупные шрифты в Web 2.0
rrove.com

Закругленные углы

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

Закругленные углы

Типичными примерами использования закругленных углов могут быть Ioutliner, Netsquared и Springdoo.

Закругленные углы
Закругленные углы с резкой тенью: cluckoo.com

Закругленные углы
ning.com

Закругленные углы
Закругленные углы повсюду: zimbra.com

Похожие статьи