选择下拉列表可访问性/可用性
我试图找到最可用/最容易访问的方法来实现一个简单的表单下拉列表,该列表将按图片和字母顺序对产品列表进行排序。
您认为,当有一个按钮控制其提交时,或者当下拉菜单发生更改时自动提交时,下拉菜单是否更有用?
我读过的研究既支持也反对这种方法,并且网络上有各种各样的实现方式,因此有兴趣听到社区的想法。
提前致谢
I am trying to find the most usable/accessible way to implement a simple form dropdown list which will sort a list of products by pice and alphabetical order.
In your opinion is the dropdown more usable when there is a button that governs its submission or when it automatically submits onchange of the dropdown?
The research I have read is both for and against such methods and there is a variery of implementations on the web so interest to hear the thoughts of the community.
Thanks in advance
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
作为盲人计算机用户,这两种方法都可以正常工作。我发现单击按钮对我来说比 onchange 事件触发稍微容易一些。尽管假设大多数用户不会被禁用,但我不会说这是一个足够大的差异来考虑。如果您专门针对盲人用户,我不会使用 onchange 事件。
As a blind computer user either method works fine. I find that having a button to click is slightly easier for me then the onchange event firing. I wouldn't say it's a big enough difference to take into account though assuming the majority of your users will not be disabled. If your targeting specifically blind users I would not use the onchange event.
只要您在选择更改时不改变焦点或导航到另一个页面,任何一种方法都应该有效。问题下拉列表的典型示例是它包含网站上其他页面的列表,并在选择更改后立即导航。这可以防止键盘用户使用该列表;他们无法浏览它,也无法导航到第一个选择之外的任何页面,因为不可能导航到这些页面。因此,在焦点发生变化或页面导航的情况下,使用单独的操作(例如“Go”按钮或处理输入)来导致导航发生是必不可少的。您所读到的建议很可能来自于此。
然而,在这种情况下,听起来好像您只是更新页面上其他位置的内容,而不是更改焦点或进行导航。简单地利用现有内容应该没问题。
So long as you do not change focus or navigate to another page when the selection changes, either approach should work. The classic example of a problem dropdown is where it contains a list of other pages on the site, and navigates as soon as the selection changes. This prevents a keyboard user from using the list; they can't browse it, and can't navigate to any pages beyond the first selection, since it's impossible to navigate past those. So in cases where focus changes or the page navigates as a consequence, having a separate action (eg. Go button, or handling enter) to cause the navigation to take place is essential. This is likely where the advice you've read is coming from.
In this case, however, it sounds as though you are just updating content elsewhere on the page, and not changing focus or doing navigation. Simply resorting existing content should be fine.
取决于您的用户及其各自的期望以及呈现的上下文。
作为一个笼统的一般性声明,您应该有下拉菜单并附有非常明显的提交按钮。这是更安全的方法。
Depends on your users and their respective expectations and the context in which it's presented.
As a blanket, general statement, you should have the drop down accompanied by very obvious submission button. That is the safer approach.
如果您正在刷新页面数据或者选择下拉选项后焦点移开,则应使用可访问的按钮。如果您在更改时触发事件,盲人或仅使用键盘的用户将根本无法使用下拉菜单,如果他们使用的是 ie 和 chrome 的 Windows(所以加在一起,大多数使用 Windows 的人)。一旦他们使用箭头向下滚动并进行选择,他们点击的第一个选项将被选中,页面数据将刷新或焦点将移动,使他们无法导航或选择第二个选项、第三个选项等等。下面是带有示例的详细解释,以便您明白我的意思。
设计师肯定不喜欢这些按钮,但如果你是盲人并且使用的是 chrome/ie,那么没有它就不可能使用大量下拉菜单。我猜 Jared 使用的是 Firefox 或 Mac。
http://pauljadam.com/博客/javascript/onchange-event-on-a-select-inputjump-menu-accessibility-problems/
If you are refreshing page data or if the focus moves away after the dropdown option is selected, you should use a button to be accessible. If you fire the event on change, blind or keyboard-only users will not be able to use the dropdown menu at all if they are on windows with ie and chrome (so added together, a majority of the people on windows). As soon as they use the arrows to scroll down and make a selection, the first option they hit will be selected and the page data will refresh or the focus will move, making it impossible for them to navigate or select the second option, third option, etc. Below is a thorough explanation with examples so you can see what I mean.
Designers definitely don't like the buttons, but if you are blind and on chrome/ie, it is impossible to use a lot of dropdowns without it. I'm guessing Jared uses firefox or a mac.
http://pauljadam.com/blog/javascript/onchange-event-on-a-select-inputjump-menu-accessibility-problems/