当前位置:首页 > 网站建设

实战经验!如何做好网页后台的表单和表格设计?

时间:2018-03-30 06:00:00来源:网站建设 作者:seo实验室小编 阅读:61次
 

网页设计表单

带有识别功能的输入框:

当输入有误时,尽量避免弹出框提示,可以直接对输入框设计不同的状态显示默认状态、选中状态、错误状态、成功状态。

通过以上方式设计的一组信息录入型的表单设计,如图:

表单的设计可以单独出一篇更详细的文章,还有筛选/选择器一类的表单,这里就不一一描述了。

友好舒适的弹窗

弹窗在后台的出现频率非常高,其强度一般分为三种,弱弹窗、强弹窗、重弹窗。字面上已经很好理解,轻弹窗,一般鼠标经过的时候即可出现而不用点击,比如提示说明,显示更多信息,鼠标移过后立即消失,它不会影响下一层(当前页面内容)页面的视觉效果和操作,因此这个弹窗通常会设计一个浮动带有阴影效果的框。

而强弹窗则是一个对话框,它暗示你必须对这个对话框进行操作后才可以离开,如确认信息、错误提示信息。而重弹窗更像是一个新的页面,比如弹出的列表,详情,表单等。这两种弹窗通常是点击某一个按钮/经过某一个操作触发的。这两种弹窗一般会对下一层页面的视觉做蒙版处理,比如加上一定透明的黑色/白色,给下一层页面的内容做模糊滤镜等等。

当然,这三种弹窗式可以结合的,针对不同场景使用不同的弹窗设计这点非常重要,这直接关系到用户体验效果。你是否可曾遇到过使用一款产品时,动不动就弹窗,并且需要去点某一个按钮才可以关闭。

任何一种场景在设计上都可以得以解决,什么情况下使用什么弹窗设计,或者有时候必须使用强弹窗,但是又不想让用户操作关闭,我们可以设计几秒后自动关闭,或者点击弹窗以外的区域直接关闭。

弹窗还有两种主要的表现形式,一种是顶部有关闭按钮,另外一种是直接点击确认按钮或者读秒关闭。在保持规范性的同时,尽量避免按钮功能的重复,比如一个提示信息必须让用户点击确认按钮才可以关闭,那么就使用没有顶部关闭按钮的设计。对于重弹窗,一般都会采用顶部有关闭按钮的设计。

弹窗并不是后台的专利,它在移动端更高频率的出现,例如活动页面的弹窗,趣味性就显得更重要了。

总结:

这篇文章主要跟大家分享的是,当开始网页后台项目设计的时候,保持跟产品和前端的良好沟通。确定风格后开始设计,并分享了 3 个主要的点:

制作灵活又简洁的表格设计整齐并带有交互功能的表单选择友好舒适的弹窗

后台还有其他元件设计,欢迎大家共同探讨。

相关阅读

淘宝爆款单品月纯利100万运营实战

感谢青枫 微信/QQ:188166335的投稿!前段时间发表了《谈互联网创业的坚持与执行力》,得到很多网友的支持,在此特别感谢。有个网友留言

实战利用陆家嘴29秒小视频热点引爆上千精准男性流量

又是好久没写文章了,大家都知道,我写东西都是要求实战过之后,然后写成案例给大家学习,所以写的就比较少了,也是因为自己手里有业务要做

最新论坛运营推广实战案例+详解方法(2.8万的课)

今天这篇主要是分享论坛推广的成功案例和实操方法,能让你轻松了解及快速复制该方法,而上一篇(2016年论坛运营推广最新实战分享(有温

创业公司如何做推广?7年老司机实战案例解析!

58月嫂市场推广方案方案背景1:58月嫂(嘉堡服务)2:月嫂+互联网机构,专注于月嫂服务,月嫂培训以及医院护工服务。3:网址:www.ihomeclub.cn4:

B2B网站SEO优化实战经验分享

导读:实战的文章就是好,图文并茂的讲诉了SEO优化过程,比谈理论的SEO文章要好狠多,手把手教你通过站内、站外的SEO优化,作者接手半年的

分享到:
发表评论
用户名: 密码: 匿名

栏目导航

推荐阅读

热门阅读