多媒体教程 - GIF 图像

GIF 是在 Web 上使用的主要图像格式之一。

本文详细讲解了 GIF 图像的特性和使用技巧。

理解图像格式

无论是 HTML 还是 XHTML 都没有规定图像的官方格式。然而,流行的浏览器却专门规定了一定的图像格式:通常情况下是 GIF 和 JPEG。其他多媒体格式大多需要特殊的辅助应用程序,每个浏览器的使用者都要去获得、安装并正确地操作这些应用程序,这样才能看到或听到这些特殊的文件。所以,GIF 和 JPEG 成为在 Web 上的实际标准也就不令人觉得奇怪了。

在 Web 出现以前,这两种图像格式已经得到了广泛使用,所以有大量支持软件可以帮助我们以这两种格式创建图像。然而,这两种格式各自有其优缺点,有些浏览器会利用其特性来实现特殊的显示效果。

GIF

GIF 格式指的是图像交换格式(Graphics Interchange Format,GIF),该格式最初是 CompuServe 为其在线服务用户传输图像而开发的。

GIF 格式的特性

GIF 格式有很多特性,因此在 HTML/XHTML 中十分普及。

首先,它的编码技术在许多平台上都可以使用。所以,通过适当地 GIF 解码软件(大多数浏览器都含有这种软件),在 Macintosh 上创建并组成 GIF 文件的图像,在基于 Windows 的 PC 上也可以毫不费力地加载、解码并查看。

GIF 格式的第二个特性是,它采用了一种特殊的压缩技术,可以显著减小图像文件的大小,从而得以在网络上更快地进行传输。而 GIF 压缩是“无损”压缩,也就是说,图像中原来的数据都不会发生改变或丢失,所以解压缩并解码后的图像与原来的图像完全一样。

此外,GIF 图像还非常容易实现动画效果。

GIF 格式的版本和颜色

尽管 GIF 图像文件都用 .gif (或者 .GIF)作为文件名后缀,实际上却有两个 GIF 版本:原始的 GIF87 和 GIF89a,后者支持很多新特性,包括透明背景、交叉存储和动画等,这些特性在 Web 创作者中的使用十分普及。

现在流行的浏览器都支持这两种 GIF 格式,它们都是通过同一种方案来把 8 位的像素值映射到一个颜色表当中,这样每个图像最多可以有 256 种颜色。

大多数 GIF 图像实际颜色的数目更少,有些特殊工具(比如 Macromedia 的 Fireworks)可以在更为精细的图像中简化这些颜色。通过简化颜色,可以创建更小的颜色映像并且强化像素冗余,来使文件压缩得更多,从而使下载速度更快。

然而,由于颜色数目有限,用 GIF 编码的图像并不是任何时候都适用,尤其是对那些具有照片一样逼真效果的图片来说。GIF 可以用来创建非常好看的图标和颜色不多的图像及图画。

即使是非常挑剔的创作者也会选择 GIF

因为大多数图形浏览器都明确地支持 GIF 格式,因此它现在是 Web 上接受面最广泛的图像编码格式。内联图像和外部链接图像都可以使用这种格式。如果你在选择图像格式方面犹豫不决,使用 GIF 肯定没错。它几乎在所有情况下都可以正常使用。

GIF 图像的技巧

GIF 图像有三种特殊的技巧:隔行扫描(interlacing)、透明性(transparency)和动画(animation)。

隔行扫描

通过隔行扫描,GIF 图像可以在屏幕上一下子显现出来,而不是从上到下逐步地显示。一般情况下,用 GIF 编码的图像是像素数据从图像的顶部到底部顺次、逐行排列的一个序列。所以,普通的 GIF 图像在屏幕上显示时,就好像一下子拉开窗帘,而具有隔行扫描的 GIF 在显示时,则像卷起百叶窗一样。这是因为像素数据的序列是每隔 4 行就交错一次。用户只需要用下载并显示一整幅图像的四分之一时间,就可以看到一个从上到下非常完整的图像,虽然它很模糊。这个只完成了四分之一的图像通常已经足够清楚了,这样那些网络连接速度较慢的用户就能够判断出,是否有必要花时间下载图像其余的部分。

尽管所有的图形浏览器都能够显示隔行扫描 GIF,但并不是所有浏览器都可以显示出隔行扫描那种逐渐清晰的效果。即使是那些可以实现这种效果的浏览器,用户还可以通过选择在图像完全下载并解码后再显示,来抑制这种效果。老式浏览器总是当图像完全下载并解码后才会显示,所以根本不支持这种效果。

透明性

GIF 图像(实际上是 GIF89a 格式的图像)另外一种常见的效果,是它可以让图像的一部分变成透明效果,这样图像下面的内容(通常是浏览器的窗口背景)就可以透过透明部分显示出来。透明的 GIF 图像在它的颜色映射里专门用一种颜色作为背景颜色,从而让显示窗口的背景透过来。通过仔细地剪切图像的大小和选择一种接近纯色的背景颜色,透明图像可以制作成看上去好像完全镶嵌在网页中,或者是浮动在上面的效果。

透明 GIF 图像适合于任何希望融入文档当中但又不希望看上去是个方块的图形。透明的 GIF 徽标十分常见,如透明图标或者印刷符号等 - 任何具有任意的自然形状的图像都可以使用这种效果。还可以在传统文本中插入透明的内联图像,以便在其中显示特殊的字符符号。

GIF 图像的透明效果有一个不好的地方,就是如果把它包含在超链接锚(<a>)标签里面而没有去掉它的边框,或者用框架专门将它括起来时,它看上去会十分糟糕。而且其他内容会围绕图像的矩形边框显示,而不是靠近图像的不透明边框。这样的结果就是不必要地把图像隔离出来,或者使网页看上去非常古怪。

动画

GIF89a 格式图像的第三个独特之处是,它可以实现简单的逐帧动画。通过使用特殊的 GIF 动画工具软件,就可以把一系列 GIF 图像放在一个单独的 GIF89a 文件中。浏览器会相继显示文件中的每个图像,就像我们小时候曾经玩过的(甚至画过的)那种通过快速翻页产生动画效果的小册子。在 GIF 文件中,每个图像之间都具有特殊的控制部分,可以用来设置浏览器从头到尾显示整个序列(循环)的次数,每两个图像之间停顿的时间,以及在浏览器显示后面一个图像之前是否从背景中抹去图像空间,等等。通过把这些特性与那些 GIF 通常具有的特性(包括单独的颜色表、透明性、隔行扫描等)结合起来,就可以创造出非常有吸引力而且非常精致的图像。

简单的 GIF 动画之所以具有强大的效果,还有另外一个重要的原因:不需要特地为 HTML 文档编写程序就可以获得动画效果。但它也有一个非常大的毛病,那就是它局限在一些象图标大小般很小的图形中,或者是只占据浏览器窗口中很窄一条的图形当中:即使你非常谨慎地没有在连续的动画单元中重复静态部分,GIF 动画也是非常容易变得很大。这样,如果文档中包含了多个动画,那么下载这些图像的拖延时间可能会令用户非常反感。如果说有什么特性值得我们非常小心仔细地对待而不至于滥用的话,那就是 GIF 动画。

总结

GIF 的所有技巧 - 隔行扫描、透明性和动画 - 都不是随随便便就可以获得的,它们都需要特殊的软件来准备这些 GIF 文件。现在很多图像软件都可以把用户创建的或者从外部获得的图像保存为 GIF 格式,而且大多数都支持透明效果,还可以实现 GIF 文件的隔行扫描效果。还有非常多专门为这些需要而设计的大量共享软件或免费软件,包括实现 GIF 动画的软件程序等。

成品网站超市图标