少问、问清楚
弗罗布莱夫斯基（2008）主张只问必要的问题、标签简短清晰、只突出一个主按钮。窄屏上把标签放在输入框上方视线移动最少（Penzo, 2006），仅用占位文字代替标签则会在输入时消失。减少字段也直接减少营销漏斗中的流失。
键盘与输入方式
用type="email"、inputmode="numeric"调出合适键盘，用autocomplete自动填充地址与卡号。选项少时，可见按钮优于下拉框，库珀等（2004）发现下拉框中最先可见的选项会吸引作答。控件还需符合触控目标尺寸。
错误提示与无障碍
巴尔加斯-阿维拉等（2007）发现离开字段后或提交时在字段旁显示错误，比输入中即时弹出更有效；塞克勒等（2014）证实应用20条准则可减少错误与耗时。WCAG 2.2要求提供标签与错误识别，表单是网页无障碍的核心。
常见问题
- 标签放在哪里？
- 放在输入框正上方最易读。
- 何时显示错误？
- 离开字段后或提交时，在字段旁并附修改方法。
来源核查日期：2026-10-27
参考文献
- Wroblewski, L. (2008). Web form design: Filling in the blanks. Rosenfeld Media. 系统整理标签位置、字段数量与按钮布局的经典实务书。
- Bargas-Avila, J. A., Oberholzer, G., Schmutz, P., de Vito, M., & Opwis, K. (2007). Usable error message presentation in the World Wide Web: Do not show errors right away. Interacting with Computers, 19(3), 330–341. 实验研究何时何处显示错误信息。
- Seckler, M., Heinz, S., Bargas-Avila, J. A., Opwis, K., & Tuch, A. N. (2014). Designing usable web forms: Empirical evaluation of web form improvement guidelines. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1275–1284). ACM. 证明应用20条表单准则可减少错误与完成时间。
- Bargas-Avila, J. A., Brenzikofer, O., Tuch, A. N., Roth, S. P., & Opwis, K. (2011). Working towards usable forms on the World Wide Web: Optimizing multiple selection interface elements. Advances in Human-Computer Interaction, 2011, Article 347171. 比较复选框、列表等多选元素。
- Couper, M. P., Tourangeau, R., Conrad, F. G., & Crawford, S. D. (2004). What they see is what we get: Response options for web surveys. Social Science Computer Review, 22(1), 111–127. 发现下拉框中最先可见的选项会吸引作答。
- Penzo, M. (2006). Label placement in forms. UXmatters. 用眼动追踪比较标签位置，支持顶部标签。
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2 (W3C Recommendation). 包含标签（3.3.2）、错误识别（3.3.1）与避免重复输入（3.3.7）。