切片命名规则是什么?【UI设计师必知】

命名规则是为了团队能够有一个统一规则，在和前 端工程师进行交接时， 规范的命名对于团队协同有着极大的推动作用。通常为切片命名时会遵循以下几个规则。

(1) 命名采用英文小写，不要有大写字母出现。

(2) 出现较多层级时，最好遵循命名的通用规范“模块_类别_功能-状态@2x.png“,按照由大范围逐步缩小范围进行命名，例如，命名一个属于标签栏内部，默认状态下的搜索按钮。英文命名为: tab_button_search_nor@2x.png，对应中文则是:标签栏_按钮_搜索_默认状态@2x.png。

(3) 名称中间不要有空格，使用下画线进行连接。

下面列举了移动端界面一些常 用元素的英文名称，具体如下。

移动端App命名常用单词

启动页面: default导航栏: nav左侧导航: leftbar工具栏: tool标签栏: tab背景: bg按钮: button照片: photo图片: img图标: icon个人资料: porfile用户: user弹出: pop返回: back刷新: refresh删除: delete编辑: edit下载: download内容: content广告: banner登录: login注册: register标题: title提示信息: msg链接: link注释: note标志: logo主页: home搜索: search输人: input复选框: chb下拉: cbb单选框: rb收藏: collect按钮文字: btntext信息: info列表: list设置: set更多: more取消: cancel按钮常态: nor按钮选中: sel按钮突出: hig按钮不可用: dis

需要注意的是，虽然上表中展示的是一些常用元素的单词，但是每个前端工程师有着自己的命名习惯，因此在实际工作中最好和前端工程师沟通确认。