Comments 55
Chosen — как сделать громоздкие селектбоксы более удобным для пользователей. harvesthq.github.com/chosen/
Очень крутая штука, но, даже в стандартном выпадающем списке достаточно нажать на него, чтобы отобразилось его содержимое и на клавиатуре ввести первые буквы страны, браузер сам отсортирует, просто многие об этом не догадываются.
UFO just landed and posted this here
причем надо быстро вводить и не видно =)
в chosen же поиск прям такой как надо
мне очень нравится как у них multiple select выглядят
единственный минус, имхо, так это то что он статичный и данные по ajax подгружать не имеет. допиливать разе что, но там свои ньюансы тогда.
в chosen же поиск прям такой как надо
мне очень нравится как у них multiple select выглядят
единственный минус, имхо, так это то что он статичный и данные по ajax подгружать не имеет. допиливать разе что, но там свои ньюансы тогда.
Да, точно, привык просто набирать «ru' для выбора России, думал что там полноценная сортировка.
Chosen классный, но он IE7 не поддерживает, c IE8 непонятно
(написано «Legacy support for IE8 is also enabled»)
(написано «Legacy support for IE8 is also enabled»)
Теперь бы интегрировать эти два замечательных решения.
Например, встроить Country Selector в Chosen как дополнительный тип поля.
Например, встроить Country Selector в Chosen как дополнительный тип поля.
Большинство крупных сервисов уже знает о вашем местоположении (а мелкие могут взять их гео-api).
По умолчанию это поле можно сделать уже заполненным.
По умолчанию это поле можно сделать уже заполненным.
я в командировке ищу инфу по своему региону. А эта собака подсовывает мне инфу о том регионе где я нахожусь сейчас. Хуже придумать трудно.
Вот только эта база geoip не всегда актуальна. К примеру судя по большинству сайтов я уже много где побывал, и в Германии и в Сибири, да куда меня только не заносило, хотя живу в центре России. Просто провайдер все время покупал разные диапазоны ip адресов, которые раньше принадлежали другим провайдерам.
Если использовать мобильный интернет, то вообще может определить соседний регион, ни разу не было так, чтобы по этой базе попал именно тот регион, откуда я выхожу в интернет.
Так что все эти определялки, лично для меня, ничего не значат и зачастую — только мешают.
Если использовать мобильный интернет, то вообще может определить соседний регион, ни разу не было так, чтобы по этой базе попал именно тот регион, откуда я выхожу в интернет.
Так что все эти определялки, лично для меня, ничего не значат и зачастую — только мешают.
Можно ещё флаги стран добавить для красоты и лучшей ориентировки (последнее сомнительно для чужих стран, но свою найдут).
Или выдавать таблицу флагов, как здесь, но плотнее (типа большого календаря) и подсвечивать выбранные лексическим анализом.
spmbt.kodingen.com/flags/showFlags.htm — мешап из флагов стран
Или выдавать таблицу флагов, как здесь, но плотнее (типа большого календаря) и подсвечивать выбранные лексическим анализом.
spmbt.kodingen.com/flags/showFlags.htm — мешап из флагов стран
Забыт один немаловажный пункт — локализация. Я конечно понимаю, почему в демке Russia ищется, а вот Россия нет. Но если разработчик замахивается на вещи изложенный в статье, то он должен думать и про локализацию в том числе. Потому что скорее всего набирать начнут на родном языке.
Ввожу «R», мне первым пунктом выдают «China». Что я делаю не так?
Очень понравилось, что на ua вывело Украину, а на by — Белоруссию.
Красота. Была проблема маленькая — сделали большую :)
А теперь посмотрим, как этот JS-тяжеловес будет работать в сложных боевых условиях?
1) JS отключен — подставился обычный выпадающий список — тест пройден.
2) Старый IE (тестировал через IETester, так что есть некоторая вероятность неправильного результата) — IE6 и IE7 показали обычный выпадающий список — не страшно. В IE8 после выпадания нужной подсказкой первой строкой нажатие «Enter» приводит к очищению поля. Если попрыгать сначала стрелками по подсказкам, то поле не очистится, но и выбор не подтвердится. Выбор подтверждается только мышью — плохо.
3) Используется мобильный прокси-браузер (на примере Opera Mini) — после ввода страница сразу же обновляется и значение затирается, то есть вести что-то нельзя вообще — провал.
4) Используется полноценный мобильный браузер — подсказки слишком медленно выползают, успеваешь полностью ввести «Russia» и начать делать что-то еще. В Opera Mobile после тормозов и подбрасываний обратно к форме всё-таки подправился ввод до «Russian Federation». В нативном Вебките для Андроида после всего это почему-то подставилось «China» — провал.
А теперь посмотрим, как этот JS-тяжеловес будет работать в сложных боевых условиях?
1) JS отключен — подставился обычный выпадающий список — тест пройден.
2) Старый IE (тестировал через IETester, так что есть некоторая вероятность неправильного результата) — IE6 и IE7 показали обычный выпадающий список — не страшно. В IE8 после выпадания нужной подсказкой первой строкой нажатие «Enter» приводит к очищению поля. Если попрыгать сначала стрелками по подсказкам, то поле не очистится, но и выбор не подтвердится. Выбор подтверждается только мышью — плохо.
3) Используется мобильный прокси-браузер (на примере Opera Mini) — после ввода страница сразу же обновляется и значение затирается, то есть вести что-то нельзя вообще — провал.
4) Используется полноценный мобильный браузер — подсказки слишком медленно выползают, успеваешь полностью ввести «Russia» и начать делать что-то еще. В Opera Mobile после тормозов и подбрасываний обратно к форме всё-таки подправился ввод до «Russian Federation». В нативном Вебките для Андроида после всего это почему-то подставилось «China» — провал.
Сначала вышестоящий каммент был прилично в минусе, так что я решил подождать аргументированных претензий. Но теперь, видимо, не дождусь. Но всё равно попробую объяснить каммент тем, кто недопонял или недосогласился.
Итак, автор оригинала статьи верно отметил, что длинный выпадающий список в 200 элементов — не торжество юзабилити. Тем не менее, страну можно определить по IP-адресу (почти безошибочно). Если же данные об IP устарели или пользователь собирается что-то заказывать с доставкой в другую страну, то он всегда может изменить страну в выпадающем списке (то есть список никуда не исчезает, а просто имеет в качестве умолчального значения автоопределившуюся страну). Таких людей окажется мало, да и прокрутить до нужного места не так уж тяжело. А в мобильном телефоне (с емкостным сенсорным экраном) это сделать даже легче, чем на десктопе. Так что это всё же маленькая проблема. И автор поста решил ее таким образом, что появились проблемы большие (хотя в правильных условиях работает отлично, согласен). Например, в одном из указанных тестов страну нельзя было ввести в поле вообще.
На мой взгляд, идею о выпадающих списках с поисковой строкой и коррекцией ошибок неплохо бы протолкнуть в веб-стандарты. Это могло бы решить проблемы с совметимостью. А пока, как мне кажется, следует отключить расширенный селектор для мобильных устройств.
Итак, автор оригинала статьи верно отметил, что длинный выпадающий список в 200 элементов — не торжество юзабилити. Тем не менее, страну можно определить по IP-адресу (почти безошибочно). Если же данные об IP устарели или пользователь собирается что-то заказывать с доставкой в другую страну, то он всегда может изменить страну в выпадающем списке (то есть список никуда не исчезает, а просто имеет в качестве умолчального значения автоопределившуюся страну). Таких людей окажется мало, да и прокрутить до нужного места не так уж тяжело. А в мобильном телефоне (с емкостным сенсорным экраном) это сделать даже легче, чем на десктопе. Так что это всё же маленькая проблема. И автор поста решил ее таким образом, что появились проблемы большие (хотя в правильных условиях работает отлично, согласен). Например, в одном из указанных тестов страну нельзя было ввести в поле вообще.
На мой взгляд, идею о выпадающих списках с поисковой строкой и коррекцией ошибок неплохо бы протолкнуть в веб-стандарты. Это могло бы решить проблемы с совметимостью. А пока, как мне кажется, следует отключить расширенный селектор для мобильных устройств.
Я не совсем понимаю сути проблемы, вроде как в select box работает набор по буквам. Даже если список 100 элементов, можно навести фокус и начать набирать «Ро» и выпадет Россия или можно подкорректировать «вверх»/«вниз».
Большинство пользователей частоиспользующих формы для заполнения, знакомы с этой штукой.
Большинство пользователей частоиспользующих формы для заполнения, знакомы с этой штукой.
Поубивал бы таких горе дизайнеров!
Ненавижу тянуться к клаве когда можно сделать всё мышкой, зачем лишать людей этой возможности?
Ненавижу тянуться к клаве когда можно сделать всё мышкой, зачем лишать людей этой возможности?
Понравился в оригинале учёт национального написания.
Если есть список из определенных пунктов, то не должна пропадать возможность выбора без ввода с клавиатуры.
Самое ценное на мой взгляд 2 и 3 этапы, без них этот элемент не более чем стандартный Autocomplete.
Почему-то автор учёл всевозможные варианты набора, кроме самого основного: ввод «Россия», наиболее естественный для любого простого пользователя, никак не обрабатывается. И можно сколько угодно объяснять про локали и технические сложности, но пользователь ни о чём не знает. Он только сердится, когда не может набрать название своей страны на понятном ему языке.
Вот я уже привык везде, где длинные стандартные селектбоксы с выбором страны, просто жать на буковку R три раза.
Если кто не знает, то в стандартных селектах оно по первой букве, как по хоткею срабатывает и прокручивает до следующего элемента в списке на эту букву. И любые оптимизации мне теперь неудобны наоборот будут. Конечно, таких, как я мало, скорей всего, ещё меньше, чем тех, кто по форме табом ходит, но тем не менее…
Если кто не знает, то в стандартных селектах оно по первой букве, как по хоткею срабатывает и прокручивает до следующего элемента в списке на эту букву. И любые оптимизации мне теперь неудобны наоборот будут. Конечно, таких, как я мало, скорей всего, ещё меньше, чем тех, кто по форме табом ходит, но тем не менее…
Не совсем понятно, почему при наборе любого количества букв и последующем стирании, на первом месте оказывается Лесото.
Раз уж задели сайт Apple, то можно написать целую статью. Я каждый раз, когда там что-то покупаю, постоянно ругаюсь на их юзабилити. Это та самая часть, которую они очень плохо контролируют. И дизайн стал какой-то странный, три года назад была металлическая поверхность, очень клево смотрелось. А спустя год они сменили ее на черно-серую.
Смотрите как это сделано в установщике дебиана. После определения локали показывается выбор location по языку человека и есть пункт other, который в два уровня (region/country) выбирает нужное.
Проблема с автодополнением возникает, когда есть пункт, название которого является началом названия другого пункта. Например, Niger и Nigeria. Набираешь niger[ENTER], а в регистрацию уходит Nigeria. Или приходится следить, исправлять. В любом случае, необходимо думать, что же с этим дополнением делать — нажимать ENTER, или ТАВ, или стрелками выбрать, или мышкой… Сложнее всё-таки, чем простое меню из 250 пунктов, которое прокручивается колёсиком на ура. В общем, как и везде — есть и плюсы, и минусы.
Можно сделать к каждой стране (или хотя бы к популярным) флаг 8х8 хотя бы, или 16х16 из спрайта какого-нибудь + мелким шрифтом перенос с названием этой страны на её национальном языке, напрмиер
Russian Federation (написано по нормальному)
Российская Федерация (написано чуть ниже не выделяющимся шрифтом и цветом)
+ включить это в поиск, тогда человек сможет набрать на своем языке свою страну
Russian Federation (написано по нормальному)
Российская Федерация (написано чуть ниже не выделяющимся шрифтом и цветом)
+ включить это в поиск, тогда человек сможет набрать на своем языке свою страну
Кликабельная карта — самый удачный интерфейс. При клике на континенте, открывается карта континента, затем страны, затем карта области, а маленький город можно выбрать из списка.
Ужас какой. Я за это в свое время жутко матерился на установщик Федоры…
Почему же? Гораздо удобнее и быстрее, чем пролистывать список из 500 элементов.
Ну, во-первых, «согласно ISO 3166, в нём 249 стран».
Во-вторых, вы не можете эффективно управлять такой картой с клавиатуры.
В-третьих она занимает очень много места и заставляет напрягать серые клеточки мозга, чтобы вспомнить, где находится моя страна (в случае с городами все еще печальней). А это ведет к увеличению кол-ва ошибок.
И это не полный список, хотя мне достаточно только первого пункта, чтобы сказать «ужас какой».
Во-вторых, вы не можете эффективно управлять такой картой с клавиатуры.
В-третьих она занимает очень много места и заставляет напрягать серые клеточки мозга, чтобы вспомнить, где находится моя страна (в случае с городами все еще печальней). А это ведет к увеличению кол-ва ошибок.
И это не полный список, хотя мне достаточно только первого пункта, чтобы сказать «ужас какой».
Думаю с карты достаточно выбрать только континент. Это решит проблему большого кол-ва стран в списке.
Да и сам процесс выбора сделает более увлекательным.
А страну выбирать уже из списка с флагами. Кстати, почему бы не сделать его в несколько колонок?
Прямо руки тянутся написать такой виджет)
Да и сам процесс выбора сделает более увлекательным.
А страну выбирать уже из списка с флагами. Кстати, почему бы не сделать его в несколько колонок?
Прямо руки тянутся написать такой виджет)
omg! ну наконец-то у кого-то дошли руки, так просто и так эффективно! УАПЩЕ КРАСАФЧЕГИ!
Я за! за удобный интернет и прочая. Глупо было изобретать компьютеры чтобы потом тратить жизнь на поиск страны в выпадающем списке. Они бы туда ещё галактики добавили. Очень понравилось решение и его исполнение.
Sign up to leave a comment.
Как улучшить выбор страны из списка