企业级B端交互设计规范搭建思路思维导图
企业级B端交互设计规范搭建思路，规范搭建中需要注意的点，文字规范和间距规范
树图思维导图提供 企业级B端交互设计规范搭建思路 在线思维导图免费制作，点击“编辑”按钮，可对 企业级B端交互设计规范搭建思路 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：f7f761f74218309e30d8cb45234cbdf0
思维导图大纲
企业级B端交互设计规范搭建思路思维导图模板大纲
规范搭建中需要注意的点
文字规范
字体
字体分为数字/英文和中文
在B端产品中，字体使用建议优先级排序为（基于数字/英文&mac系统优先原则）：Helvetica Naue（英文/数字）、Helvetica(英文/数字)、Arial(英文/数字)、PingFang SC、Hiragino Sans GB、Microsoft YaHei UI、微软雅黑、sans-serif
字号
常用的字号标准
12px（正文）、14px（标题）、16px（特殊情况，极少使用）
14px（正文）、14px（标题）、16px（特殊情况，极少使用）
字重
字重是指字体的粗细程度。一个字体的字重通常至少4-6个，其中Regular与Bold最常用。字重的选择基于清晰区分的原则
网站上对字重的标注
行高
合理的文本行高可以让界面信息展示更清晰，使用户查找信息和阅读信息的效率更高
色值
在界面的字体颜色使用上，设计规范从两个维度做了控制，分别是颜色的数量与颜色的质量
W3C的无障碍设计原则
（3：1）在WCAG2.0 1.4.3（AA级）下，大型文本（18pt或14pt粗体或更大）的最小对比度
（4.5：1）在WCAG2.0 1.4.3（AA级）下，常规尺寸文本的最小对比度
（7：1）在WCAG2.0 1.4.6（AAA级）下，常规尺寸文本的增强对比度
间距规范
外边距
当内容区域与页面容器之间为0的距离时，会给人内容要溢出屏幕的感觉
合适的外边距会让界面的排版更加整齐和有呼吸感
行间距
行与行之间的间距通常涉及到信息的传递效果
根据行高的计算方法，在常规使用中，主字号12px与14px的行间距均为8px，即12px字体的行高为20px，14px字体的行高为22px
元素间距
元素间距是指文字与组件之间、组件内部元素之间、组件与组件之间等的间距
具体从多小的间距取值，向上递增，和界面的整体宽松度有密切关系
模块间距
设计规范中，模块间常用的间距为8px、12px、16px、20px……
间距规则
相关思维导图模板
树图思维导图提供 3A Unit 1 A Proper Job 在线思维导图免费制作，点击“编辑”按钮，可对 3A Unit 1 A Proper Job 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：8d966446cda22e33b426cba15d3d981e
树图思维导图提供 SpringBootWeb请求响应 在线思维导图免费制作，点击“编辑”按钮，可对 SpringBootWeb请求响应 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：1c6ee1ff958a0c7c2fabdf9e9f8d755e
沪公网安备 31011502019485号
上海工商