web开发规范 - 图片规范

知识共享许可协议 版权声明:署名,允许他人基于本文进行创作,且必须基于与原先许可协议相同的许可协议分发本文 (Creative Commons

基本规则

所有页面元素类图片均放入img文件夹, 测试用图片放于img/demoimg文件夹;

图片格式仅限于gif || png || jpg;

命名全部用小写英文字母 || 数字 || _ 的组合,其中不得包含汉字 || 空格 || 特殊字符;尽量用易懂的词汇, 便于团队其他成员理解; 另, 命名分头尾两部分, 用下划线隔开, 比如ad_left01.gif || btn_submit.gif;

在保证视觉效果的情况下选择最小的图片格式与图片质量, 以减少加载时间;

尽量避免使用半透明的png图片(若使用, 请参考css规范相关说明);

运用css sprite技术集中小的背景图或图标, 减小页面http请求, 但注意, 请务必在对应的sprite psd源图中划参考线, 并保存至img目录下.

banner

全尺寸banner为468X60px,半尺寸banner为234X60px,小banner为88X31px。
另外120X90,120X60也是小图标的标准尺寸。全尺寸banner不超过14K。
普遍的banner尺寸760X100,750X120,468X60,468X95,728X90,585X140
次级页的pip尺寸360X300,336X280
游标:100X100或120X120

LOGO的国际标准规范

为了便于INTERNET上信息的传播,一个统一的国际标准是需要的。实际上已经有了这样的一整套标准。其中关于网站的LOGO,目前有三种规格:
8831 这是互联网上最普遍的LOGO规格。
120
60 这种规格用于一般大小的LOGO。
120*90 这种规格用于大型LOGO。

页面修饰图片处理

图片经过优化以加快下载的速度,有较佳的视觉空间效果,用图要与页面风格、页面内容相符;制作精美,细节处理得当。

猜你喜欢

转载自blog.csdn.net/weixin_44198965/article/details/94337372