Как старый дед, хочу немного повозмущаться и покритиковать UI/UX Хабра. Одновременно с этим подсветить один из самых распространенных и раздражающих анти-паттернов UX.
При публикации статьи есть select-поля с выпадающим меню:
Целевая аудитория
Хабы
В открытом состоянии выпадающее меню вмещает всего 4 элемента из очень длинного списка. Мне как пользователю все содержимое списка не известно, и я бы хотел хотя бы раз просмотреть его целиком, чтобы примерно запомнить, из чего он состоит. Но каждый раз я отказываюсь от этой затеи, потому что скроллить больше сотни элементов через щель высотой в 160px — мягко говоря, не очень удобно и утомительно для глаз. Неужели за всю историю существования Хабра никому не пришло в голову увеличить эту выподашку?
Делается это буквально несколькими CSS правилами. Специально для скриншота, делаю это через devtools. Вот как это могло бы выглядеть.
Разве это не удобнее?
Да, есть поиск, и он помогает — можно не скроллить, а сразу напечатать. Но откуда мне знать, что именно печатать, если разработчики решили выдавать список из 100+ элементов порциями по 4 штуки?
Чтобы просмотреть весь список, мне нужно примерно 20 аккуратных движений колесом мыши. Но чтобы случайно не перескочить элементы, приходится скроллить по 2-3 штуки, оставляя один сверху как ориентир. Итого — около 50 итераций ради того, чтобы просто узнать, из чего состоит список.
А вообще это распространенный антипатерн, который я замечал много где. Основное правило, можно сформулировать следующим образом.
Интерактивные элементы интерфейса должны максимально использовать свободное пространство экрана.
Как такое попадает в прод: дизайнер рисует красивую абстракцию для 3-4 элементов, не думая о том, как быть если список состоит из 100 элементов. А front-end разработчик буквально воплощает задумку. Еще тут влияние PP (Pixel Perfect) — как по мне, не самая лучшая идея, оторванная от реальности, но это уже совсем другая тема.
Статическая часть экрана, с которой пользователь не взаимодействует в данный момент, ему не нужна. Некоторые люди покупают большой монитор именно ради того, чтобы видеть больше контента одновременно. Но подобные решения в UI полностью обесценивают это преимущество.
Я бы простил такое любому другому сайту — и то на релизе. Но Хабр! Ты-то куда?
PS
Это должно было быть просто, не примечательным постом, в котором бухтит старый разраб. Но Хабр запретил мне публиковать это как пост, потому что он состоял более чем из 1 скриншота.
PSS
Статью будто и пальца высосал, но серьезно это напрягает. Прекратите так делать! Добавьте в закладки и рассылайте всем когда возникнет спорная ситуация между FE/UI/UX разрабами.
Раз уж написал целую статью, подписывайтесь на мою тг-группу.
