Если вы взимаете комиссию за услугу, необходимо внятно сообщить пользователю размер этой комиссии. Вопрос в том — в рублях или в процентах. В рублях, вроде бы логичнее, но если пользователь сам вводит сумму, то может быть, до момента ввода проще показать проценты? Я так считал. Оказалось, что пользователи считают иначе. Точнее, они вообще плохо считают.
В нашей платежной системе комиссия отображается в виде процентов:
Хотя были идеи и варианты комиссию считать налету (пока пользователь вводит сумму в поле) и отображать ее в рублях. Но я посчитал, что это баловство — излишняя интерактивность и ненужное программирование. Тем более, что в нашем случае, все равно будет шаг, на котором пользователь должен все проверить, ввести пароль и подтвердить платеж. Вот на этом втором шаге, конечно, мы показываем комиссию в рублях:
Сегодня разговаривал со своим коллегой, работающим в одном крупном мобильном операторе. Он сказал, что они проводили исследования и оказалось, что вариант, применяемы у нас, отпугивает пользователей.
Как так? Почему? Оказывается, что пользователи плохо считают проценты. Плохо, в смысле неправильно. Например, при платеже на 1000 руб. и комиссии 2%, пользователь говорил: «Нет, 120 рублей комиссии — это слишком дорого».
Получается если не показывать комиссию сразу же в рублях, а только в процентах, то многие пользователи не станут совершать платеж. Можно, конечно, смеяться над ними, рассказывать анектдоты про богатого двоишника и бедного отличника. Но дела это не изменит — мы теряем клиентов.
Что ж, нужно исправляться и делать что-то в таком духе:
Впрочем, возможно, такое оформление для измененной логики не самое лучшее, нужно будет еще подумать и потестировать. Думаю, сделаем комиссию рядом с полем ввода суммы, например так: Сумма [500] руб. + комиссия 10 руб. (2%)
В заключение скажу, что я не отловил эту проблему при юзабилити-тестировании. Дело в том, что пользователи при тестировании платили не свои деньги и не очень большие суммы. А раз так, то им хоть 90% комиссиии напиши — все ладно.
Так что порой получасовое общение с коллегой стоит многих часов исследований.
О том, что активный пункт меню на сайте должен быть выделенным, знает каждый школьник. Но и в такой простой вещи есть свои нюансы, о которых многие веб-разработчики предпочитают забывать.
Т.к. все вещи, которые я здесь опишу, я применяю с самого моего сайтостроительного детства, то мне кажется, что нет вообще смысла писать эту статью, они очевидны. С другой стороны, мне приходится постоянно разъяснять эти истины с нуля программистам и дизайнерам, из чего можно заключить, что не так уж они и очевидны.
В данной статье речь пойдет именно о меню. Т.е. об иерархичной структуре с единственным отношением (один пункт меню — одна страница). Множественные отношения — теги — под данное рассуждение не попадают.
Активный пункт меню
Предположим, что у вас есть сайт с меню из тех пунктов:
Новости
Старости
Странности
Активный пункт меню должен выделяться. Это поможет пользователю помнить (или понять, если он пришел по ссылке сразу на внутреннюю страницу), в каком именно месте сайта он находится. В нашем примере, когда пользователь щелкнет по пункту «Новости», то меню станет таким:
Новости
Старости
Странности
Активный пункт претерпел изменения:
- Графически выделен — другой цвет фона и полужирное начертание шрифта;
- Не залинкован — ссылка убрана, т.к. нет смысла давать ссылку на текущий URL.
Субактивный пункт меню
Предположим, что в разделе «Новости» у нас много ссылок на вложенные страницы с новостями. Если зайти на эти вложенные страницы, то как должен выглядеть пункт меню? С одной стороны, он продолжает быть активным, т.к. мы все еще в разделе новостей. С другой — вроде бы мы уже не прямо в нем находимся.
Состояние пункта меню в данном случае я называю субактивным:
Новости
Старости
Странности
Субактивный пункт сочетает в себе черты активного и пассивного пунктов:
- Графически выделен другим цветом фона — это черта активного пункта;
- Залинкован и не выделен полоужирным — это черты пассивного пункта.
В результате, пользователь, попав на внутреннюю страницу новости, с одной стороны поймет, что он находится в разделе «Новости», с другой — сможет перейти в корень раздела.
Ошибки в построении меню
Описанные выше принципы просты для понимания, разработки и использования. По сути, это те мелочи, о которых пользователю даже думать не нужно, типа вращения колесика на мышке.
Но и в данном простом вопросе встречаются ошибки:
- Пункты меню вообще не выделяются — это как ни странно встречается;
- Субактивный пункт выглядит также, как активный — если при этом он залинкован, то ошибка не страшная, но если он не залинкован (такое встречается), то это уже проблема;
- Активный пункт выделен, но залинкова сам на себя — очень распространенная ошибка, впрочем нестрашная;
- Активный пункт присутствует, а субактивный выглядит как пассивный (никак не выделен) — очень распространенная и довольно серьезная ошибка, часто встречается на больших корпоративных сайтах, где она приводит к серьезным проблемам в навигации.
Где это НЕприменимо
Меню бывают разные. Но все же описанный выше подход довольно универсален и подоходит для большинства случаев. Даже в сложном меню с табами и подпунктами разных видов принцип пассивный-активный-субактивный дает хорошие результаты и сильно улучшает навигацию.
Могу припомнить только две ситуации, где данный принцип неприменим:
- Выпадающее меню — в этом случае рекомендую для компенсации применять хлебные крошки;
- Пункт меню пропадает на странице назначения. Представьте, что кликнув по пункту «Новости», вы попадете на сайт с другим оформлением и совершенно другим меню. Такое бывает, впрочем, злоупотреблять этим не стоит.
Выводы и картинка
Разработчик, помни, выделение активного и субактивного пунктов меню улучшает навигацию, понижает артериальное давление и улучшает пищеварение!
Я решил, что в каждом посте буду вставлять хотя бы одну картинку. Т.к. в процессе написания статьи я облошелся без картинок, то размещу ее тут. Как говорит старая дизайнерская поговорка, если не знаешь, что нарисовать, нарисуй яблоко. А что, яблоко — это же важная часть нашего с вами меню!
ЧПУ
или веб-адреса, удобные для восприятия человеком, к счастью, перестали быть экзотикой. Например эта страница имеет вот такой адрес:
blog.ritov.ru / 2009 / 09 / blog-post_22.html
Как видите, весьма понятный URL, если не обращать внимания на неказистое название blog-post_22.html (я еще не разобрался как в Блогспоте давать человеческие адреса постам).
По идее, если отбрасывать части адреса
так blog.ritov.ru / 2009 / 09
или так blog.ritov.ru / 2009
то должен выводится список постов за сентябрь 2009 года и список постов за весь 2009-й соответственно. К сожалению, если вы попробуете зайти по этим адресам, то получите сообщение, что страница не найдена.
Курьез в том, что справа от текста поста имеется календарик, оформленный как раз в виде вложенного списка по типу:
- 2009
- Сентябрь
- ЧПУ — средство навигации, а не визуализации
- Веб-проект как унитаз
Логично, что «2009» должен быть залинкован на blog.ritov.ru/2009/. Однако, щелкнув по этой ссылке, мы получим следующий ужос:
blog.ritov.ru / search?updated-min=2009-01-01T00%3A00%3A00-08%3A00&updated-max=2010-01-01T00%3A00%3A00-08%3A00&max-results=4
Ссылка «Сентябрь» выглядит посимпатичнее, но логики не прибавляет:
blog.ritov.ru / 2009_09_01_archive.html
Получается, что у гугл-блога ЧПУ присутствует (частично), и выполняет оформительскую функцию, но никак не функцию навигации.
Согласен, что это пустячок. Но из таких пустячков и скалдывается настоящая любовь :) Вот у меня в браузере, например, можно по частям адреса кликать, очень удобно, советую:
Мода применять ЧПУ как средство визуализации, а не как средство навигации, явно прослеживается в среде современных веб-разработчиков. Чего скрывать, и сам я не без греха: mobi-money.ru / news / full / 88
Навеяно сегодняшним походом в поликлинику.
Все мы периодически посещаем общественные туалеты. К сожалению, они часто грязны, а порою и просто заср*ны (в прямом смысле слова). И проблема тут не в свинстве людей.
Унитаз vs Толчок
В современных общественных туалетах ставят унитазы. Унитаз подразумевает стульчак. Стульчак подразумевает наличие специальных (или хотя бы обычных) одноразовых салфеток. К использованию без салфеток (читай, без стульчака) унитаз в общественных местах не предназначен.
Салфетки в общественном туалете (особенно специальные для стульчака) — редкость. Результат известен — страждущие животом садятся на корточки и... [вырезано цензурой].
Спрашивается, зачем делать красивый кафельный туалет с блистающим чешским унитазом, если в нем никогда не будет салфеток, туалетной бумаги и мыла? Покрасили бы стены масляной зеленой краской, в полу проделали бы дырку — и готово. Чё выпендриваться то!
Веб-проект как унитаз
К сожалению, подобное часто происходит в веб-проектах. Делают что-то красивое и дорогое, но потом экономят на мелочах и через какое-то время проект начинает дурно пахнуть и к нему никто не хочет прикасаться.
Однажды я участвовал в разработке веб-портала для партнеров довольно крупной системы. За основу был взят один довольно известный колаборейшн-продукт, который мы долго и мучительно тюнили под наши нужды и нужды клиентов. Получилось неплохо. Однако, из-за несогласованности управления, этот портал использовался как домашняя страничка из нескольких статических страниц, большинство его возможностей так и не было использовано.
Как и унитаз без салфеток для стульчака, этот портал без должной поддержки, постепенно зарос грязью и паутиной и к нему сейчас не хочется даже прикасаться.
Так что, начиная новый проект, подумайте, может быть можно обойтись просто дыркой в полу?
|
Ах, эти интерфейсы
Этот блог — рассуждения о пользовательских интерфейсах в различных их проявлениях и веб-проектах.
|
