热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

界面设计不容忽视的5个规则(上)

  目前流行的界面风格有三种方式:多窗体、单窗体以及资源管理器风格,无论那种风格,以下规则是应该被重视的设置界面背景。  1.易用性:  按钮名称应该易懂,用词准确,屏弃没楞两可的字眼,要与同一界面上

  目前流行的界面风格有三种方式:多窗体、单窗体以及资源管理器风格,无论那种风格,以下规则是应该被重视的设置界面背景

  1.易用性:

  按钮名称应该易懂,用词准确,屏弃没楞两可的字眼,要与同一界面上的其他按钮易于区分,能望文知意最好设置界面背景。理想的情况是用户不用查阅帮助就能知道该界面的功能并进行相关的正确操作。

  易用性细则:

  完成相同或相近功能的按钮用Frame框起来,常用按钮要支持快捷方式设置界面背景

  完成同一功能或任务的元素放在集中位置,减少鼠标移动的距离设置界面背景

  按功能将界面划分局域块,用Frame框括起来,并要有功能说明或标题设置界面背景

  界面要支持键盘自动浏览按钮功能,即按Tab键的自动切换功能设置界面背景

  界面上首先应输入的和重要信息的控件在Tab顺序中应当靠前,位置也应放在窗口上较醒目的位置设置界面背景

  同一界面上的控件数最好不要超过劳过度10个,多于10个时可以考虑使用分页界面显示设置界面背景

  分页界面要支持在页面间的快捷切换设置界面背景,常用组合快捷键Ctrl+Tab

  默认按钮要支持Enter及选操作,即按Enter后自动执行默认按钮对应操作设置界面背景

界面设计不容忽视的5个规则(上)

  可写控件检测到非法输入后应给出说明并能自动获得焦点设置界面背景

  Tab键的顺序与控件排列顺序要一直,目前流行总体从上到下,同时行间从左到右的方式设置界面背景

  复选框和选项框按选择几率的高底而先后排列设置界面背景

  复选框和选项框要有默认选项,并支持Tab选择设置界面背景

  选项数相同时多用选项框而不用下拉列表框设置界面背景

  界面空间较小时使用下拉框而不用选项框设置界面背景

  选项数叫少时使用选项框,相反使用下拉列表框设置界面背景

  专业性强的软件要使用相关的专业术语,通用性界面则提倡使用通用性词眼设置界面背景

  2.规范性:

  通常界面设计都按Windows界面的规范来设计,即包含"菜单条、工具栏、工具厢、状态栏、滚动条、右键快捷菜单"的标准格式,可以说:界面遵循规范化的程度越高,则易用性相应的就越好设置界面背景。小型软件一般不提供工具厢。

  规范性细则:

  常用菜单要有命令快捷方式设置界面背景

  完成相同或相近功能的菜单用横线隔开放在同一位置设置界面背景

  菜单前的图标能直观的代表要完成的操作设置界面背景

  菜单深度一般要求最多控制在三层以内设置界面背景

  工具栏要求可以根据用户的要求自己选择定制设置界面背景

  相同或相近功能的工具栏放在一起设置界面背景

  工具栏中的每一个按钮要有及时提示信息设置界面背景

  一条工具栏的长度最长不能超出屏幕宽度设置界面背景

  工具栏的图标能直观的代表要完成的操作设置界面背景

  系统常用的工具栏设置默认放置位置设置界面背景

  工具栏太多时可以考虑使用工具厢设置界面背景

  工具箱要具有可增减性,由用户自己根据需求定制设置界面背景

  工具箱的默认总宽度不要超过屏幕宽度的1/5设置界面背景

  状态条要能显示用户切实需要的信息设置界面背景,常用的有:

  目前的操作、系统状态、用户位置、用户信息、提示信息、错误信息等,如果某一操作需要的时间较长,还应该显示进度条和进程提示设置界面背景

  滚动条的长度要根据显示信息的长度或宽度能及时变换,以利于用户了解显示信息的位置和百分比设置界面背景

  状态条的高度以放置五好字为宜,滚动条的宽度比状态条的略窄设置界面背景

  菜单和工具条要有清楚的界限;菜单要求凸出显示,这样在移走工具条时仍有立体感设置界面背景

  菜单和状态条中通常使用5号字体设置界面背景。工具条一般比菜单要宽,但不要宽的太多,否则看起来很不协调。

  右键快捷菜单采用与菜单相同的准则设置界面背景

  3.帮助设施:

  系统应该提供详尽而可靠的帮助文档,在用户使用产生迷惑时可以自己寻求解决方法设置界面背景

  帮助设施细则:

  帮助文档中的性能介绍与说明要与系统性能配套一致设置界面背景。(我们的系统帮助文档都是系统的祖先时期的说明,让人困惑)。

  打包新系统时,对作了修改的地方在帮助文档中要做相应的修改设置界面背景

  操作时要提供及时调用系统帮助的功能设置界面背景。常用F1。

  在界面上调用帮助时应该能够及时定位到与该操作相对的帮助位置设置界面背景。也就是说帮助要有即时针对性。

  最好提供目前流行的联机帮助格式或HTML帮助格式设置界面背景

  用户可以用关键词在帮助索引中搜索所要的帮助,当然也应该提供帮助主题词设置界面背景

  如果没有提供书面的帮助文档的话,最好有打印帮助的功能设置界面背景

  在帮助中应该提供我们的技术支持方式,一旦用户难以自己解决可以方便的寻求新的帮助方式设置界面背景

  4.合理性:

  屏幕对角线相交的位置是用户直视的地方,正上方四分之一处为易吸引用户注意力的位置,在放置窗体时要注意利用这两个位置设置界面背景

界面设计不容忽视的5个规则(上)

  合理性细则:

  父窗体或主窗体的中心位置应该在对角线焦点附近设置界面背景

  子窗体位置应该在主窗体的左上角或正中设置界面背景

  多个子窗体弹出时应该依次向右下方偏移,以显示窗体出标题为宜设置界面背景

  重要的命令按钮与使用较频繁的按钮要放在界面上注目的位置设置界面背景

  错误使用容易引起界面退出或关闭的按钮不应该放在易点位置设置界面背景。横排开头或最后与竖排最后为易点位置。

  与正在进行的操作无关的按钮应该加以屏蔽(Windows中用灰色显示,没法使用该按钮)设置界面背景

  对可能造成数据无法恢复的操作必须提供确认信息,给用户放弃选择的机会设置界面背景

  非法的输入或操作应有足够的提示说明设置界面背景

  对运行过程中出现问题而引起错误的地方要有提示,让用户明白错误出处,避免形成无限期的等待设置界面背景

  提示、警告、或错误说明应该清楚、明了、恰当设置界面背景

  5.美观与协调性:

  界面应该大小适合美学观点,感觉协调舒适,能在有效的范围内吸引用户的注意力设置界面背景

  美观与协调性细则:

  长宽接近黄金点比例,切忌长宽比例失调、或宽度超过长度设置界面背景

  布局要合理,不宜过于密集,也不能过于空旷,合理的利用空间设置界面背景

  按钮大小基本相近,忌用太长的名称,免得占用过多的界面位置设置界面背景

  按钮的大小要与界面的大小和空间要协调设置界面背景

  避免空旷的界面上放置很大的按钮设置界面背景

  放置完控件后界面不应有很大的空缺位置设置界面背景

  字体的大小要与界面的大小比例协调, 通常使用的字体中宋体9-12较为美观,很少使用超过12号的字体设置界面背景

  前景与背景色搭配合理协调,反差不宜太大,最好少用深色,如大红、大绿等设置界面背景。常用色考虑使用Windows界面色调。

  如果使用其他颜色,主色要柔和,具有亲和力与磁力,坚决杜绝刺目的颜色设置界面背景

  大型系统常用的主色有"#E1E1E1"、"#EFEFEF"、"#C0C0C0"等设置界面背景

  界面风格要保持一致,字的大小、颜色、字体要相同,除非是需要艺术处理或有特殊要求的地方设置界面背景

  如果窗体支持最小化和最大化或放大时,窗体上的控件也要随着窗体而缩放;切忌只放大窗体而忽略控件的缩放设置界面背景

  对于含有按钮的界面一般不应该支持缩放,即右上角只有关闭功能设置界面背景

  通常父窗体支持缩放时,子窗体没有必要缩放设置界面背景

  如果能给用户提供自定义界面风格则更好,由用户自己选择颜色、字体等设置界面背景

  未完待续……

  以上文章仅代表个人观点设置界面背景,有什么意见和建议的可以加入我们,我们愿意和你一起讨论!

  学习交流QQ群:455780480

  学习热线:4000-100-444

  网址:

  北京校区地址:北京中关村中科大厦5层(环境一流设置界面背景,设施齐全)


推荐阅读
  • 本文详细介绍了PHP中的几种超全局变量,包括$GLOBAL、$_SERVER、$_POST、$_GET等,并探讨了AJAX的工作原理及其优缺点。通过具体示例,帮助读者更好地理解和应用这些技术。 ... [详细]
  • 本文概述了在GNU/Linux系统中,动态库在链接和运行阶段的搜索路径及其指定方法,包括通过编译时参数、环境变量及系统配置文件等方式来控制动态库的查找路径。 ... [详细]
  • Docker基础入门与环境配置指南
    本文介绍了Docker——一款用Go语言编写的开源应用程序容器引擎。通过Docker,用户能够将应用及其依赖打包进容器内,实现高效、轻量级的虚拟化。容器之间采用沙箱机制,确保彼此隔离且资源消耗低。 ... [详细]
  • 本文回顾了作者在求职阿里和腾讯实习生过程中,从最初的迷茫到最后成功获得Offer的心路历程。文中不仅分享了个人的面试经历,还提供了宝贵的面试准备建议和技巧。 ... [详细]
  • 我的读书清单(持续更新)201705311.《一千零一夜》2006(四五年级)2.《中华上下五千年》2008(初一)3.《鲁滨孙漂流记》2008(初二)4.《钢铁是怎样炼成的》20 ... [详细]
  • 本文详细介绍了JavaScript中数组的转换方法、栈方法、队列方法、重排序方法及操作方法,包括toLocaleString()、toString()、valueOf()等基本转换方法,以及push()、pop()、shift()、unshift()等用于模拟栈和队列行为的方法。 ... [详细]
  • MKVToolNix 37.0.0 正式发布:增强的 MKV 格式处理工具
    MKVToolNix 37.0.0 版本现已推出,这是一款专为处理 Matroska (MKV) 格式的强大工具。它能够将各种视频、音频及字幕格式整合进 MKV 文件中。本次更新带来了新的功能和多项 Bug 修复。 ... [详细]
  • 分布式计算助力链力实现毫秒级安全响应,确保100%数据准确性
    随着分布式计算技术的发展,其在数据存储、文件传输、在线视频、社交平台及去中心化金融等多个领域的应用日益广泛。国际知名企业如Firefox、Google、Opera、Netflix、OpenBazaar等均已采用该技术,推动了技术创新和服务升级。 ... [详细]
  • 正则表达式入门指南
    本文基于《正则表达式必知必会》(作者:Ben Forta,译者:杨涛),介绍了正则表达式的基本概念及其应用,包括搜索与替换功能,以及元字符的分类与使用。 ... [详细]
  • 本文详细介绍了如何在PHP中使用Memcached进行数据缓存,包括服务器连接、数据操作、高级功能等。 ... [详细]
  • 如何高效学习鸿蒙操作系统:开发者指南
    本文探讨了开发者如何更有效地学习鸿蒙操作系统,提供了来自行业专家的建议,包括系统化学习方法、职业规划建议以及具体的开发技巧。 ... [详细]
  • 如何寻找程序员的兼职机会
    随着远程工作的兴起,越来越多的程序员开始寻找灵活的兼职工作机会。本文将介绍几个适合程序员、设计师、翻译等专业人士的在线平台,帮助他们找到合适的兼职项目。 ... [详细]
  • 视觉Transformer综述
    本文综述了视觉Transformer在计算机视觉领域的应用,从原始Transformer出发,详细介绍了其在图像分类、目标检测和图像分割等任务中的最新进展。文章不仅涵盖了基础的Transformer架构,还深入探讨了各类增强版Transformer模型的设计思路和技术细节。 ... [详细]
  • 华硕TUF B360M-PLUS主板兼容Win7及安装指南
    本文详细介绍了如何在华硕TUF B360M-PLUS主板上安装Windows 7操作系统,包括必要的准备工作和具体的操作步骤。 ... [详细]
  • 知识图谱与图神经网络在金融科技中的应用探讨
    本文详细介绍了融慧金科AI Lab负责人张凯博士在2020爱分析·中国人工智能高峰论坛上的演讲,探讨了知识图谱与图神经网络模型如何在金融科技领域发挥重要作用。 ... [详细]
author-avatar
手机用户2502879747
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有