帐号: 密码:
// 设为首页 // 收藏本站 // 请您留言 // 网址导航
远方教程-满足你的求知欲!
站内搜索:
HTML ASP PHP CSS DIV Dreamweaver Photoshop Word Excel PPT SEO技巧
您当前位置:网站首页 >> 站长讲堂 >> SEO优化 >> 阅读文章

网页图片大小控制规则

来源:远方教程 作者:远方教程 发布时间:2013-10-23 查看次数:3114 访问[新版]

  为了使网络中使用的图片标准规范,我整理了一下网页设计中的标准尺寸。,也就是界面和图片banner、logo约定俗成的东西,使得更系统点。

  1、800*600下(2000年以前15寸电脑常用规格,目前已经很少用到),网页宽度只要保持在778以内,就不会出现水平滚动条,高度则视版面和内容决定。

  2、1024*768下,网页宽度保持在1002以内,如果满框显示的话,高度是612-615之间.就不会出现水平滚动条和垂直滚动条。

  3、在photoshop里面做网页可以在800*600状态下显示全屏,页面的下方又不会出现滑动条,尺寸为740*560左右。

  4、在PS里做的图到了网上是不一样的,颜色等等方面,web上面只用到256web安全色,而p中的RGB或者CMYK以及LAB或者HSB的色域很宽颜色范围很广,所以自然会有失色的现象。

  标准网页广告尺寸规格:
1、120*120,这种广告规格适用于产品或新闻照片展示。
3、120*90,主要应用于产品演示或大型LOGO,小图标标准尺寸。
4、125*125,这种规格适于表现照片效果的图像广告。
5、234*60,半尺寸banner,这种规格适用于框架或左右形式主页的广告链接。
6、392*72,主要用于有较多图片展示的广告条,用于页眉或页脚。
8、88*31,小banner,主要用于网页链接,或网站小型LOGO。
  页面标准按1024*768分辨率以上屏幕制作,实际尺寸可为960*-px
  页面长度原则上不超过3屏,宽度不超过1屏。最近在与淘宝小二进行沟通时,特地提到我们的网页在有意识的加长,从他那边得到的讯息是,若是内容需要,站在引导消费的层面,尽量不要超过12屏。

  尺寸的体积控制是一个难办的事情,但又必须要加以控制,这里有一个基本的参数算法:图片大小=图片宽×图片高×0.8÷1024 (单位:kb)
淘宝也在这个算法基础上结合自己网站做了一些尺寸标准限制:
950*90 <41K、 750*490 <179K、 728*90 <31K、 530*170 <43K、
510*270 <67K、 510*250 <62K、 470*270 <61K、 454*218 <48K、
380*220 <40K、 360*190 <33K、 310*100 <15K、 300*250 <36K、
270*390 <51K、 190*190 <17K

  而我们常用的图片规格,则可以按如下表格来加以控制:


广告形式

像素大小

最大尺寸

备注

BUTTON

120*60

7K

gif居多,这种广告规格主要用于做LOGO使用,小图标标准尺寸。

215*50

通栏

760*100

25K

 

430*50

15K

 

超级通栏

760*100 到 760*200

40K

 

巨幅广告

336*280 或 585*120

35K

 

竖边广告

130*300

25K

 

全屏广告

800*600

40K

 

弹窗广告

400*300

40K

gif居多

BANNER

468*60

18K

全尺寸banner,应用最为广泛的广告条尺寸,用于页眉或页脚。

悬停按钮

80*80

7K

 

流媒体

300*200

30K

小于5秒60帧(1秒/12帧)

  JPG和GIF的压缩方式:
简单的JPG缩小可以用ACDsee的编辑功能,在存储的时候点击选项,调整压缩品质即可。
更专业一点的是祭出Ps(一叶成茗常用的方式),存储图片时选择“存储为WEB所用格式”
之后保存时调整品质至要求的大小,务求保证清晰的情况下使之更小,这样有利于页面加载速度。

  如果这样还大的话,就必须要做切片处理了

  而对于GIF格式的压缩,最好的办法就是减少动画帧数,另外一点就是将要动的部分添加动画,而其它不动的部分第一帧以后就不出现。这样会大大降低文件体积。

打印 打印 | 关闭 关闭 评论
相关文章
图片新闻
站内搜索  
搜索
猜您喜欢  
最新更新  
阅读排行  
关于我们 | 联系方式 | 大事记 | 免责声明 | | 给我留言
部分广告源自金山联盟2345联盟 QQ咨询 站长之家QQ群:232617873
Copyright 2024 远方教程 © All Rights Reserved.

回顶部