- Статьи
- 2 мин на чтение
- 30
Как сделать боковое меню удобным для восприятия
Оптимальные интервалы между пунктами меню
Насколько легко просматривать ваше меню, расположенное на боковой панели? От размеров интервалов между пунктами меню зависит то, сколько времени пользователи потратят на навигацию и поиск нужных элементов.
Оптимальные интервалы на боковой панели помогут людям быстрее сориентироваться. Типичная ошибка, которую допускают дизайнеры, — слишком много свободного пространства или, наоборот, его недостаточное количество. И то, и другое может замедлить и затруднить поиск определённого элемента.
Слишком большие интервалы создают большие визуальные пространства, которые удлиняют траектории движения взгляда и увеличивают количество фиксаций глаз. Когда пользователь сканирует объект, ему приходится сильнее напрягать зрение.
Слишком маленькие интервалы сокращают траекторию движения взгляда и уменьшают количество фиксаций глаз. Но проблема всё равно остаётся. Из-за небольших интервалов между элементами, пользователям будет сложно на них нажимать. Большие внутренние отступы делают текстовые названия крупнее, поэтому на них нажать легче.
Кроме того, слишком маленькие интервалы мешают сосредоточиться на отдельных элементах. Взгляд обладает ограниченным полем зрения, и когда в этом поле слишком много шума, сосредоточиться становится сложнее.
Обратите внимание, как элементы по контуру воображаемого поля мешают считывать название элемента. Фокус на пункте меню снижается, потому что близлежащие иконки и названия находятся слишком близко друг к другу и в поле зрения пользователя.
Однако если увеличить площадь воображаемого круга вокруг каждого элемента, это вытеснит близлежащие объекты из поля зрения пользователя. В результате люди смогут сканировать каждый элемент, фокусироваться на нём и не отвлекаться на соседние объекты.
Не располагайте иконки слишком близко к названиям пунктов. В противном случае они будут мешать пользователям считывать названия. Поскольку люди читают слева направо, важно не заслонять первую букву слова.
Между иконками и названиями должен быть небольшой интервал, чтобы пользователи могли сканировать их по отдельности. Люди не читают иконки, потому что это не текст. Они воспринимают их, как символы.
В примере ниже вы видите боковое меню со оптимальным интервалом. Отступ между иконками и названиями элементов не слишком велик и не слишком мал. Всё выглядит и ощущается так, как должно быть.
Перевод статьи How to Make Any Sidebar Menu Easier to Scan из блога UX Movement Newsletter
В нашем Телеграм-канале UX Teddy публикуем так же переводы практических статей из блога UX Movement про проектирование сложных интерфейсов, форм и страниц — подписывайтесь!
- Источник:
- UX Movement Newsletter
