移动设备上的下拉列表的可访问性如何?
我正在开发一个移动设备网站,需要用户选择一个产品(总共有大约 70 个)。然而,我目前没有测试设备(我目前也在 Mac 上,不知道有任何适用于 Mac 的移动浏览器模拟器)。
我的问题是,长度约为 70 的下拉列表会太长吗?用户从中选择一个选项有多难(假设页面上没有其他内容)?为了便于讨论,在 iPhone 和 BlackBerry(这是目前对我来说最重要的两个浏览器)上导航有多难?
为了简单起见,我宁愿不拆分列表,但我想如果有必要我可以。有谁对在移动设备上拆分列表/显示表单有更好的想法吗?
为了深入了解为什么我想要一个这样的下拉列表,这样用户就可以选择 2 个产品(两个列表),并且网站将返回它们是否彼此兼容。
I am developing as site for mobile devices which requires the user to select a product (there are ~70 in total). I however do not have a testing device with me at the moment (I am also currently on a Mac and do not know of any mobile browser emulators for Macs).
My question is, would a drop down list of length ~70 be way too long? How hard would it be for a user to select an option from it (assuming there is nothing else on the page)? For the sake of argument, how hard would it be to navigate it on the iPhone and the BlackBerry (those are the two most important browsers for me at the moment)?
I would rather not split up the list for the sake of simplicity but I guess I can if necessary. Does anyone have any better ideas for splitting up the list/displaying the form on a mobile device?
For some insight into why I want a drop down list like this, it is so that users can select 2 products (two lists) and the site will return whether or not they are compatible with each other.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我在尝试在移动网络应用程序中显示国家/地区代码或机场时遇到了这个问题。它确实工作得很好(尤其是在 iPhone 和 BB 上),但您应该尽可能地让选择变得更容易。我们做了类似的事情:
这些建议基于用户尝试执行的操作的上下文在我们的网络应用程序上。希望您能够通过自己的优化获得不同的背景。
给您的一个建议是将您的 UI 从两个下拉列表切换为两个页面 - 在第一页上将所有产品显示为 HTML 链接。当用户选择产品时,导航到第二页,但您现在只能使用与第一页上所选产品兼容的产品填充该页面。查看http://m.jetstar.com,进入预订流程,看看您如何选择出发/到达机场。它可能对你有用吗?
顺便说一句 - 尝试 http://www.iphonetester.com 来了解您的网站在iPhone 的外形尺寸。
祝你好运!
I've had this issue with trying to present country codes or airports in mobile web apps. It does work just fine (especially on iPhone & BB), but you should do as much as you can to make the selection easier. We did things like
This suggestions are based on the context of what the user is trying to do on our webapp. You will have different context with your own optimisations hopefully.
One suggestion for you is to switch your UI from two drop lists to two pages - on the first page display all the products as HTML links. When the user selects a product, navigate to the second page, but you can now populate that only page with products that are compatible with the product selected on the first page. Have a look at http://m.jetstar.com, go to the Booking Process and see how you selecte departure/arrival airports. It might work for you?
BTW - try http://www.iphonetester.com to get a sense of what your website will look like in the iPhone form factor.
Good luck!