页面的规范性

通常网站设计都是按照Windows界面的标准设计的，包括“菜单栏、工具栏、工具箱、状态栏、滚动条、右键快捷菜单”等标准格式。可以说，接口的标准化程度越高，Ease of use 也相应越好。小软件一般不提供工具箱。

要求：

常用菜单有命令快捷方式。

完成相同或相似功能的菜单用水平线分隔并放置在相同的位置。

菜单前面的图标可以直观的表示要完成的操作。

菜单的深度一般要求控制在最多三层以内。

工具栏要求可根据用户要求定制。

具有相同或相似功能的工具栏组合在一起。

工具栏中的每个按钮都应该有及时的提示信息。

工具栏的最大长度不能超过屏幕宽度。

工具栏中的图标可以直观地表示要完成的操作。

设置系统常用工具栏的默认位置。

当您的工具栏太多时，请考虑使用工具箱。

工具箱应可增减，用户可根据需要定制。

工具箱的默认总宽度不应超过屏幕宽度的1/5。

状态栏应该能够显示用户实际需要的信息。常用的有：

当前操作、系统状态、用户位置、用户信息、提示信息、错误信息等。如果某项操作耗时较长，还应显示进度条和进程提示。

滚动条的长度应根据显示信息的长度或宽度及时变化，以便用户了解显示信息的位置和百分比。

状态栏的高度适合放五个好字，滚动条的宽度比状态栏略窄。

菜单和工具栏之间应该有明确的界限；菜单应该突出显示，以便在删除工具栏时它仍然具有三维效果。

字体大小5 通常用于菜单和状态栏。工具栏一般比菜单宽，但也不能太宽，否则会显得不协调。

右键单击上下文菜单遵循与菜单相同的准则。

系统易用性

易用性是指页面上的功能遵循约定俗成，例如：按钮的名称易于理解，用词准确，易于与同一界面上的其他按钮区分开来，可以理解为文本。这样用户就可以在不查阅帮助的情况下了解页面的功能并进行相关的正确操作。

要求：

打开新界面，光标默认停留在第一个要输入的文本框；

将执行相同或相似功能的按钮放在一起以减少鼠标移动的距离，常用按钮必须支持快捷键；

将界面按功能划分为局部块，用Frame框围起来，并有功能说明或标题；

界面应支持键盘自动浏览按钮功能，即按Tab键自动切换功能；

界面上应该先进入的控件和重要信息应该放在Tab顺序的前面，位置也应该放在窗口上比较醒目的位置；

同一界面的控件数量不要超过10个，超过10个可以考虑使用分页界面显示；

分页界面应支持页面间快速切换，常用组合快捷键Ctrl+Tab；

默认按钮必须支持回车操作，即回车后会自动执行默认按钮对应的操作；

可写控件检测到非法输入后，应给出解释并自动获得焦点；

按钮和控件的顺序必须相同。目前大势是从上到下，同时线与线之间的方式是从左到右；

复选框和选项框按照选择概率的高低依次排列；

复选框和选项框必须有默认选项，并支持Tab选择；

When the number of options is the same, use the option box instead of the drop-down list box;

当界面空间较小时，使用下拉框代替选项框；

选项数量少时使用选项框，改用下拉列表框；

专业软件应使用相关术语，通用界面提倡使用通用术语；

输入安全性要求

有必要在界面上建立一些规则来控制输入错误的概率，这将大大减少用户错误对系统造成的损害。开发者应尽量考虑各种可能出现的问题，将出错的可能性降到最低。例如，当程序出现保护错误而退出系统时，用户就会对软件失去信心，因为这意味着用户不得不打断思路，花时间和精力重新登录，而所有的已执行的操作将丢失，因为它们未保存。因此，在页面设计时需要根据规则对输入进行校验。

要求：

排除可能导致程序异常终止的错误；

应检查用户输入的无效数据；

使用相关控件限制用户输入值的类型；

当用户面临两个或多个选择时，请使用单选按钮，当可能有更多选择时，可以使用复选框；

i>当选项特别多时，可以采用列表框，下拉式列表框；

确保未经授权或没有意义的操作不能进行；

对可能引起致命错误或系统出错的输入字符或动作要加限制或屏蔽；

对可能发生严重后果的操作要有补救措施。通过补救措施用户可以回到原来的正确状态；

对一些特殊符号的输入，与系统使用的符号相冲突的字符等进行判断并阻止用户输入该字符，并提前给出输入提示；

对错误操作最好支持可逆性处理，如取消系列操作；

在输入有效性字符之前应该阻止用户进行只有输入之后才可进行的操作；

对可能造成等待时间较长的操作应该提供取消功能；

特殊字符常有；;'"><，｀'："［"｛、|｝］+=)-(_*&&^%$#@!~，.。?/还有空格；

在读入用户所输入的信息时，应根据需要选择是否去掉前后空格，例如：有些读入数据库的字段不支持中间有空格，但用户切实需要输入中间空格，这时要在程序中加以处理；

独特性要求

如果一味的遵循业界的界面标准，则会丧失自己的个性.在框架符合以上规范的情况下，设计具有自己独特风格的界面尤为重要。尤其在商业软件流通中有着很好的迁移默化的广告效用

要求：

• 安装界面上应有单位介绍或产品介绍，并有自己的图标；
• 主界面，最好是大多数界面上要有公司图标；
• 登录界面上要有本产品的标志，同时包含公司图标；
• 帮助菜单的"关于"中应有版权和产品信息；
• 公司的系列产品要保持一致的界面风格，如背景色、字体、菜单排列方式、图标、安装过程、按钮用语等应该大体一致；

多窗口的应用与系统资源

设计良好的软件不仅要有完备的功能，而且要尽可能的占用最低限度的资源，因此在出现多窗口的情况下需要避免下述一些情况。

要求：

• 在多窗口系统中，有些界面要求必须保持在最顶层，避免用户在打开多个窗口时，不停的切换甚至最小化其他窗口来显示该窗口；
• 在主界面载入完毕后自动卸出内存，让出所占用的WINDOWS系统资源；
• 关闭所有窗体，系统退出后要释放所占的所有系统资源 ，除非是需要后台运行的系统；
• 尽量防止对系统的独占使用；

页面元素命名
在使用javaScript来进行页面动态控制编程时，需要对程序中的页面元素和功能操作的名称引用进行约定：
页 头： header
外 套： wrap
页 脚： foot

内 容： content
页面主体： main
容 器： container
标 题： title
当前的： current

主导航： mainnav
顶导航： topnav
子导航： subnav
边导航： sidebar
左导航： leftsidebar
右导航： rightsidebar
栏目： column
面包屑： breadcrumb (即页面所处位置导航提示）

菜 单： menu
子菜单： submenu
菜单内容： menucontent
菜单容量： menucontainer
按 钮： button
表 单： form
页 签： tab
文章列表： list
滚 动： scroll
提示信息： msg
摘 要： summary
标 签： tag
标签文字： tagTitle
标签内容： tagContent
当前标签: tagCurrent/currentTag
搜索范围： range
图 标： icon
当前位置： currentPath
列 定 义： column1of3 (三列中的第一列)
column2of3 (三列中的第二列)
column3of3 (三列中的第三列)

商 标： label
旗 志： logo
标 语： banner
注 释： note
搜 索： search
搜索关键字：keyword
登 陆： Login
注 册： regsiter
热 点： hot
新 闻： news
下 载： download
打 印： print
版 权： copyright
服 务： service
友情链接： friendlink
版 权： copyright
小技巧： tips
栏目标题： title
加 入： joinus
指 南： guild
服 务： service
状 态： status
投 票： vote
合作伙伴： partner

其它相关注意事项

1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写，除非一看就明白的单词

DHTMLx控件

控件的命名
控件的外观属性
控件使用规则

Flex控件

控件的命名
控件的外观属性
控件使用规则

我们专注高端建站，小程序开发、软件系统定制开发、BUG修复、物联网开发、各类API接口对接开发等。十余年开发经验，每一个项目承诺做到满意为止，多一次对比，一定让您多一份收获！