WebDesignMagazine.ru – Журнал о веб-дизайне

Как эффективно использовать свободное пространство в веб-дизайне

0

Случалось ли с вами такое, что вы смотрите на готовый проект и думаете: “чего-то не хватает”? А если быть более точным, вы когда-нибудь приходили к выводу, что дизайн является “слишком пустым” или “слишком заполненным”? Для нас дизайнеров, трудно представить свою работу без подобных вопросов.

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

whitespace_01

Действительно ли оно пустое?

Задумывались ли вы о свободном пространстве как о “пространстве между элементами дизайна”? Хотя это распространенное мнение, оно ошибочно. Свободное пространство – не только наполнитель между элементами дизайна, это важнейший элемент!

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

whitespace_06

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

Фокусирование

Теперь, когда мы обозначили важность свободного пространства в дизайне, как его использовать?

Давайте начнем с небольшого упражнения. Откройте новую вкладку в вашем любимом браузере и перейдите в google.com. Что вы видите первым? Держу пари, яркий логотип Google, верно? Где этот логотип? Конечно не в верхнем края окна, откуда мы привыкли начинать. Так как же ваш взгляд сразу упал на центр страницы?

whitespace_05

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

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

Организация

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

whitespace_04

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

Не бойтесь экспериментировать!

Акцент

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

whitespace_03

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

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

Пространство не должно быть обязательно белым

Приведенные выше советы связаны с направлением внимания. То есть свободное пространство больше всего поможет вам с этим. И только потому, что мы называем его white space не означает, что оно в буквальном смысле должно быть белым! Нет такого закона в дизайне – диктовать цвет, и какими должны быть интервалы в ваших проектах.

whitespace_02

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

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

Я надеюсь, что с помощью этих советов вы посмотрите на свободное пространство в своих проектах по-новому!

Поделиться: