选择与数据相符的输入类型
email、tel、url、number 和日期类型會影響手机键盘、验证和輔助技术。電話號碼通常不適合 number,因为前导零、加號和空格都有意义;金額亦应按业务規则处理小数与地区格式。
搭配 inputmode 和 autocomplete 提供額外提示,但伺服器仍必須验证。不要只依賴键盘外觀限制用户输入。
确认键盘不會遮挡目前任务
在 iOS Safari 和 Android Chrome 实际聚焦页面底部的栏位,确认目前输入框、错误信息和下一步按钮仍可見。固定於底部的 CTA、Cookie 橫幅及聊天按钮很容易在键盘出现后重疊。
- 测试第一个和最后一个栏位
- 测试直向及橫向
- 测试页面缩放及较大文字
- 确认键盘的下一項、完成和返回行为
以真实自动填写数据测试
自动填写會一次改变多个栏位,可能繞过只監聽按键的验证逻辑。使用测试姓名、地址、電話和密碼管理器,确认标籤不會被内容遮蓋,国家和地区栏位亦能同步更新。
登入和付款流程要特别测试密碼管理器、一次性验证碼及貼上。禁止貼上通常會降低完成率,也會妨碍安全密碼的使用。
让错误信息可見、具体且可恢复
提交失敗后,把焦点移到错误摘要或第一个无效栏位,并在栏位附近說明如何修正。只用紅色边框不足以让色觉障碍或屏幕閱读器用户理解问题。
保留已输入的正确数据,避免一次错误令用户重新填写整張表。伺服器错误、逾时和重複提交亦要有清楚狀态。
完整走一次最慢的成功路徑
使用较慢网络、较长姓名、国际電話、複杂地址和附件完成一次提交。记录每一步的 viewport、键盘狀态、預期結果及实际結果,并确认成功页不會因重新整理而重複提交。