Диагональные и наклонные элементы в веб-дизайне
Веб-дизайн 0 Комментариев

Диагональные и наклонные элементы в веб-дизайне

Использование наклонных элементов или линий в дизайне – не новый тренд. Он возник, когда инструменты CSS стали достаточно мощными, чтобы создавать абстрактные конструкции.

Диагональные фоны и наклонные линии придают индивидуальность любому макету.

Давайте рассмотрим несколько примеров такой тенденции.

Наклонные элементы в шапке сайта.

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

element.eleme.io

наклонные элементы в веб-дизайне

Этот способ добавляет ощущение глубины и перспективы странице. Кажется, как будто заголовок удаляется от зрителя, что делает страницу еще более привлекательной.

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

stripe.com/gb

наклонные элементы в веб-дизайне

Диагональные акценты в дизайне.

Многие сайты используют диагональные акценты или элементы на фоне.

Например, сайт агентства KRYPTIS (kryptis.com) использует диагональные области страниц для навигации и внутренних элементов страницы. При скроллинге вы обнаружите десятки углов, которые, кажется, совпадают.

наклонные элементы в веб-дизайне

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

Рассмотрим другой пример. Сайт-портфолио Mokhtar Saghafi (mrsaghafi.com). Весь сайт загружается как одна колонка, но фон делится на отдельные наклонные элементы.

наклонные элементы в веб-дизайне

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

Наклонные формы.

наклонные элементы в веб-дизайне

Сайт Paseo Itaigara (paseoitaigara.com.br) использует геометрические наклонные элементы, расположенные в виде паззла.

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

Еще одним примеров данного тренда является сайт Timberline Tours (timberlinetours.com).

наклонные элементы в веб-дизайне

В нем представлены сетка фотографий геометрических форм со ссылками на внутренние страницы.

Примеры диагонального дизайна.

Mellanie (https://goo.gl/dFsurJ)

наклонные элементы в веб-дизайне

Kunstnerisk (https://goo.gl/Elv3mo)

наклонные элементы в веб-дизайне

Stellar (https://goo.gl/w7EcYh)

наклонные элементы в веб-дизайне

Vertigo (https://goo.gl/nSwusf)

наклонные элементы в веб-дизайне



Подпишитесь на обновления блога!

Будьте всегда в курсе новостей

Добавить комментарий