Белое пространство

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

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

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

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

Что?

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

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

Что нужно понимать под макро и микро? Я думаю вы уже догадались чисто интуитивно, что макро — это большое белое пространство, которое определяет между собой сами логические блоки на сайте. Микро же — определяет пустое пространство между несколькими элементами уже в самом блоке.

Зачем?

Что это за зверь я думаю вы поняли, и вопросов по этому поводу быть не должно. Зато наверняка будут вопросы зачем же белое пространство вообще нужно? С этим всё просто — пустое пространство нужно как альтернатива линиям, полосам, и другим неблагородным элементам.

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

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

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

Как?

Использовать белое пространство нужно с умом. Просто наляпав побольше пустоты в различных местах удобства не добьешься. Добавлять белое пространство стоит только в определенные места на сайте, а именно:

• Между заголовком и основным текстом
• Между двумя явными блоками (На моем примере — «Рубрики» и «Последние записи».
• Между элементами в отдельном блоке, которые никак логически не связаны
• Между двумя схожими элементами, дабы избежать каши в головах пользователей (см. выше мою подписку на rss — между двумя элементами есть пустое микро-пространство)
• Между изображением и текстом (Я решил эту задачу добавив 10-пиксельную окантовку в каждом сопровождающем изображении, это тоже выход)

Причем явно не стоит использовать whitespace в таких ситуациях как:

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

Выводы

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

Тем временем

1. Мишка Квакин придумал усыГи... Жуть какая-то.

2. Юра Гугнин пишет о моде на треш в дизайне.

3. Сергей Чаботько обозревает СЕО блоги.

4. Футуриус раскрывает планы относительно будущего своего блога.

• Похожие заметки:

  • Подсказки к полям
  • Ошибочная напасть или 404 в строю
  • Сумасшедшие яйца
  • Вкладки, табы, 2 ствола