01

选择与数据相符的输入类型

email、tel、url、number 和日期类型會影響手机键盘、验证和輔助技术。電話號碼通常不適合 number,因为前导零、加號和空格都有意义;金額亦应按业务規则处理小数与地区格式。

搭配 inputmode 和 autocomplete 提供額外提示,但伺服器仍必須验证。不要只依賴键盘外觀限制用户输入。

02

确认键盘不會遮挡目前任务

在 iOS Safari 和 Android Chrome 实际聚焦页面底部的栏位,确认目前输入框、错误信息和下一步按钮仍可見。固定於底部的 CTA、Cookie 橫幅及聊天按钮很容易在键盘出现后重疊。

  • 测试第一个和最后一个栏位
  • 测试直向及橫向
  • 测试页面缩放及较大文字
  • 确认键盘的下一項、完成和返回行为
03

以真实自动填写数据测试

自动填写會一次改变多个栏位,可能繞过只監聽按键的验证逻辑。使用测试姓名、地址、電話和密碼管理器,确认标籤不會被内容遮蓋,国家和地区栏位亦能同步更新。

登入和付款流程要特别测试密碼管理器、一次性验证碼及貼上。禁止貼上通常會降低完成率,也會妨碍安全密碼的使用。

04

让错误信息可見、具体且可恢复

提交失敗后,把焦点移到错误摘要或第一个无效栏位,并在栏位附近說明如何修正。只用紅色边框不足以让色觉障碍或屏幕閱读器用户理解问题。

保留已输入的正确数据,避免一次错误令用户重新填写整張表。伺服器错误、逾时和重複提交亦要有清楚狀态。

05

完整走一次最慢的成功路徑

使用较慢网络、较长姓名、国际電話、複杂地址和附件完成一次提交。记录每一步的 viewport、键盘狀态、預期結果及实际結果,并确认成功页不會因重新整理而重複提交。