《企业web应用ui标准化基本准则_dezai》由会员分享，可在线阅读，更多相关《企业web应用ui标准化基本准则_dezai（35页珍藏版）》请在金锄头文库上搜索。
1、企业WEB应用标准化基本准则Msd:dezai扯蛋以用户为中心的开发设计意味着意味着什么什么了解用户了解用户 观察用户观察用户 分析用户分析用户熟悉熟悉业务业务清晰需求清晰需求模拟模拟场景场景让用户说让用户说参与设计参与设计容忍用户容忍用户难 用 垃 圾用得不爽高效率的响应反馈高效率的响应反馈高频次的迭代开发高频次的迭代开发通常通常 但是但是 “ 你的，你的， 我是一个人在做我是一个人在做! ”+标准标准化规范化程序化自动化03提高工作效率02减少用户熟悉系统的难度和时间01保持界面风格一致化ABCDE前端应用更轻量标准化可复用可扩展后端业务模块化构件化可复用信息流 业务流 数据流基础架构 稳
2、定性、扩展性 高性能支撑大并发流量01产品/项目/编程规范/02界面框架规范03基础界面元素规范产品VI LOGO系统框架视觉风格根据业务需求约定交互模式、页面流总体界面框架结构界面模式灵活优化多语言、多浏览器、换肤、组件库、扩展性等问题界面组件及其组合基础应用模板Web标准编码，优化结构，代码可重用性强可用性可用性功能 速度 性能合理性合理性规范 标准 潜规则易用性易用性易见 易学 易现协调性协调性简洁 大气 上档次原则可用性在规定的时间和条件下维持其 性能水准的程度在所有主流浏览器中拥有一致的表现系统功能和用户的实际需求保持一致可用性页面响应速度最不能超过3秒有良好的灾备恢复机制有良好的防
3、错和出错处理遵行常用的快捷键（回车 Tab键)尽可能给出多的默认值不用培训和手册就会使用主要功能易用性尽量减少用户输入动作的数量避免鼠标与键盘操作频繁交换业务功能深度不超过三级易用性易见：Easy to discover 易学：Easy to learn易用：Easy to use有直接明显的异常反馈通道每个页面的文件应当小于30K 每页都有自己的标题与导航合理性页面响应速度最不能超过3秒避免让绝大多数用户左右滚动 窗口显示内容最多不超过三屏合理性在规定的时间和条件下维持其 性能水准的程度使用温柔而非生硬的提示信息显示页面自适应分辨率及主流浏览器协调性尽可能在一屏内显示最主要的内容与操作功能避
4、免鼠标与键盘操作频繁交换页面都使用一致的配色和一致的结构协调性字体所有界面基准字体为12px 14px 16PX。不考虑特殊字体,使用系统默认字体(宋体 微软雅黑)所有字体属性设定应在CSS中完成。避免使用粗体和斜体：用粗体来吸引人的注意，用斜体表示着重，但还要少使用。避免混合字体：最多包含两种不同的字体。Fonts通过整体的CSS样式来规范布局颜色类型使用颜色的时候应当保持一致性，例如错误提示信息用红色表示，正常信息用绿色表示。一个页面的色彩不能花花绿绿，尽可能不超过三种色调颜色文本框(Input)必填项必须以红色*号标识出来。光标停留需有恰当的输入引导提示或建议内容的基本正则验证(日期 数
5、字 字符 邮件)将焦点置于出错的文本框内，并自动清空错误值Label标签右对齐，文本框内容左对齐对长度及非法字符的限制与过滤按钮(Button)按钮的大小和尺寸必须通过CSS统一不同功能的按钮可以用不同的色彩来区分触发前:有相应的数据验证机制 触发后:应有相应的操作成功或失败的提示语按钮字体大小不要超过14px 横排显示按钮要保持相对适中的间距支持回车和Tab事件删除操作要确认列表项(radio listbox checkbox dropdown)尽量自动默认值无默认值要增加“请选择”少于5个值尽量用radio checkboxLabel标签右对齐，文本框内容左对齐对长度及非法字符的限制与过滤
6、列表数据(gridview table)表头水平/垂直居中对齐,固定选中的行显示为不同的颜色并高亮显示弹出的DIV或窗口大小不超过(640*480)对于不定长的内容，可固定显示宽度，当超出此显示宽度后，以显示图表(Chart)最基本的三种图表(饼图 曲线图 柱状图)最基本的功能: 查询 导出一个页面的图表类型不超过三种图表颜色尽量不采用鲜艳的颜色页面(Page)层次分明，有明确意义的标题有基本的导航条有适度的留白行间距不能太过密集（120% 150%）避免横向滚动条出现通过整体的CSS样式来规范布局颜色类型规范的文件结构(Images/ js/ global.css reset.css control.css common.css)抛弃TABLE布局，采用XHTML+CSSCSS 并非所有用户都会或懂得去表达自己的观点 不要按自己的意愿给用户做决策 有变化需提前与用户沟通,达成一致 按规律办事,满足绝大多数用户 学会使用CSS框架,掌握基本的Javascript个人建议
