易捷网络专注企业网站建设
11年企业网站建设经验、响应式网站建设,兼容PC、手机、平板全
终端,给你更佳的浏览体验...

优秀网页设计师须了解的UI设计规范(二)

来源:网站建设行业资讯网
添加时间:2021-12-08

三、命名规范

很多网页设计师对于“命名”是没什么概念的,他们都是随随便便地用一些没有特定意思的字母去给页面命名,这是不好的。因为统一的、规范的命名对我们自己的文件整理有很大的帮助,后期修改文件、图层的时候更加方便快捷,而且规范的命名也显得我们自身比较专业。而且,如果如果命名不统一,团队之间的成员很难达成共识,任务交接时需要很大的学习成本。

而更重要的是,有规范的命名可以极大的节省程序开发的时间成本,减少很多不必要的沟通与重复切图的概率,程序员完全可以直接使用的我们切片而不更改切片的名称,后期我们更换切图,只要切片名称不变,开发看都不用看直接替换就可以了。

1、 所有命名全部为小写英文字母

在程序员的代码里只有小写的英文字母,如果你给出的命名全是中文的,那么他们是一定会更改的,所以命名全部用小写的英文字母是最基本的规则。有些人会觉得写这么多英文太麻烦,但其实为了自己专业能力的提高,这种规范的命名方式是必须要经历的过程,当你习惯了这样的命名方式后,你的成就感会油然而生。

2、 命名格式

一个大型项目会分很多模块,每个模块由不同的设计师来独立完成,还有人会专门管理公共的组件,如tabbar、navbar等等,这种情况下就会分为两种切图,一种是通用类型的切图,还有一种就是各个模块特有的切图。

通用切片命名格式:

组件_类别_功能_状态@2x.png

举例:tabbar_icon_home_default@2x.png(对应中文:标签栏_图标_主页_默认@2x.png)

模块特有切图命名规则:

模块_类别_功能_状态@2x.png

举例:mail_icon_search_pressed@2x.png(对应的中文为:邮件_图标_搜索_默认@2x.png)

我们的原则就是清晰的表达出切片的具体内容并且没有重复的名称。(要注意,命名中不能含有空格)

3、 常用英文单词

如果所有命名都写为全称,名字就会特别长,所以我们可以将一些常用的英文单词进行缩写,减少工作成本与开发代码资源。至于怎么缩写,只要整个团队能够达成共识并且输出一份缩写清单,任何缩写规则都是可以的。

下面提供一些命名时常用的英文单词列表:

bg(backgrond 背景)

nav(navbar 导航栏)

tab(tabbar 标签栏)

btn(button 按钮)

img(image 图片)

del(delete 删除)

msg(message 提示信息)

pop(pop up 弹出)

icon(图标)

selected(选中)

disabled(不可点击)

default(默认)

pressed(按下)

back(返回)

edit(编辑)

content(内容)

四、交互规范

以下几点交互常识:

简化操作:能一步完成的交互就不要分两步。

用户习惯:大部分用户都有固化思维,我们作为设计师应该尊重数据,尊重用户选择。

减少干扰:减少界面元素的不确定因素,方便用户快速找到自己想要的。

快速响应:加快用户读取的响应速度,能够避免从远程取数据的,就尽量避免。

界面友好:除了根据需求提供视觉解决方案以外,在设计的过程中适当地加入一些小细节使交互界面更加友好是设计师的职责所在。

网站建设计最新案例赏析:


欧马腾会展科技网站制作首页设计效果图
欧马腾会展科技
千瑞文化信息有限公司网站制作首页设计效果图
千瑞文化信息有限公司
东莞禾聚精密电子科技网站制作首页设计效果图
东莞禾聚精密电子科技
江苏天兴环保股份网站制作首页设计效果图
江苏天兴环保股份
广州庄齐实验室工程网站制作首页设计效果图
广州庄齐实验室工程
上海三羽电器网站制作首页设计效果图
上海三羽电器
河南赛唯家具网站制作首页设计效果图
河南赛唯家具
陕西松峰实验设备网站制作首页设计效果图
陕西松峰实验设备
深圳华测实验室技术网站制作首页设计效果图
深圳华测实验室技术
上海傲秀展览展示网站制作首页设计效果图
上海傲秀展览展示
 

网站建设行业资讯推荐阅读:


网站建设:通过关键词来实现优化风格多样的高质量404模板(下)网站建设的基本流程深圳网站的建设和运营究竟怎么做制订一个搜索引擎营销(SEM)计划深圳网站建设公司有用响应式设计吗网站优化一般包含哪一方面预测2015的内容营销深圳福田网站制作的步骤是什么,网站SEO关键词该如何选取解析网站运营和销售交流沟通的优势网站建设布局设计网络营销企业如何选择主营产品-深圳网站设计分享应该怎么做网站建设设计导航常见的网站布局设计方法有哪些网站制作的关键流程有什么什么样的网站建设才算合格广州网站建设公司教你调整站内文章关键词网站建设运营推广应该怎么做高级网站建设和普通网站建设有哪些不同-中山网站建设网站建设服务注意事项深圳企业网站制作,网站建设外链有哪些技巧网站内容的更新作为网站推广中不可缺少的一步科技分析网站设计灵感哪里找什么是微信网站企业品牌推广如何与自媒体平台合作-深圳网站建设分享APP软件定制开发响应式网页前端的设计尺寸标准企业网站建设中有哪些细节是需要注意的html网页制作中不用表格的菜单设计用户体验设计师的发展简史关于网站建设的可访问性(二)网站外链优化效果分析最好的外链能够带来流量 企业网站设计中的“立”与“破” 深圳微信营销的渠道策略,企业如何利用微信做好网络营销网站改版前需要考虑的问题是什么怎么建立自己的网站平台解析这些年百度地图是如何一步步干掉竞争对手的深圳宝安网站建设为什么实用呢JoomlaSEO的服务建设网站过程需要知道哪几个步骤留白设计对网站建设来说有何好处网站开发要有规划性网站首页设计要把重中之重放到哪些地方给做企业网站建设提出几点建议易捷网络科技有限公司专注于建设营销型网站助力于企业发展!中小企业建设网站目的 靠谱的网站设计制作公司定做 手机网站设计注意要素seo自我提升的学习途径有哪些如何进行深圳网站建设指南华为新机支持按压式指纹识别功能,是真的吗什么是有价值的内容做一个企业网站建设需要多长时间公司网站建设需要考虑同行建站模板吗企业网站制作要满足客户哪些需求网站维护过程中需要我们设计员应该注意的事项深圳网站建设公司如何审核大量网站数据外包公司软件定制该何去何从APP推广有哪些技巧如何构建Web端设计规范
企业网站建设行业信息服务发布平台!
(www.fantodo.com)版权所有
QQ在线咨询