Skip to content

Тренды веб-дизайна и все о них

За весь период существования интернета вокруг него складывались различные тренды веб-дизайна. Некоторые из них долго были популярны, но со временем некоторые исчезли. Вы наверняка слышали про плоский дизайн. А возможно вы еще помните «Web 2.0»?

Сейчас веб-индустрия меняется так быстро, как никогда. Новые технологии и методы работы появляются каждый месяц, если не каждую неделю.

Тренд (тенденцию) можно описать, как:

общее направление, в котором что-то развивается или меняется

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

Преимущества трендов

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

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

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

Недостатки трендов

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

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

Примеры текущих трендов

Плоский дизайн

Тенденция №1 за последнее время. Мы уже много говорили о плоском дизайне (например, здесь и здесь), но если вы впервые слышите о таком направлении, то вкратце расскажу вам о нем. Дизайн без текстур, теней, градиентов и трехмерных аспектов называют плоским.

Многие крупные компании принимают этот подход для дизайна своих продуктов. Как например, Microsoft (Metro UI, Windows 8, Skype и т.д.), Apple (iOS7, iOS8, OS X Yosemite) и Google (Material Design).

На сайте Fostr используются потрясающие иллюстрации в плоском стиле.
На сайте Fostr используются потрясающие иллюстрации в плоском стиле.

Размытый фон

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

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

На сайте Hipstamatic красивые цвета и блестящий интерфейс одного из своих приложений выигрышно смотрятся на размытом фоне
На сайте Hipstamatic красивые цвета и блестящий интерфейс одного из своих приложений выигрышно смотрятся на размытом фоне

Веб-типографика

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

С использованием CSS3 и  @font-face мы можем выразить наш дизайн и посыл бренда так, как никогда ранее. А ведь до этого мы были в состоянии использовать только системные шрифты, такие как Georgia, Arial и т.п. Теперь у нас есть возможность использовать столько разных шрифтов, сколько нашей душе угодно.

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

  • Typekit
  • Fontdeck
  • Fonts.com
  • H&FJ cloud.typography
  • Google Fonts

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

Ampersand (конференция про типографию) использует веб-шрифты, чтобы красиво представить информацию о выступающих, да и на всем сайте
Ampersand (конференция про типографику) использует веб-шрифты, чтобы красиво представить информацию о выступающих, да и на всем сайте

Адаптивный дизайн

Очередная вещь, что считается тенденцией (или по крайней мере модным словом для 2012/2013, а следовательно тенденцией для тех, кто находится за пределами веб-индустрии) — это адаптивный веб-дизайн, или как его еще называют отзывчивый веб-дизайн. Несмотря на то, что адаптивный дизайн вокруг нас уже в течение нескольких лет, он все еще относительно молод.

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

Чего ожидать в будущем?

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

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

Источник: WebDesign Tuts+

Данная запись является частью серии "Школа дизайна для разработчиков".

Как создается визуальная иерархия

CSS3, веб-шрифты и иконки