表单填写过程中的信息提示

表单中常见的信息提示

占位符标签

与标签相关性弱,提示信息较少,概括回答方式。填写表单时占位符清空。

标签辅助文字

对标签的补充说明,文本数量需要压缩到最少。

帮助信息

a.输入框周围:通常右侧或标签下方,视必要程度常驻或即时提示,解释信息用途或填写规则。

b.浮窗:pc端鼠标悬浮触发(0.5s左右延时避免经过触发),不适合移动端。

错误信息

错误信息需要引起注意,视觉层级较高。通常置于输入框右侧更符合阅读习惯。当数据规则条件较多或屏幕水平空间不足时可置于输入框下侧,但提示导致页面内容下移可能需要动画效果弥补。通常为避免颜色识别障碍,提示信息添加图标并提升识别效率。即时验证错误(最好在明确填写结束后)并提供可操作的修改建议避免错误循环。


ps:验证应在填写结束之后。正确信息提示不阻止进程即可,鼓励接下来的操作。

表单应包含全局反馈,信息提交按钮禁用取消/提交后反馈结果等。

填写表单过程中的信息提示
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一. 表单设计的影响与原则 1.1 表单的产生 由内而外,网站根据自身信息存储格式要求,从数据库映射成表单。 由外...
    晓梦蝉君阅读 12,248评论 1 30
  • 很多设计师的一部分工作是中后台管理系统的交互设计工作或者界面设计工作,其实大部分的后台管理系统中百分之八十以上业务...
    流粒子阅读 32,413评论 5 178
  • 本文中,我们会讨论如何通过优化错误提示信息,来优化UI表单的设计。 在UI界面的设计中,用户的操作失误不可避免,通...
    Shell_Xiao糯米阅读 4,934评论 5 22
  • 日常生活中,我们经常会被要求填写各种各样的表单:登录/注册、提交申请、购买商品……等等。即使是很简短的表单人们仍然...
    lucky璐瑶阅读 2,165评论 0 9
  • 最近几天拜读了吴军老师的《态度》这本书,这本书收录了40封吴军老师写给女儿的家书。谈到了年轻人在成长过程中遇到的有...
    景琛阅读 435评论 0 0