为啥和为什么一样吗 为什么和为啥的区别( 四 )

为啥和为什么一样吗 为什么和为啥的区别


另外不要过于关注这个「进度指示器」 。优秀的进度指示器不应该分散用户填写表单的注意力 , 仅仅当添加这个「进度指示器」有助于用户填写时 , 才应该使用 。
3. 将错误信息一直保留在输入框旁边
通过在线验证 , 错误消息会自然的显示在输入框旁边 。有一些基础的规则 , 或者用户大概率会出现的问题 , 即使用户还未填写任何信息 , 也应该以备注的方式在输入框下方标注 , 这是一种非常有性价比的行为 , 将错误信息一直保留在输入框旁边可最大程度的减少用户思考 。
为啥和为什么一样吗 为什么和为啥的区别


4. 错误提示该放输入框哪个方位?
登录注册这块错误消息的两个最常见的位置是表单顶部置和输入框行间那么到底那个位置对用户来说更直观呢?
为啥和为什么一样吗 为什么和为啥的区别


根据上下左右四个位置 , 根据浏览习惯列举出考虑每种情况的设计图一边分析 。
1)右边
网页端微博注册如图错误提示放输入框右边 , 符合人们从左到右从上到下的阅读习惯;用户视觉路径自然流畅 , 很大程度上减少了用户的视觉工作 。
为啥和为什么一样吗 为什么和为啥的区别


Web端输入框较长时 , 输入字段后面往往大段空白 , 接着是错误提示 , 这时候视觉上也存在来回跳跃感;
而移动端屏宽右边显示不了错误提示 , 所以错误提示常出现在输入框下侧 , 若网页和移动端设计保持一致时 , 错误提示就出现在输入框下侧了 。
为啥和为什么一样吗 为什么和为啥的区别


2)左边
错误提示在左侧与用户期望相违背 , 因为错误提示左侧放置更高输入框的优先级 。但事实上用户需要专注于纠正他们的输入 , 因此输入框应该是更重要的元素 。
为啥和为什么一样吗 为什么和为啥的区别


3)上边
当标签在顶部时 , 一共存在标签、错误提示、输入框中的文本3个提示 , 当用户输入错误时 , 视觉来回在标签、错误提示、输入框之间交换 , 用户注意力被分散 , 认知负荷增加 。
为啥和为什么一样吗 为什么和为啥的区别


4)下边
放置下边的错误信息提示 , 虽然不符合从左到右的阅读习惯 , 但它确符合从上倒下的阅读流程 。
手机屏幕缺少水平空间 , 把错误信息提示放置在下方是个不错的选择 。
为啥和为什么一样吗 为什么和为啥的区别


输入框显示错误信息是更加减少用户认知负担 , 可以当场识别错误而不需要视觉来回切换 , 减少记忆负担 , 在表单底部和顶部 。
5. 错误提示与其它内容视觉上区分
出错之后 , 用户需要迅速注意到报错信息 。大多数使用警示色红色 , 红色面积过多往往给人压迫感 , 产生畏难心理 , 所以在其它地方尽量减少红色使用 。
另外考虑到色盲的用户需求 , 我们在错误提示时不仅仅使用颜色标注 , 比如可以加入表示错误的icon , 当前内容抖动等 , 比如QQ登录抖动提示 , 苹果电脑的锁屏密码错误抖动 , 或现在适老化的语音播报……

推荐阅读