Современное интернет-пространство пестрит разнообразием стилей в оформлении сайтов. Подробнее о некоторых из стилей.
Минимализм
Минимализм является популярнейшим трендом среди многих дизайнеров. Обычно на сайтах в стиле минимализм внимание пользователя стараются сфокусировать на чем-то конкретном, т.е. рисуется какой-то отдельный элемент, отличный от всего остального (картинка в центре экрана, или большая надпись). Яркими представителями в стиле минимализм являются сайты Eastworks Leather Company, Whole и Lapka. К характерным чертам минимализма относятся:
1. Простота и понятность;
2. Минимум графических элементов;
3. Функциональный интерфейс;
4. Черно-белый цвет;
5. Минимальные тени.
Плоский (flat) дизайн
Не менее популярный и близкий по стилю к минимализму. В основу flat дизайна ложится двумерный стиль. Основная идея этого стиля — изображение геометрии элемента только с помощью цветов, без каких-либо других способов придания глубины: теней, скосов, рельефов, градиентов. Как это выглядит на деле, можно узнать на таких ресурсах, как Spell Tower, LayerVault, Yep! Каждый элемент пользовательского интерфейса должен восприниматься однозначно, а взаимодействие с такими элементами должно интуитивно быть понятным для пользователей. Характерные особенности:
1. Никаких дополнительных эффектов;
2. Использование простых фигур;
3. Контрастные цветовые решения;
4. Акцент на типографике.
Кроме того существует такой вид дизайна как «почти плоский» дизайн. В «почти плоском» дизайне используются техники плоского дизайна, но к некоторым элементам все же добавляются дополнительные эффекты. Например, кнопки содержат дополнительные градиенты или тени. Дизайнеры, как правило, выбирают какой-либо эффект и применяют ко всем элементам «почти плоского» дизайна. Сайт Mixpanel тому пример.
Metro дизайн
Обычно его позиционируют как легкий, простой, быстрый и открытый. В общем и целом этот стиль похож на плоский дизайн. Также используется качественная типографика, простые элементы, хорошо продуманный контент. Отличительные же особенности metro дизайна в том, что ссылки не подчеркиваются, а для визуализации информации используются разноцветные и равномерное закрашенные квадраты навигации. Убедиться в этом можете самостоятельно: Blocklevel, Microsoft SWIT, Etch.
Нестандартная геометрия
Нестандартная геометрия также приобрела популярность в этом году. В основном, она прослеживается во всех элементах сайта (фоны, выделения, отдельные элементы). Благо это позволяют сейчас сделать HTML5 и CSS3. Самыми трендовыми геометрическими формами элементов является круг, ромб и шестиугольник (сота), реже встречаются треугольники: Built by Buffalo, V2, AmplifiQEstudio.
Винтаж (ретро стиль)
Ретро стиль взят из эпохи 50-80 годов с афиш, плакатов и прочей атрибутики того времени. Довольно часто дизайнеры, вдохновившись такой работой, рисуют сайт в ретро стиле. К популярным элементам оформления можно отнести:
1. Использование текстур (в частности, бумаги во всех её видах — типографская, рваная, пожелтевшая — или текстур, похожих на бумагу), а также использование всевозможных потертостей для придания старины;
2. Декоративные элементы (рамочки, узоры, флажки, ленточки, линии — двойные, тройные);
3. Ретро-цвета (не сочные, а приглушенные);
4. Характерная замысловатая типографика (шрифты плакатного типа).
Сайты Von Dutch, Kinder Forografie, Alex Peirce, Web Design Yorkshire, Rodolphe Célestin, Teixido отлично демонстрируют применение ретро стиля в дизайне.
Фиксированное меню, является следствием распространения сайтов с вертикальным скроллингом: дизайнеры поняли, что пользователю будет неудобно каждый раз возвращаться вверх, чтоб перейти в другой раздел или совершить какие-либо ключевые действия. Именно поэтому основное меню стали закреплять сверху, на всем протяжении скроллинга по сайту. Кроме меню, фиксируются главные элементы сайта (например, в случае интернет магазина таким элементом будет корзина). Подобное меню использовано на сайтах Eyal Shahar, Engage Interactive и Ryan Scherf.
Анимация с использованием CSS 3 и HTML 5. Теперь, с развитием данных технологий, дизайнеры могут с легкостью делать разные эффекты: деформация, перетекание, раскрытие, плоскости и многие другие, и творческий народ активно этим пользуется. В сети есть множество сайтов, на которых уже выложены готовые решения анимации с предпросмотром и кодом для вставки в свой сайт. Если хотите посмотреть, как выглядит анимация с использованием CSS 3 и HTML 5, вам сюда: WWF, Rule of Three, Inception, InTacto10, RailUp, Agent 008 Ball.
