浅谈设计师在设计表单时需要注意的三点问题

  何为表单?表单的主要功能是为了要采集用户的数据。这些数据需要我们的用户自己去填写,如我们的用户的昵称、email、性别等等。而表单的到处我们都可以见到,就例如我们的注册页面,我们卸载软件后的用户反馈页面等等。可以不客气的说一个好的表单页面不仅可以提高用户的友好体验,更能准确的获得我们所想要的用户数据。相反的,一个糟糕的表单页面只会让你受到没有价值的数据或者访客的流逝。那么表单设计我们需要注意什么细节呢?在下文中,笔者将会通过三个例子来进进行分析。

  一:提供一个内容整洁清晰的表单页面

  对于我们的表单页面我们第一件事情要做的就是明确的像我们的用户传递表单的性质及其作用。同时接着我们需要提高一个内容整洁清晰的表单页面。常见的表单页面我们可以分成三种,有纵向排列的、有分页显示填写的,也有左右布局的。这三种表单布局类型页面是我们最常见到的。如下图是笔者卸载酷我音乐盒后的表单页面

  

  很多软件开发商为了得到用户卸载的原因进而改善软件会在软件被卸载后跳出调查的表单页面。上图的这一表单为常见的纵向排列表单,我们可以看出其设计的细节就是尽量的简单,同时尽量的减少用户的输入,提供选择项。用户卸载你的软件已经表明对你的软件不满,你已经没有什么资本让用户去填写繁琐的表单。只有使用简洁的操作才能获得更多的用户使用数据。

  二:表单填写帮助提示

  用户在填写表单的时候难免出现错误,尤其是在注册的时候。目前很多站点在注册的时候都对昵称、邮箱、密码等进行了一系列的限制。而如何提示用户准确的填写表单是提高用户友好体验的关键。我们需要然给用户知道,填写完错误信息后如何处理?填写的信息什么地方出现错误?以及如何修改错误等等。如下图所示A5的注册页面。

  

  上图中我们可以发现,例如当我们输入一个错误格式或者已经被注册过的邮箱的时候,会在表单的旁边出现错误的提示,同时使用红色的字体可以达到醒目的效果。

  三:表单设计需要创新

  一个一层不变的表单页面会很容易让访客失去兴趣。如果你是一个需要吸引到大量的用户进行数据调查的表单,如果你不能提供一个创新的表单页面,很难吸引到访客的填写。通过表单设计风格的创新吸引访客是每一个设计师优化表单中最重要的事情。如下图所示几个创新的表单页面。

  

  创新图一

  

  创新图二

  

  创新图三

  以上是笔者对于表单页面设计的三点总结。从表单的布局,表单与用户的互动以及表单的创新设计三个方面分享自己的三点心得。希望对于大家在设计自己的表单页面有所帮助。本文由苏州网站建设http://www.buguwangluo.com/ 原创,转载请保留地址。

时间: 2024-09-20 20:40:47

浅谈设计师在设计表单时需要注意的三点问题的相关文章

浅谈php提交form表单

  这篇文章主要介绍了浅谈php提交form表单的2种方法和简单的示例,十分的实用,有需要的小伙伴可以参考下. 处理GET请求 实现的功能是输入姓名后页面显示"Hello XXX" 创建html文件hello.html: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"

浅谈php提交form表单_php技巧

处理GET请求 实现的功能是输入姓名后页面显示"Hello XXX" 创建html文件hello.html: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>欢迎</title> </head> <body> <form action="hell

你会设计表单吗?网页表单结构设计

网页制作Webjx文章简介:Web表单设计:表单结构. 你是否曾为表单设计感到过沮丧或不知所措呢?接下来三篇文章,希望能彻底改变你的看法,真正爱上Web表单设计.首先感谢Luke Wroblewski的帮助,让我有机会细心品味设计表单的乐趣.总体来说,Web表单主宰着结算.注册和数据输入.每天eBay.Taobao上的大量物品主要通过出售物品(Sell Your Item)表单售出:MySpace.Facebook等超过几亿的用户都是通过Web表单加入网站社区的:YouTube.Youku通过上

Web表单设计:表单结构

[版权声明]:版权归作者Alite所有,转载时请以超链接形式标明文章原始出处和作者信息及本声明 原文地址::http://www.alitedesign.com 你是否曾为表单设计感到过沮丧或不知所措呢?接下来三篇文章,希望能彻底改变你的看法,真正爱上Web表单设计.首先感谢Luke Wroblewski的帮助,让我有机会细心品味设计表单的乐趣.总体来说,Web表单主宰着结算.注册和数据输入.每天eBay.Taobao上的大量物品主要通过出售物品(Sell Your Item)表单售出:MySp

设计注册表单时关于密码遮蔽问题的探讨

摘要: 很实用的一篇关于密码遮蔽问题的探讨,翻译贡献给大家,希望对大家在设计注册表单时有所启示. 密码遮蔽是一种很老做法,通常用于注册和登录的表单,用来防止窥探者看到用户的 很实用的一篇关于密码遮蔽问题的探讨,翻译贡献给大家,希望对大家在设计注册表单时有所启示. 密码遮蔽是一种很老做法,通常用于注册和登录的表单,用来防止窥探者看到用户的密码.尽管密码遮蔽是很好的保护安全的做法,它仍可能危及到注册表单的体验.当用户注册时,他们期待填写一个无争议.没有后顾之忧的表单,而密码遮蔽会起到反作用. 一.适

html-在设计表单提交时为什么更多的是用button而不是submit?

问题描述 在设计表单提交时为什么更多的是用button而不是submit? RT.button的优势在哪里?submit难道不是更直观一点吗? 解决方案 submit有时直接就提交了,不走javaScript等等,button是可以走javaScript和后台代码的.这是我个人理解. 解决方案二: 现在更多的人用button来做异步提交 解决方案三: submit默认为form提交,可以提交表单(form). button则响应用户自定义的事件 如果不指定onclick等事件处理函数,它是不做任

浅议Web网页Form表单设计技巧

web|技巧|设计|网页 "输入框( Input )应当符合逻辑地划分为小组,这样大脑就可以很好的处理大堆区域间的关系."– <HTML权威指南> Web 应用程序总是利用表单来处理数据录入和配置,但并不是所有的表单都保持一致.输入区域的对齐方式,各自的标签(label),操作方式,以及周围的视觉元素都会或多或少影响用户的行为. 表单布局 考虑到用户完成表单填写的时间应当尽可能的短,并且收集的数据都是用户所熟悉的(比如姓名.地址.付费信息等),垂直对齐的标签和输入框可以说是

如何为复杂应用设计表单

本文讲的是如何为复杂应用设计表单, 呈现表单的13种方法与数据输入的未来 从复杂的 ERP(Enterprise Resource Planning,企业资源计划)系统到 Facebook,是数据的输入让应用们有了意义.表单在许多时候是用户提交数据的一个必经入口.本文介绍了呈现表单的 13 种不同的方法,并探讨了数据输入的未来. 模态对话框(Modal) 简洁的窗口在低复杂度要求和数据有限的情况下很适用.窗口通常很容易实现,并且会有一个很直接了当的用户体验.然而,复杂的交互往往需要额外的窗口或弹

ckeditor-CKEDITOR模态窗口提交表单时能不弹出新窗口吗?

问题描述 CKEDITOR模态窗口提交表单时能不弹出新窗口吗? 按照http://www.iteye.com/topic/749437 该文章内容实现ckeditor在jsp下增加图片上传功能中遇到上传图片的模态窗口在表单提交时,总是弹出新窗口,我在 中间添加了.还是不管用,那位大侠能帮助解决一下? 以下是代码 修改控件代码: ` function addUploadButton(editor){ CKEDITOR.on('dialogDefinition', function( ev ){ v