网页设计中图形图像处理技巧

◎余 晶

在信息科技化发展的今天，每个行业都离不开网站建设和网页设计，网页设计的好坏决定着人们使用的愉悦性和满意度，最终决定着网页的商业目标。计算机图形图像处理技巧的应用，可以提高网页设计的自身效果，是市场需求的必然选择。因此，掌握设计中图形图像的处理技巧是每个网页设计师必备的基本功。

一、图形和图像在网页设计中应用的意义

与传统传媒技术不同的是，网页设计的元素多样化，可通过文本、图形、图像、声音、视频等多种媒体表现形式，对不同的元素进行剪辑，产生不一样的效果。而在网页设计中，图像图形处理是最为常见的一种处理技术，通过把图形图像和文字相结合的办法，能够有效的传递网页信息，使网页表现形式更加直观。一般图像质量处理良好的网页，或是图像和文字共同编辑的网站，更会成为人们浏览时的首选，也更能吸引人们的注意力，浏览的时间也会越长，有利于把网页的主题和信息传达给网页浏览者，这就很好的体现出图形图像在网页设计中的意义。

二、图形图像的分类

不同的文件格式决定着图像不同的展示效果以及下载方式，理想的文件格式可以使图像在不同的设备上都能良好的呈现，最大化发挥图像的效用，提升用户体验的舒适度。在网页设计中，图片的常见格式有：JPEG（JPG）、BMP、GIF、PSD、PCX、PNG等格式，下面为大家介绍三种最常用的图片格式。

JPEG图片以 24位颜色存储单个位图，是第一个国际图像压缩标准，是应用最广泛的静态图片格式之一，这种图片是经过压缩而来，文件小，便于传输，同时也在很大程度上满足了人们对图片色彩和分辨率的要求，是最适在网页上的摄影图片和数字照相机中使用的静态图片格式，它不支持透明背景图像，更加适合颜色复杂的图像。使用JPEG格式压缩的图片文件一般也被称为JPEG Files，最普遍被使用的扩展名格式为.jpg，其他常用的扩展名还包括.jpeg、.jpe、.jfif以及.jif。

GIF（Graphics Interchange Format）的原义是“图像互换格式”，其“体积”很小，分为静态GIF和动画GIF两种，且支持透明色，可以使图像浮现在背景之上。GIF是网络中最早应用图片格式，通过一个LZW的算法把图像进行无损压缩，有效减少了文件大小，目前几乎所有相关软件都支持此格式。另外，互联网上很多动态图片的格式也是GIF格式，它通过把多幅图像保存在一个图像文件中，形成动画。GIF文件的众多特点适应了互联网的需要，于是它成了互联网上最流行的图像格式，它的出现为互联网注入了一股新鲜的活力。GIF动态图像的制作也与其它图片文件不太相同。首先，我们要在图像处理软件中作好GIF动画中的每一幅单帧画面，然后再用专门制作GIF文件的软件把这些静止的画面连接在一起，再设定帧与帧之间的时间间隔、循环频率等条件，最后保存成GIF动画格式。制作GIF文件的软件也较多，比较常见的有Animagic GIF、GIF Construction Set、GIF Movie Gear、Ulead Gif Animator等。

PNG是GIF和JPEG的结合体。这是因为它设计之初的目的就是试图取代GIF和JPEG格式，增加一些这两种文件格式所不具备的特性。一方面，与GIF格式相比，虽然gif支持透明背景颜色，但它只有1和0两种透明信息，只有透明和不透明之分，而PNG支持α频段0到255的透明信息，可以使图像的透明区域层次分明，同时还能让彩色图像和背景图片的边缘呈现完美平滑的融合。另一方面，与JPEG相比，由于PNG使用特殊的编码方法标记重复出现的数据，它可以实现图像高压缩比，便于网络传输，与此同时保留与图像有关的所有细节，不降低图像质量，这也是PNG最大的特点所在。PNG适合需要重新编辑、颜色复杂或需要透明度的图像，但它并不能普遍兼容每个应用程序和平台。

三、保证网页设计风格要与图形图像相协调

目前，在网络上图片的主要变现形式有退边图、四方图和边缘模糊图，每种形式都具有自己的特点，合理的运用就会产生不同的视觉效果。所以，就需要在网页设计中对图形进行合理的分配，分清哪些是重要的，哪些是次要的，要尽可能的凸显出主要图形的作用，让网页设计的图像表现的更加直观，从而让网页的整体设计效果得到提高。

四、合理优化图片格式，适合网络传输

由于网页设计中页面中的图像和文字都有一定的规范空间，为了不影响网页显示，就要尽量控制图像在页面中占有的空间，降低网页中图像显示的时间，提高网页信息传输的质量。一般网页设计人员都会页面中的文字数量、图像大小、图像质量进行平衡分配，保证页面的传输效果和传输速度。具体方式主要由以下几点：

（一）合理利用图片格式

在网页设计中，一般的图片使用GIF和JPEG的差别不是很大，只是GIF格式的使用体积要比JPEG小的多，所以多数采用GIF格式。但是如果图片的像素要求达到640*480以上的大图片，则应该考虑使用JPEG格式的图片。

（二）对图片进行有效分割

在我们平时上网下载图片的时候，会经常发现这些图片的文件夹中会存在很多比较小的图片，而这些小图片可以组成一幅完整的图形，所以在设计过程中，就会经常使用到图片分割的方法来对图片进行处理，将图片中要体现的重要部分分割出来，在对其余的区域进行适合的背景处理，从而在本质上减少了图片大小，方便浏览和下载。

（三）灵活运用图片处理软件

在网页设计中如果需要加入高清图片或者彩色图片时，要灵活的运用图片处理软件对其进行预先剪裁处理，通常使用的是photoshop软件和fireworks软件，并且图片剪裁后要符合浏览器的支持要求。这里可以考虑PNG格式图片，虽然不支持动画，但是可以保证图片更加丰富多彩，但是PNG格式图片一般都比较大；而对于企业用于宣传的产品动画图片，则可以实用GIF图片，可以很好的保留通道和帧图像，有利于反复播放。

（四）动画图片

动画图片的首选格式便是GIF，当然也可以使用flash或javascript特效动画，虽然动画效果要比GIF优越，但是占有空间太大，所以就要合理优化和平衡网页的制作设计。

（五）增加图片链接方式

在网页设计过程中，有时候会要求设计者在页面中必须添加高清甚至超清的大图片，这个时候就需要采取间接的方式，先去掉不使用的图片文件，通过小图片链接浏览大图片需要另置文件夹，从而实现了网页加速浏览高清图片。

五、结语

综上所述，随着网络媒体技术发展的不断加快，要想把重要的信息传递给浏览者，就需要提高网页设计的质量和艺术感，要增强对浏览者的视觉冲击，从而有效的吸引更多的人来浏览网页，有利于信息传达。所以，运用科学合理的方法对网页中的图形图像处理是非常重要的，既起到承载信息的作用，又能为浏览者提供一个色彩鲜明、内容丰富的网页。