Баланс в веб-дизайне или как должен выглядеть продающий сайт

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

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

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

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

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

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

• Размер
• Форма
• Цвет
• Размер
• Положение

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

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

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

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

Это один из важнейших факторов, при помощи которого можно сбалансировать элементы которые отличаются по цвету, размеру, весу и форме. Как уже говорилось выше – более яркие и большие обьекты притягивают больше внимания к себе, но их вес так же зависит и от того, на сколько близко они расположены к центру композиции. Чем ближе обьект к центру, тем больше его вес, зная это вы можете балансировать объектами приближая и удаляя их от центра. Расположение элементов и блоков является одним из самых важных факторов, когда речь заходит про создание landing page.

• Чем больше обьект, тем он тяжелее
• Чем темнее обьект, тем он тяжелее
• Чем насыщеней цвет у элемента, тем он тяжелее
• Обьекты с текстурами тяжелее обьектов без них, и чем больше текстур, тем тяжелее обьект
• Не следует забывать про вертикальный и радиальный балансы
• Яркие и теплые цвета (красный, оранжевый), тяжелее холодный цветов, таких как синий и зеленый

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