Основные стили веб-дизайна

Минимализм в веб-дизайне

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

«Добиться сочетания эстетики, функциональности, удобства и атмосферности — вот что главное при работе с минимализмом».

Цветовые решения просты и минимальны. Часто это один цвет или монохром. При этом цвет не обязательно должен быть нейтральным белым или черным. Минимализм приветствует любые цветовые решения, если они задают верный тон и правильным образом акцентируют внимание. Значит, наш пользователь не будет блуждать глазами, легко считает нужную информацию и за долю секунды поймёт, куда нажать.

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

Типографика может быть как очень сложной, так и простой, лаконичной. Так как в стиле минимализм контент на первом месте, то именно типографике уделяется особое внимание. Шрифты могут быть элегантные с засечками, строгие без засечек, крупные, стандартные, яркие и скромные. Выбор зависит от общего настроения сайта, позиционирования бренда. Главное — ничего лишнего: фото только по теме, текст в минимальном объёме, тезисно. Никаких сложных текстур из кирпичей под текстом, объёмных текстурированных букв, аляпистых баннеров.

Это самый популярный стиль оформления сайтов. Он может использоваться почти в любой нише: от технологий до парашютинга. Минимализм отлично смотрится в Fashion, Travel, бьюти, производстве, современных технологиях, IT, личных портфолио, интернет-магазинах, дизайне интерьеров. Вообще он идеально подходит в случаях, когда нужно:

— Презентовать дорогой продукт;
— Привлечь внимание к фотографиям;
— Отразить технологичность, экологичность;
— Передать премиальность;
— Сделать в конце-концов удобный для пользователей сайт.

Рисованный стиль

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

Часто у новичков при просмотре подобного стиля сайта возникает одна и та же реакция — вау, хочу, как сделать? Вся фишка кроется в использовании иллюстраций, нарисованных художником или иллюстратором. То есть для создания рисованного сайта, нужен не только UI‑дизайнер, но и художник. Соответственно стоимость таких проектов значительно выше, а сроки — дольше.

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

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

Шрифты в данном стиле часто также рукописные, либо простые, аккуратные, классические, преимущественно гротески (без засечек).

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

Стиль Флэт (плоский дизайн)

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

Для данного стиля характерны простые двумерные иллюстрации, отсутствие объема, текстур, градиента, 3D-эффектов, сложных теней, других эффектов. Часто используется только один акцентный цвет, не яркий, приглушенный и несколько дополняющих фоновых.

Типографика в данном направлении простая, понятная, аккуратная. Это простые гротески (шрифты без засечек) и классические общепринятые размеры в оформлении заголовков и основного текста.

Сетка также простая — модульная либо 2−3 колонки.

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

Брутализм

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

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

Кислотные цвета в приоритете при построении дизайна, часто это сочетания красного и зеленого оттенков.

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

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

У брутализма есть как плюсы, так и минусы.
К плюсам можно отнести простой подход при создании дизайна — не нужно много времени тратить на составление ТЗ, проработку структуры, сетки и логики.

Из минусов — впечатление пользователя. Не всем заходит смелый и неоднозначный дизайн в данном стиле. Существует риск испортить впечатление и потерять пользователя.

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

Ретро

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

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

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

Типографике присущи шрифты с засечками, брусковые шрифты, как отсылка ко временам печатной машинки, рукописные шрифты, леттеринг.

В ретро стиле обычно оформляют сайты компаний схожей тематики — винтажные магазины и выставки, ретро автомобили, а также портфолио фотографов, дизайнеров, артистов.

Organic & Natural

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

Отличительной особенностью данного направления является использование в оформлении дизайна натуральных материалов и текстур. Это дерево, растительные мотивы, природные цвета и оттенки. Всё внимание на оформление. Структура и логика отходят на второй план.

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

Типографика аккуратная и незаметная. Классические гротески, скромные, женственные декоративные шрифты.

В оформлении используются декоративные элементы: листики, линии, цветы, животные, птицы.

Сетка простая и логически понятная. Обычно колоночная или блочная.

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