ui网站设计规范_ui网站设计规范_新版
ui网站设计规范_ui网站设计规范_新版
感谢大家在这个ui网站设计规范问题集合中的积极参与。我将用专业的态度回答每个问题，并尽量给出具体的例子和实践经验，以帮助大家理解和应用相关概念。
文章目录列表:
1.UI设计规范都有哪些
2.UI交互设计的设计规范都有哪些？
3.web界面设计规范有哪些-UI设计规范：如何构建Web端？
4.UI设计标注有哪些规范?
5.UI界面设计需要遵循哪些规范_ui设计规范包括哪些内容
UI设计规范都有哪些
好的UI设计不仅是让软件变得有个性有品位，还要让软件的操作变得舒适简单、自由，充分体现软件的定位和特点。
1.简易性
界面的简洁是要让用户便于使用、便于了解产品，并能减少用户发生错误选择的可能性。
2.用户语言
界面中要使用能反映用户本身的语言，而不是游戏设计者的语言。
3.记忆负担_小化
人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。人类的短期记忆有限且极不稳定，24小时内存在约25%的遗忘率。所以对用户来说，浏览信息要比记忆更容易。
4.一致性
它是每一个_界面都具备的特点。界面的结构必须清晰且一致，风格必须与产品内容相一致。
5.清楚
在视觉效果上便于理解和使用。
6.用户的熟悉程度
用户可通过已掌握的知识来使用界面，但不应超出一般常识。
7.从用户习惯考虑
想用户所想，做用户所做。用户总是按照他们自己的方法理解和使用。
通过比较两个不同_(真实与虚拟)的事物，完成更好的设计。如：书籍对比竹简。
8.排列
一个有序的界面[1]能让用户轻松的使用。
9.安全性
用户能自由的作出选择，且所有选择都是可逆的。在用户作出危险的选择时有信息介入系统的提示。
10.灵活性
简单来说就是要让用户方便的使用，但不同于上述。即互动多重性，不局限于单一的工具(包括鼠标、键盘或手柄、界面)。
11.人性化
_率和用户满意度是人性化的体现。应具备_级和初级玩家系统，即用户可依据自己的习惯定制界面，并能保存设置。
12.颜色不一样
UI设计师是随着网络而兴起的新兴设计行业，从事对软件的人机交互、操作逻辑、界面美观的整体设计工作
涉及范围包括商用平面设计、_网页设计、移动应用界面设计及跨媒介设计以人为本，以用户体验需求为基础，发展多元化是目前中国信息产业中_为抢手的人才之一。
UI交互设计的设计规范都有哪些？
页面规范
UI交互设计规范中的页面信息规范主要指页面的静态信息应该遵循的规则，包括：1.标题规范;2.新窗口链接规范;3.规范。
信息规范
UI交互设计规范中的交互提示规范主要用于规定在交互过程中交互的方式及其信息提示，包括：
1.预先信息提示
a.表单提交类，b.谨慎类操作，c.差异化规则。
2、操作信息提示
a.操作确认提示，b.操作错误提示。
3、结果信息提示
a.查询类结果，b.保存类结果，c.附加类结果。
控件规范
UI交互设计规范中的控件规范是当有一些功能会被多个模块复用的时候(如标准评论框、标准好友选择器等)，需要把这些功能提炼出来设计成通用控件被多个模块共用。
总之，有了页面信息规范、交互信息规范、通用控件规范就能保证页面信息的一致、交互方式及提示的一致、通用功能模块一致。从而保证产品的一致性，并提高产品质量。
以上就是关于UI交互设计规范的相关内容，希望对想要学习UI设计的小伙伴们有所参考，想要了解更多UI设计相关内容，欢迎大家在_及时查看。
web界面设计规范有哪些-UI设计规范：如何构建Web端？
网站界面设计规范有哪些？
易用性规范
2.001常用按钮要支持快捷方式。
2.002完成同一功能或任务的元素放在集中位置,减少鼠标移动的距离。
2.003界面要支持键盘自动浏览按钮功能,即按Tab键的自动切换功能。
2.004界面上首先应输入的和重要信息的控件在Tab顺序中应当靠前,位置也应放在窗口上较醒目的位置。
2.005分页界面要支持在页面间的快捷切换,常用组合快捷键Ctrl+Tab
2.006默认按钮要支持Enter和选操作,即按Enter后自动执行默认按钮对应操作。
2.007可写控件检测到非法输入后应给出说明并能自动获得焦点。
2.008Tab键的顺序与控件排列顺序要一致,目前流行总体从上到下,同时行间从左到右的方式。
2.009复选框和选项框,按选择几率的高底而先后排列。
2.010复选框和选项框要有默认选项,并支持Tab选择。
2.011界面空间较小时使用下拉框而不用选项框。
2.012选项数较少时使用选项框,相反使用下拉列表框。
2.013根据用户不同采用相应的词语语气语调,如专用软件,可以出现很多专业词汇;用户为儿童:这可以语气亲切和蔼;老年用户则应该成熟稳重。
2.014鼠标为不可点击状态时显示箭头,可点击状态显示手型;系统忙时显示沙漏形状
规范性规范
2.015菜单前的图标能直观的代表要完成的操作。
2.016工具栏要求可以根据用户的要求自己选择定制。
2.017系统常用的工具栏设置默认放置位置。
2.018工具箱要具有可增减性,由用户自己根据需求定制。
2.019状态条要能显示用户切实需要的信息,常用的有、目前的操作、系统状态、用户位置、用户信息、提示信息、错误信息等,如果某一操作需要的时间较长,还应该显示进度条和进程提示。
2.020滚动条的长度要根据显示信息的长度或宽度能及时变换,以利于用户了解显示信息的位置和百分比。
2.021状态条的高度以放置五号字为宜,滚动条的宽度比状态条的略窄。
2.022菜单和工具条要有清楚的界限;菜单要求凸出显示,这样在移走工具条时仍有立体感。
2.023工具条一般比菜单要宽,但不要宽的太多,否则看起来很不协调。
帮助规范
2.024帮助文档中的性能介绍与说明要与系统性能配套一致。
2.025打包新系统时,对作了修改的地方在帮助文档中要做相应的修改。
2.026在界面上调用帮助时应该能够及时定位到与该操作相对的帮助位置。也就是说帮助要有即时针对性。
2.027用户可以用关键词在帮助索引中搜索所要的帮助,当然也应该提供帮助主题词。
2.028如果没有提供书面的帮助文档的话,_好有打印帮助的功能。
2.029在帮助中应该提供我们的技术支持方式,一旦用户难以自己解决可以方便的寻求新的帮助方式。
合理性规范
2.030与正在进行的操作无关的按钮应该加以屏蔽(Windows中用灰色显示,没法使用该按钮)。
2.031对可能造成数据无法恢复的操作必须提供确认信息,给用户放弃选择的机会。
2.032非法的输入或操作应有足够的提示说明。
2.033对运行过程中出现问题而引起错误的地方要有提示,让用户明白错误出处,避免形成无限期的等待。
2.034提示、警告、或错误说明应该清楚、明了、恰当。
2.035提交失败后必须保存用户已经输入的内容,以便修改后再次提交。
美观与协调规范
2.036长宽接近黄金点比例,切忌长宽比例失调、或宽度超过长度。
2.037布局要合理,不宜过于密集,也不能过于空旷,合理的利用空间。
2.038按钮大小基本相近,忌用太长的名称,免得占用过多的界面位置。
2.039按钮的大小要与界面的大小和空间要协调。
2.040避免空旷的界面上放置很大的按钮。
2.041放置完控件后界面不应有很大的空缺位置。
2.042字体的大小要与界面的大小比例协调。
2.043前景与背景色搭配合理协调,反差不宜太大,_好少用深色,如大红、大绿等。如:安全软件,根据工业标准,可以选取**,绿色体现环保,蓝色表现时尚、紫色表现浪漫等等,淡色可以使人舒适,暗色做背景使人不觉得累等。
2.044如果使用其他颜色,主色要柔和,具有亲和力与磁力,坚决杜绝刺目的颜色。
2.045界面风格要保持一致,字的大小、颜色、字体要相同,除非是需要艺术处理或有特殊要求的地方。
2.046如果能给用户提供自定义界面风格则更好,由用户自己选择颜色、字体等。
2.047色盲、色弱用户,即使使用了特殊颜色表示重点或者特别的东西,也应该使用特殊指示符。
2.048颜色方案也需要测试,常常由于显示器、显卡的问题,色彩表现每台机器都不一样,应该经过严格测试,不同机器进行颜色测试。
2.049使用_的语言描述,例如一个关闭功能按钮,可以描述为退出、返回、关闭,则应该_规定。
菜单设计规范
2.050菜单通常采用"常用--主要--次要--工具--帮助"的位置排列,符合流行的Windows风格。
2.051常用的有"文件"、"编辑","查看"等,几乎每个系统都有这些选项,当然要根据不同的系统有所取舍。
2.052下拉菜单要根据菜单选项的含义进行分组,并按照一定的规则进行排列,用横线隔开。
2.053一组菜单的使用有先后要求或有向导作用时,应该按先后次序排列。
2.054没有顺序要求的菜单项按使用_率和重要性排列,常用的放在开头,不常用的靠后放置;重要的放在开头,次要的放在后边。
2.055如果菜单选项较多,应该采用加长菜单的长度而减少深度的原则排列。
2.056菜单深度一般要求_多控制在三层以内。
2.057对与进行的操作无关的菜单要用屏蔽的方式加以处理,如果采用动态加载方式——即只有需要的菜单才显示——_好。
2.058菜单前的图标不宜太大,与字高保持一直_好。
2.059主菜单的宽度要接近,字数不应多于四个,每个菜单的字数能相同_好。
2.060主菜单数目不应太多,_好为单排布置。
_性规范
2.061安装界面上应有单位介绍或产品介绍,并有自己的图标。
2.062主界面,_好是大多数界面上要有公司图标。
2.063登录界面上要有本产品的标志,同时包含公司图标。
2.064帮助菜单的"关于"中应有版权和产品信息。
2.065公司的系列产品要保持一直的界面风格,如背景色、字体、菜单排列方式、图标、安装过程、按钮用语等应该大体一致。
安全性规范
2.066应当注意尽可能避免用户无意录入无效的数据。
2.067采用相关控件限制用户输入值的种类。
2.068当用户作出选择的可能性只有两个时,可以采用单选框。
2.069当选择的可能再多一些时,可以采用复选框,每一种选择都是有效的,用户不可能输入任何一种无效的选择。
2.070当选项特别多时,可以采用列表框,下拉式列表框。
2.071在一个应用系统中,开发者应当避免用户作出未经授权或没有意义的操作。
2.072对可能引起致命错误或系统出错的输入字符或动作要加限制或屏蔽。
2.073对可能发生严重后果的操作要有补救措施。通过补救措施用户可以回到原来的正确状态。
2.074对一些特殊符号的输入、与系统使用的符号相冲突的字符等进行判断并阻止用户输入该字符。
2.075对错误操作_好支持可逆性处理,如取消系列操作。
2.076在输入有效性字符之前应该阻止用户进行只有输入之后才可进行的操作。
2.077对可能造成等待时间较长的操作应该提供取消功能。
2.078特殊字符常有;;'"><,`'、"["{、\|}]+=)-(_*&&^%$#@!~,.。?/还有空格。
2.079与系统采用的保留字符冲突的要加以限制。
2.080读入用户所输入的信息时,根据需要选择是否去掉前后空格。
2.081有些读入数据库的字段不支持中间有空格,但用户切实需要输入中间空格,这时要在程序中加以处理。
输入项规范
2.082必输项中不可为空,不可输入空格
2.083必输项给出必输项标识(*)。
2.084非必输项字段,Null插入数据库时不会出错,在数据库中设置默认值
2.085日期显示格式一致;或提供固定格式的选择。
2.086输入区域输入特殊字符,插入数据库时不出错或提示不允许输入特殊字符。
2.087英文输入不区分大小写,不可输入汉字、数字及特殊字符
2.088数值字段只能输入+,—,0~9及功能键(BackSpace光标)。数值不能为负数。
2.089单行文本框/多行文本框;长度合适,可以容纳相应文字,但不能超过数据库该字段长度,_好将可以输入的_字符数标在旁边。建议单行文本框中当输入的字符超过一定长度时再输入无效;对于多行文本框给出_字符数标识
2.090附件;可正常添加符合格式的附件;附件可正常打开和保存,附件名较长时可正常操作;直接输入错误的附件地址,保存时应给出提示信息;附件打开和保存到本地时,文件名要显示原文件的文件名。
2.091密码输入;在需求中定义密码是否允许为空或空格;密码是否允许特殊字符;是否区分大小写,密码的可输入长度;程序中应给出文字说明密码的可输入长度。
Web设计的设计原则有哪些好的设计能够帮助企业提升数据,同时还可以提供用户一个良好的使用体验。GoodUI总结了一个长达69条设计原则的清单(不断增加中),列举了他们认为非常重要的设计要点。
与以往的一些文章不一样的是这里提到的69点其中有一部分GoodUI已经通过A_est验证过可行性。当然分析报告是需要付费的,单篇39美金。
不过今天讨论的重点并不是付费报告,而是这69条设计原则。我按照自己的理解将它们翻译成了中文并配上,希望对大家有所帮助。
本篇文章内容及均来自于GoodUI,如有翻译不恰当的地方欢迎大家指正。
01尝试使用一列的布局替代多列布局
02给用户一些小的利益,别看上去那么赤裸裸
03合并相似的功能
04尝试展示来自用户的赞扬,而不是自我表扬
05重复核心行动点
06_视觉规范,提升可识别性
07尝试使用推荐的口吻,而不是让用户感觉面对一台冷冰冰的机器
08给用户吃「后悔药」的机会
09告诉用户产品适用的人群,而不是人人都通用
10将文案写得更加的直接,而不是一堆废话
11增强主行动点的视觉冲击力,提升它在页面中的可对比性
12让用户知道你从哪儿来更易于拉近与用户的关系
13将表单做的简单点,确保用户在抓狂之前能进入下一步
14尽量将用户需要选择的信息展示出来而不是藏起来
15页面的排版需要考虑用户是否会漏掉底部信息
16如果页面的底部有需要关注的行动点,别让文中过多的外链带走了用户
17确保用户知道自己目前的状态
18将利益点融合在行动点中,增强用户的点击_
19将行动点与当前信息结合起来
20将简要的表单合并到页面中,减少调整页面带来的用户流失
21适当的增加延迟动效,让用户感知到页面的变化
22让新用户从尝试产品入手,而不是一来就面对冷冰冰的注册表单
23减少使用线框,这会过多的吸引用户注意力,而且会让页面看上去透不过气
24给用户推销你能给他带来的利益,而不是功能
25一定要注意0结果页面的设计,这也是引导用户的好地方
26给用户选择退出的权利,特别是邮件订阅
27注意界面元素的一致性,降低用户学习成本
28给下拉框增加一些预设值,降低用户填写成本
29延续用户日常的使用习惯,而不是重新创造
30尝试告诉用做些事情降低自己的损失,而不是提升收益
31提升页面的视觉层次,增强可阅读性
32将同类的操作合并在一起,降低用户的认知成本
33表单及时校验,而不是_提交后在告诉用户填错了
34尝试将表单输入变得更加宽容,让用户的填写更加简单
35通过时间增强紧迫感
36提供用户可预见性的操作,降低用户的心理成本
37尽可能的帮助用户选择,而不是让用户想破脑袋
38尽可能将操作区域放大,降低用户操作成本
39页面加载速度很重要,尽可能让用户感受到你的网站速度很快
40如果可以,增加键盘快捷键,提升操作效率
41尝试通过对比来让用户感知到性价比
42尝试对进度条进行「设计」来降低用户等待的焦虑
43根据用户选择逐步展示信息,降低无效信息对用户的干扰
44有时候较小的承诺比「夸海口」会更容易让用户信服
45尝试将提示信息弱化,减少对用户操作的干扰
46尽量通过系统的功能来简化用户的操作
47用文本配合图标来降低用户的认知成本
48用更自然的语言代替冷冰冰的机器
49放出一些摘要信息来帮助用户识别是否需要进一步了解
50在关键的页面增加用户权益信息,增强用户进一步操作的信心
51将价格进行换算,让用户感觉这很便宜
52记得在成功页面感谢用户
53将数字转化成易于用户阅读的形式,而不是冷冰冰的机器语言
54告诉用户选择的权利和自由「诱惑力」
55尝试让语言更具「诱惑力」
56通过设计引导用户的注意力
57通过友好的对比来展示产品,为用户做决定提供帮助
58通过任务机制来提升用户的满足感
59让用户了解接下来将要发生什么事情
60尝试用更幽默一些的语言文案
61任何操作之后都要给出反馈,让用户知道操作已经生效
62注意动效的真实使用情况(Amazon的类目菜单就是一个很好的例子)
63注意排版的,不要让信息过于拥挤
64尝试用讲故事的方式来传递信息,增强用户的代入感
65尽量给用户展示真实的信息,不要欺骗
66随着用户的不断熟悉简化界面
67试着用用户的口吻展示信息
68在表单中增加一些提示信息,减少错误的几率
69_后,用简单的文案传递核心关注的信息,少一些废话
这69条设计原则虽然针对Web设计,但有些部分在移动产品设计中同样有效。
转载自:
/
UI设计规范：如何构建Web端？1、Web端设计规范的价值
2、Web端设计规范包含哪些
3、Web端设计规范之设计理念篇
4、Web端设计规范之设计原则篇
5、Web端设计规范之组件控件篇
6、Web端设计规范之界面交互篇
7、Web端设计规范之团队输出物篇
UI设计标注有哪些规范?
1.尺寸
我们要将页面上有所需要告知尺寸的内容进行标注，例如图标、、头像等等。关于尺寸维度的标注我们需要注意的是：有圆角的地方，需要将圆角半径标出。
对于一些控件，如button、列表，一定要随时问自己有没有特殊状态，如按压状态、无效状态、选中状态等等，如果你不标明，开会就会默认没有这些效果。一般情况下，的尺寸是需要告诉比例的，而不是固定的大小，这样开发才能更好的适配，常用的比例有4：3、16：9等。
所以正确的标注方法是给出按钮两边的间距，让整个按钮的宽度自适应(当然高度还是要固定的),这样不论遇到哪种分辨率的尺寸，都能够保持相同的视觉效果，扩展性极强。
2.文字
文字，需要标注文字的大小、字体、颜色、透明度、行高等等，当然也可以和开发进行沟通，对一些内容进行删减。关于文字的标注需要注意的事项：文字有一个很特殊的属性，就在某些场景下，文字是动态的，所以这个时候，就需要将极限情况考虑清楚。
3.间距
有人可能会觉得间距和尺寸有些相似，但其实它们有着很大的不同，我们可以这样理解：尺寸是形容容器的大小，而间距是形容容器之间的距离。间距相对比较简单，只要标注清晰就不会有太大问题。
4.颜色
需要标注颜色的内容有分割线颜色、背景色、按钮颜色等等。关于颜色的标注需要注意的事项：切记文字的颜色已经归类到文字属性里面，不用重复标注，思路一定要保持清晰。
以上就是小编关于UI设计中的标注规范的分享，希望对大家有所帮助，想要了解更多UI设计相关内容，请关注本_，小编会做及时的整理并发布的，大家注意查看哦!
UI界面设计需要遵循哪些规范_ui设计规范包括哪些内容
一：遵循一致的准则，确立标准并遵循
无论是控件使用，提示信息措辞，还是颜色、窗口布局风格，遵循_的标准，做到真正的一致。
二：(Color)颜色使用恰当，遵循对比原则
三：(Resource)资源
一个多姿多彩的人机交互界面，少不了精美的鼠标光标、图标以及指示、底图等。
四：(Font)字体
使用_字体，字体标准的选择依据操作系统类型决定。
五：(Text)文字表达
提示信息、帮助文档文字表达遵循以下准则：
1：口语化、客气、多用您、请，不要用或少用专业术语，杜绝错别字
2：断句逗号句号顿号分号的用法，提示信息比较多的话，应该分段，3：警告、信息、错误使用对应的表示方法
4：使用_的语言描述，例如一个关闭功能按钮，可以描述为退出、返回、关闭，则应该_规定。
5:根据用户不同采用相应的词语语气语调，如专用软件，可以出现很多专业属于，用户为儿童：这可以语气亲切和蔼，老年用户则应该成熟稳重。制定标准遵循之。
五：(Text)文字表达
提示信息、帮助文档文字表达遵循以下准则：
1：口语化、客气、多用您、请，不要用或少用专业术语，杜绝错别字
2：断句逗号句号顿号分号的用法，提示信息比较多的话，应该分段，3：警告、信息、错误使用对应的表示方法
4：使用_的语言描述，例如一个关闭功能按钮，可以描述为退出、返回、关闭，则应该_规定。
5:根据用户不同采用相应的词语语气语调，如专用软件，可以出现很多专业属于，用户为儿童：这可以语气亲切和蔼，老年用户则应该成熟稳重。制定标准遵循之。
六：(TABORDER)TAB顺序
习惯用法，阅读顺序，从从左到右，从上到下
窗体中控件的Tab按键激活顺序，TabOrder,.BCB/DELPHI中使用窗体设计右键菜单选择taborder设置，VC中窗体RES编辑区域使用ctrlD
好了，今天关于“ui网站设计规范”的话题就到这里了。希望大家能够通过我的讲解对“ui网站设计规范”有更全面、深入的了解，并且能够在今后的生活中更好地运用所学知识。