8 основных трендов в области веб-дизайна 2014
Больше простоты, больше чистоты и внимания к маленьким экранам — это, среди прочего, главные особенности веб-дизайна 2014 года.
К этой коллекции трендов, составленной из случайных наблюдений, примешалась определенная доля догадок и предположений — и некоторые из них в дальнейшем могут оказаться более точными, чем другие.
1. Плоские интерфейсы (все еще популярны)
Чистота сейчас в большем почете, нежели вычурные формы. Значительное влияние на это направление оказал выход в свет платформы Windows 8 и последующий отказ разработчиков Apple от скевоморфизма в iOS7.
Windows 8, Apple iOS7, Skibuddy…
2. Доминирование мобильных устройств
Повсеместное распространение смартфонов и планшетов в последние годы привело к тому, что теперь на многих сайтах мобильные устройства генерируют больше трафика, чем другие компьютеры. В этом году мобильные девайсы продолжают доминировать — и дизайнеры вынуждены переосмысливать такой нюанс, как UX, в пользу маленьких экранов (но, конечно же, им не следует забывать и о больших). Необходимость приспосабливаться к мобильных устройств стимулирует инновации.
Для большинства компаний мобильные устройства не являются приоритетом, и, очевидно, все еще остаются второразрядной аппаратурой, но те немногие, кто оценил преимущества адаптивного веб-дизайна, приходят к заключению, что это достаточно окупаемая инновация.
3. Больше скроллинга
Можно вспомнить веб-сайты 2012 года — тогда этот тренд еще находился на стадии зарождения. Но сейчас в этом направлении наблюдается существенный прогресс. Отчасти потому, что реализация скроллинга относительно несложная, а дизайнеры учитывают особенности смартфонов и планшетов.
Параллакс-скроллинг, горизонтальный скроллинг, скроллинг колонок, бесконечный скроллинг — это то, что приходится наблюдать чаще всего.
4. Больше HTML5
Вместо долгих рассуждений о преимуществах HTML5, можно зайти на Codepen и посмотреть представленные там примеры. Ряд креативных агентств предлагают некий микс HTML5 с вкраплениями CSS3 и jQuery.
В общем, возвращение эпохи эффектных Flash-элементов и чистого пользовательского опыта, судя по всему, не предвидится.
6. UX-микро
Внимание к микроскопическим деталям — это то, что позволяет веб-сайту выделиться на фоне остальных. Точечное применение микроэффектов UX может вернуть веб-сайт к жизни. Переходы и визуальное выделение ссылок — это то, что радует глаз. Например, индикатор прогресса на сайте Daily Beast
7. Меньше текста
Веб-сайты становятся менее загруженными текстовым материалом, в некоторых веб-сайтах и приложениях текст практически отсутствует — для передачи информации используется визуальный ряд (изображения, иконки).
Порой это приводит к желаемым результатам, но, как правило, полное отсутствие текста — это уже чересчур. На главной странице Snapchat содержится менее 10 слов, и для пущей наглядности пользователям предлагается посмотреть видео.
Концепт медицинской панели наблюдения
ELI — такая подача информационного продукта больше подходит для сайтов-визиток с портфолио
Snapchat
8. Навигация в традициях минимализма
Навигация без всего лишнего — набирающий популярность тренд. Иконки и исчезающая навигация при прокручивании страницы вниз — появление таких элементов объясняется необходимостью подгонять навигацию под технические особенности мобильных устройств.
Medium
Smart Home
9. CSS заменяет картинки
Зачем использовать изображения в качестве иконок, когда доступен CSS?
10. Видео / динамичный задний план
Таких элементов, очевидно, будет появляться все больше. Firestorm на сайте британской газеты Guardian — хороший тому пример. Динамичный фон часто наблюдается на сайтах известных брендов.
The House of Eyewear
11. Расширение возможностей контента
На некоторых сайтах можно обнаружить комплексный подход — комбинацию текста, изображения, видео, интерактивного функционала и множество скролинга.
ESPN Grantland
12. Выжать максимум из одной страницы
Все больше сайтов избегают загрузок дополнительных страниц, предоставляя вместо этого добавочный контент на одной странице. Лайтбоксы, наложение слоев, и всевозможное расширение пространства — все это сокращает количество кликов, необходимых для одного среднестатистического путешествия по сайту.
H&M
13. Типографическое разнообразие
Появляется больше всевозможных вариаций и смешений веб-шрифтов; сейчас дизайнеры предпочитают более объемные экземпляры. В довершение всего, набирает ход адаптивная типография, которая, по всей видимости, станет существенным компонентом адаптивного дизайна.
14. Чёрно-белый дизайн
Зачем использовать три цвета, когда двух (и их оттенков) вполне достаточно. Но есть и весьма удачно реализованная черно-белая палитра.
Qatar Airways
15. Насыщенность цвета
С другой стороны, зачем ограничиваться только двумя, когда в наличии имеются все цвета радуги.
Вместе с тем, многоцветный подход не должен быть ослепительно ярким, или отталкивающим.
Coloured Lines
16. Карты и плитка
Карты — будущее веб-дизайна, но, судя по всему, и настоящее тоже.
Etch
Silktricky
17. Большие и качественные изображения
Массивные иллюстрации и фоновые изображения чрезвычайно популярны, и они определенно хорошо смотрятся на retina-дисплее. В печатной промышленности широко используются объемные изображения.
Protest
18. Фиксированное расположение контента / навигации
Это когда при прокручивании страницы вниз навигация (или некоторые другие элементы контента) остаются на странице. Иногда навигация уменьшается по высоте в узкую полоску, или же небольшую иконку, которая может расшириться (как отмечалось в пункте № 8). Это обычное явление для веб-сайтов нового формата.
Если что-то было пропущено в статье и мы пропустили какой-то тренд из мира веб-дизайна, мы будем рады выслушать ваше мнение и добавить его в статью.