UI设计规范V1.0-2.pptx

PSA 设计规范 V1.0 ISOFTSTONE 2016/04/06目录一、 基础规范二、参考指南01 网页宽度02 网页主题色03浏览器兼容性04 搜索框设计规范 基础规范 应用场景05 页码设计规范 普通页码翻页 小型页码翻页06 文字的编排与设计 文字大小 文字颜色 文字行距 英文字体规范 文字链接07 整齐的概念和应用08 模块化表现09 页脚信息01 页面修饰 简单的光影效果 质感的表现 透明效果的应用?02 个性皮肤的应用?03 图标的统一使用04 图标表意一、网页宽度最新显示器分辨率比例调查：目前主流分辨率：1920*1080在此状态下，默认使用 1200px 的网页宽度，页面居中显示。备注：1.正常情况下：960px~1200px，页面居中显示。不过现在显示屏的分辨率一般在1024以上比如现在的笔记本的分辨率一般是1336*768新液晶显示屏的分辨率也都已经达到了1440*900所以现在设计的话一般是960px,980px,1000px,1024px，1200px2.根据屏幕分辨率调用不同的样式，设定两个页面宽度。一般1000px和1200px，分辨率大于等于1280就用1200px宽度的。3.最好的做法就是做成自适应的！（推荐）任何大于1024的分辨率都能满屏显示，自适应对页面WEB前端及扩展要求很高。 ??二、网页主题色PSA主题色有6种，产品的主题色应和PSA的主题色对应。备注：各别产品有特殊情况另议。三、浏览器兼容网页兼容浏览器浏览器分为：IE内核浏览器和/s?wd=%E9%9D%9EIE%E5%86%85%E6%A0%B8%E6%B5%8F%E8%A7%88%E5%99%A8tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHbzuHn1PW-WmW6dPj990ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnvnjm3njDY非/s?wd=%E9%9D%9EIE%E5%86%85%E6%A0%B8%E6%B5%8F%E8%A7%88%E5%99%A8tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHbzuHn1PW-WmW6dPj990ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnvnjm3njDYIE/s?wd=%E9%9D%9EIE%E5%86%85%E6%A0%B8%E6%B5%8F%E8%A7%88%E5%99%A8tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHbzuHn1PW-WmW6dPj990ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnvnjm3njDY内核浏览器。IE内核：搜狗、遨游、360、/s?wd=%E4%B8%96%E7%95%8C%E4%B9%8B%E7%AA%97tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHbzuHn1PW-WmW6dPj990ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnvnjm3njDY世界之窗等等基本都是基于IE内核构建。非IE内核：火狐、/s?wd=%E8%B0%B7%E6%AD%8C%E6%B5%8F%E8%A7%88%E5%99%A8tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHbzuHn1PW-WmW6dPj990ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EPjnvnjm3njDY谷歌浏览器、safair（/s?wd=%E8%8B%B9%E6%9E%9C%E6%B5%8F%E8%A7%88%E5%99%A8tncprfenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1d9rHb