web页面原型设计原则:

web页面做了不少，总结一下心得：

1 色调：

- 主色调不超过三个。

- 基本颜色为蓝色(主体背景色)、灰色(边框)、白色(背景)、黑色(字体)、深红色(错误)、绿色(表示通过)、橙色(高亮、警告)

- 

2 操作：少点击，少切换，少刷新。

- 不要让用户点来点去，尽量让每一次点击做尽可能多的工作；

- 走一个业务流程，不要让用户从这里个窗口跳到那个窗口，从这个页面跳到那个页面，尽可能一个页面搞定；

- 尽量避免刷新（少刷新、自动刷新、局部刷新）；

- 总说：页面跳转尽量少、弹出框尽量少、刷新尽量少、用户操作尽量少；

3 导航：

- 常用：将最常用的或者说最主要的功能放在主页或者最醒目的位置（不需要点击或者打开什么，直接可以开展操作）

- 其他：其他不常用的功能，有一个统一的入口，然后使用列表或者树形结构；(需要点击一个按钮后才能看见)；

- 参考：windows操作系统、IPhone操作界面；

4 图标：

- 尽量使用图标显示状态或者进度， 同时用户可以看到图例说明或者鼠标悬浮显示tip；

- 或者将图标和文字做到一起，形成一个先图标后文字的图片；

5 自适应：

- 页面元素的大小、位置，最好是根据浏览器页面大小进行动态设置；

- 常见包括：窗口大小、弹出框大小、分页数量、图标位置；

6 统一：

- 相同性质的元素样式要统一，包括：图片风格、背景色、字体大小、字体颜色；

7 动画：

- 列表或者按钮设置常见动画效果：

- 点击效果

- 选中效果

- 悬浮效果

- 激活效果

8 提示：

- 尽可能将元素的title补上，作为给予用户的提示说明；

- 图片添加alt；

9 对其：

- 页面元素上下左右摇对其；

10 留白：

- div和div之间、文字和div之间 适当留白，避免紧迫感；

- padding 和 margin

11 行高：

- 设置适当的行高；

- 推荐30px到35px；

12 提示：

- "操作成功"种类提示可以有，但是提示框会自动消失，不可以让用户确认之后提示才消失(就是不可使用alert提示成功)

- 操作失败或者警告一类提示，需要用户点击确认一下；

- 表单验证：验证失败，不要弹出alert，直接在页面给红色高亮出提示；

13 日志：

- 系统运行状况最好有日志；

- 系统业务流程的过程原则是必须有日志；

- 对于系统中运行的sql语句原则上必须有日志记录；

14 sql语句：

- sql语句独立于java文件(xml或者property)，参数使用占位符并写上详细的说明(绝对不可以有select * );

- 

15 在线帮助文档：

- 在系统里边，最好有一个在线”帮助文档/系统使用手册“等，入口是一个非常小的图标；

16 用户反馈模块：

- 为了不断完善系统、挖掘或者细化需求、尽快发现并解决bug，在系统里边最好有一个"用户反馈/bug管理"的模块，入口是一个非常小的图标；

17 窗口和内容：

- 先弹出窗口(窗口默认内容为空白或者显示正在加载)，然后再获取数据、显示数据；

- 禁忌先去后台查内容，然后页面卡死，直到数据返回再显示内容；

18 正在加载：

- 涉及到请求服务的内容，默认显示正在加载，给予友好提示(返回数据后再显示内容)。

-