Асимметрия в дизайне сайта
Асимметрия в дизайне сайта и косые линии — довольно распространенный прием, используемый современными мастерами оформления веб-страниц. Излюбленным приемом многих веб-дизайнеров стало создание неотцентрированного (асимметричного) баланса на целевых страницах сайта. Это позволяет:
- «оживить» целевую, продающую страницу, изначально сконцентрировав внимание пользователей на наиболее важных вещах, сделав визуальный акцент на различных элементах сайта
- облегчить восприятие графической информации
- более эффективно и выгодно использовать свободное пространство
Отсутствие линии симметрии помогает более естественным образом отделить навигацонное меню или сайдбар от остального контента, оставляя больше места для размещения полезной информации. Сама обстановка асимметричности хорошо подходит для эмоционального дизайна, использования персонажей, изображений рекламного характера (брендовых товаров) создающих позитив и усиливающие эмоциональные мотивы. В целом ассиметричный баланс положительно влияет на способность выражать с помощью дизайна различные эмоции, создавая ощущение динамичности.
Несмотря на то, что асимметрия, по своей природе, связана с диссонансом (отсутствие гармонии, несходство) и такие веб-сайты отличаются отсутствием двух идентичных половинок, эффекта зеркалирования — это не мешает получать больше выигрыша от асимметрии в дизайне, чем недостатков.
Ниже демонстрируются свежие примеры сайтов, дизайнеры которых, умело применяя современные технологии и стиль, воздержались от использования равенства обоих частей веб-страниц.
Примеры асимметрии в дизайне веб-страниц
Дизайнер умело использовал фоновое изображение для создания асимметрии на главной странице. Бэкграунд в хедере является функциональным элементом, роль которого — производить впечатление. Уместность его эффектного визуального контента, нужно рассматривать в паре с дизайном логотипа.
The Enterprise Foundation
На сайте также используется нестандартная геометрия, да просто отсутствуют сглаживания или плавные формы. Много криволинейных поверхностей, угловатых линий, элементов зубчатой формы и объектов с резкими очертаниями. Используются приемлемые контрасты с изображениями и надписями. Дизайн основан на чистых, очень ярких цветах, поддерживающих асимметричный баланс этого сайта. Благодаря комплементарным цветам (дополнительные, вторичные цвета цветового круга) и довольно однородным поверхностям дизайн выглядит хорошо сбалансированным, чистым и четким.
DesignBlvd
Еще один сайт с плоским дизайном, на главной странице которого достаточно много контента. Однако текст и заголовки отлично гармонируют с окружающим визуальным контентом. Разметка сайта выглядит асимметричной, но неожиданно удивляет его хороший баланс, и это несмотря на очевидную разницу в размерах миниатюр постов. Светлая цветовая гамма вместе с мягкими приглушёнными цветами изображений создают сдержанный стиль, характерный для сферы бизнеса.
Artegence
В дизайне сайта создается ощущение асимметричности, главным образом благодаря сетке макета. Дизайнер разумно использовал простые прямоугольные формы блоков для устранения путаницы и хаоса, столь свойственных перегруженным контентом сайтам.
Timberline Tours
Создать впечатление от движения на статичной картинке, можно только сфотографировав это движение. Бодрящий вид сайта потребовал смелого дизайнерского решения. Уникальное меню из тематичных изображений буквально разрывает красочное слайд-шоу на главной странице. Треугольными формами создан совершенный баланс сайта — без какой-либо симметрии.
