与几十年来一直使用的键盘和鼠标相比,触摸键盘是一种相对较新的输入方式。移动触摸键盘的布局存在限制,可能会阻碍客户在结账流程中的导航能力。为了提升客户的用户体验(UX),需要为客户创造一个易于输入的环境。
显示适合字段的键盘
只需对输入字段的代码进行少量修改,即可自动为手机号码字段显示针对所需输入格式优化的特定类型键盘。
例如,在信用卡号码和手机号码输入字段中启动数字键盘,而在电子邮件地址字段中启动邮件专用键盘。
对于需要输入数字的字段(如信用卡号码),不应使用标准键盘布局(左图)。相反,应使用按键数量较少、尺寸较大且仅包含数字的键盘(右图)。
根据贝马德的移动测试,客户不仅认可他们可以使用适合现场的专用键盘,而且也从中受益。
通过这种实现方式,可以节省以往手动切换键盘布局所花费的时间。此外,用于数字输入的专用键盘具有比普通键盘更大的按键,以减少打字错误,从而最大限度地降低误输入的可能性。iPhone的数字键命中区域比传统触摸键盘的数字键盘增加了约500%。
特殊キーボードなら重要なキーにアクセスしやすくなり、より迅速に入力できるようになります。例えば標準キーボードでは、メールアドレスの入力に必須の「@」マークが表示されていませんが(左)、メールキーボードではこれが表示されます(右)
如上所示,標準キーボードの場合、お客様はメールアドレスを入力するにあたって大文字を解除しなくてはならないだけでなく、@マークも見つけなくてはいけません。在第二张图中显示的专用键盘中,所有字符均为小写,并且为了加快输入速度而显示了@符号。
◇◇◇
有关HTML5代码的完整列表以及基于输入类型启动各种键盘的演示,请参阅baymard.com/labs/touch-keyboard-types。请注意,在使用这些键盘时,只能使用有限的字符集。专用键盘的启动应仅限于适合其使用的字段。
下期将详细讲解如何进一步优化“③信用卡号栏”的用户体验,敬请期待。
【什么是适合移动优先的最佳结账流程?】本节回顾
- 介绍:导致购物车放弃的十个原因
- 改进建议① 提供并突出显示访客购买选项
- 改进建议② 准备合适的触摸键盘布局 ←本次

