第一:网页的人往往不耐烦。你的图片可能很酷,但是如果太丰满不适合快速下载,很少有人会坚持到最后才看到自己的脸。幸运的是,网页设计师可以使用一些技术和优化来加速图像和页面的下载。
第二:也不需要。其实也没有什么特长。在做其他事情之前,请删除页面上所有多余的图像。这里的“多余”并不是指你的公司logo或者你的办公地图。我们指的是“发送邮件”旁边的智能动画信封。可能你的页面底部有NetscapeNavigator和Internet Explorer按钮。说实话,有多少人没听说过这些产品?在网站中减少一个微不足道的10KB图形文件,可能对整个网站没有太大的改善。但是如果你整个页面只有40KB,减少10KB可以减少25%的下载时间——减少一个跳舞宝宝的按钮是值得的。如果你的页面真的需要削减,考虑使用文本“提交”按钮,而不是图形“提交”按钮。用静态图形代替动态GIF图形可以减少下载时间。最后,一些神奇的“标题”图形可以用FONT SIZE和FONT FACE标签来代替。
第三:的GIF文件和JPEG文件除非你想要像阿奇或戈菲尔那样的火箭速度,否则你会一直使用一些图形。遵循一些创建图像的规则,你的页面下载时间将是可行的。首先,确定一幅图像是GIF格式还是JPEG格式。这看似基本,但还是有大量网页犯了这样的错误。GIF非常适合看起来整洁的小图形,但不会超过256色。gif也可以保存为“透明颜色”——允许不规则的图形边界。简单的公司logos、小按钮、导航条都是应用GIF图形格式的好例子。与JPEG不同,GIF是无损压缩格式,因此您的图形不会变得模糊。如果你正在扫描一张有详细细节的地图,你应该选择GIF格式。但是图片大的话,GIF文件大,下载时间长。不能从根本上压缩GIF文件,但是可以减少位深度,也就是限制颜色数量。给定比特深度的颜色数量等于比特深度的2次方(即,8比特=256种颜色)。颜色越少,图像中的字节数就越少。假设你在建一个可口可乐网站,可以把很多标志的位深度降低到3、4位(红色和白色,可能还需要这两种颜色的阴影颜色来平滑边界)。您可以使用Debabelizer软件来更改位深度。JPEG文件可以显示上千种颜色,压缩比高于GIF文件。它们非常适合摄影图像。但是,照片的一些细节在压缩成JPEG文件时会丢失。
第四:的适当大小当您使用图形编辑器时,请确保图形大小(72dpi)与网页上显示的大小相同。在HTML中,用图像标签的宽度和高度属性重申图像的实际大小。这使得浏览器能够在下载图像的同时呈现页面的其余部分——因此人们在等待图像有其他内容可以阅读——并确保当图像“关闭”时可以看到正确的页面布局。如果您在页面中使用表格,图像大小非常重要:没有定义大小的图像将强制浏览器清除并重新绘制页面。当浏览器根据Table和TD构建一个table,然后发现TABLE单元格中的图像没有大小参数,但是太大而无法放在表格中时,就会出现这种情况。浏览器不得不重新绘制表格,以适应这种尴尬的图像。低效的页面重绘浪费时间,用户看到不断消失重绘的页面会不高兴。使用WIDTH和HEIGHT时,最重要的是不要用它们来调整页面图形的大小或形状。通过HTML调整大小不好有两个原因。如果你放大图像,你会得到一个锯齿状的图片。使用HTML使图像变小并不总是坏事,但是性能很差。因为浏览器下载的数据比要显示的实际图像多,所以下载时间会增加。
第五:缓存是让你的朋友更快下载图片的重要技术。重复出现在网站上的图片,如通用标志、标题或导航栏,不必一遍又一遍地下载。默认情况下,网景和互联网浏览器在内存或硬盘上设置一个缓存来存储最近使用的图像。如果浏览器知道相同的文件名,它会读取缓存,而不是从互联网下载。这种方法大大提高了效率,以至于许多自动计时程序都无法识别它——你必须自己用秒表来测量。由于客户端缓存非常有用,所以在设计网页时应该考虑浏览器缓存。例如,如果一个网站有大量相似的标题图形,尝试将其分割,以便不变的部分可以立即从缓存中读出。虽然每个页面都会调用一张新图片,但是下载速度很快,因为它很小。