无忧技术网 - RSS订阅 
无忧技术网

如何令主页图形快速显示


作者:[佚名] - 发布:2010-4-22 17:35:38 - 来源:无忧技术网

1.首先要确定图像的格式;
2.减少图像所用颜色数目的数目;
3.根据图像的视觉效果,选择合适的压缩格式;
4.采用隔行gif和逐级jpg方式;
5.使用预览图像;
6.尽量把图形尺寸做小;


1.首先要确定图像的格式
--------------------------------------------
在HTML文件中,使用 *.jpg、*.gif、*.bmp等文件格式均是可以浏览的。我们只选择前面的两种,
因为这两种文件格式能对图像进行很大程度的压缩,使得在产生相近视觉效果的前提下,图像文件的
容量会小很多。

但是,我们到底是使用jpg格式呢,还是使用gif格式?
a、如果图像是使用扫描仪输入进计算机的(当然也包括用数字相机),通常这种图像都是一些人物照片,
风景照片什么的,这种图片中所用到的色彩比较多,就是说图像中既有浅红色,又有深红色,还有绿色、
蓝色、黄色等等,这时候我们应该选择使用jpg格式来存储图像。
b、如果图形是由你自己使用Photoshop,Paint Shop Pro等软件制作的,如标题文字等,这时图像中
所使用的色彩通常会比较少,我们可以选择gif格式。

2.减少图像所用颜色数目的数目
--------------------------------------------
当颜色数目减少后,如果你认为图像质量变化不大,那么就选用gif格式。
要知道,jpg格式对待彩色图像可是一律使用16M色呦。

3.根据图像的视觉效果,选择合适的压缩格式
--------------------------------------------
无论是使用什么样的图形处理软件,它都会在你存盘时向你询问jpg的压缩比。当然,压缩得越狠,
文件越小,但是图像质量也越差。通常,采样50%到70%的压缩率比较好(百分数越大,文件越小),
当压缩率从0%上升到50%时,文件大小会急剧下降,而图像质量却变化不大,再加大压缩率后,图像会
明显变差,而文件的大小却减少得十分有限,有时甚至只减少几十个字节。
不过有一点要告诉你,凡事都没有绝对情况,你不妨在这时试着使用256色的格式将图片存储成gif
格式,与jpg格式的文件比一比哪个字节数更少,图像质量如何,最终才决定使用什么图像格式。

4.采用隔行gif和逐级jpg方式
--------------------------------------------
前面的图像减肥方法,使得图像的字节数已经是无法再减少了。但是,我们可以想办法在图像文件
大小一定的情况下,让浏览者可以耐心等待图像全部出来。其方法是采用隔行gif和逐级jpg方式。

隔行gif -- 是指图像文件是按照隔行的方式来显示的,比如先出奇数行,再出偶数行,造成图像是
逐渐变清楚的。将图像文件保存成隔行gif格式的方法是,在Photoshop中进行保存时,
选择“Interlaced”(不要选择“Normal”)。
逐级jpg -- 文件可以让图像先以比较模糊的形式显示,随着图像文件数据不断从网上传过来,图像会
逐渐变清晰。这样做的好处是图像可以尽快地显示出来,虽然图像不很完美,但是却让浏览
者看到了希望,并且图像在不断地变好。将图像文件保存成逐级jpg格式的方法是,
在Photoshop中进行保存时,选择“Progressive”。

5.使用预览图像
--------------------------------------------
即在显示原图之前,先显示一幅字节数比较小,画面质量相对较差的图片。由浏览者决定是否浏览
原图。通常,预览图像都是主图像的低分辨率、高压缩率的版本。使用预览图像的方法是:
,其中temp.gif是原图,而preview.gif是预览图。

6.尽量把图形尺寸做小
--------------------------------------------
在可以达到预期目的的情况下,尽量把图形尺寸做小,图形尺寸越小,则字节数相应就会越少。在
制作图像时,还要尽量将图形四周无用的信息去掉,

比如说你制作了一个非常漂亮的美术字的图片,它的背景是黑色,而网页的底色也是黑色,这时你
就一定要让美术字尽量充满整个图像,不要让图片中黑色的底色边框过大,因为图片的底色最终要与
网页的底色融为一体,在美术字大小一定的情况下,图片做得越大,图像文件大小的字节数就会越多,
在网上传输起来就越费时间。
还有就是在 *.html文件中使用图像时,可以在中添加WIDTH和HEIGHT属性,它们分别代表图像
在页面上显示时的宽度和高度。需要说明的是,这个宽度和高度与图像本身的尺寸无关。例如,你可以
在 *.html文件中这样使用尺寸为88×31的图像文件logo.gif,
,于是,这幅图像在网页中显示的时候就变大了,
由于长宽放大的比例不同,图像也会发生变形。

好了,该说的差不多都说了,赶快动手去试试吧。

责任编辑:liqwei
打印本页】【关闭本页】【返回列表
·上一篇:关于XML 的十种观点
·下一篇:商业网站设计主要原则
 文章评分
  • current rating
-5 -4 -3 -2 -1 0 +1 +2 +3 +4 +5
 相关文章
 相关评论
 站点最新文章 更多>> 
·[经典影音]萨利机长
·[经典影音]天空之眼
·[管理知识]康奈尔笔记法,提高100%学习效率
·[管理知识]刘强东:我管75000人靠这4张表格
·[管理知识]跟壳牌学HSE管理
·[运营策划]编辑工作内容整理
·[至理名言]奋斗与决定
·[瀚海拾遗]盲人打灯笼之各家论道
·[搞笑段子]中国男足
·[搞笑段子]大爷被采访
 站点浏览最多 更多>> 
·[协议规范]http断点续传原理:http头 Range、…
·[JS/CSS/HTML]HTML 空格的表示符号 nbsp / en…
·[NoSQL]Mongo数据库简介
·[协议规范]什么是SPF记录?如何设置、检测SP…
·[协议规范]图解 HTTPS 通信过程
·[PHP]精选国外免费PHP空间推荐
·[程序综合]常用IP地址查询接口
·[程序综合]什么是 DNS Prefetch ?
·[程序综合]获取客户端IP地址的三个HTTP请求…
·[Linux]/usr 目录的由来