网页图片压缩优化方法大全

不少网站为了美化自身,用了很多小图标、背景图片,在视觉上吸引住了不少读者;然而,随着图片数量不断增加,由于图片造成的网页体积大幅上升直接导致了网页加载时间的大幅增加,严重降低了用户体验。很多站长最后会发现,滥用图片,得不偿失。

Smush.it

如何最大限度地减少图片对网页加载速度造成的负面影响,成为了众多站长冥思苦想的难题。笔者经过长期实践总结出了两个要点:

  1. 压缩图片体积
  2. 将图片并入CSS并用CSS Sprite技术合并

今天,说说第一点:压缩图片体积。(提示:同等视觉效果,JPEG格式图片比PNG格式图片体积要小很多。)

方法一:使用Photoshop压缩图片体积

1. 打开要压缩的图片

用PS压缩图片体积

2. 选择 文件>存储为Web和设备所用格式

用PS压缩图片体积

3. 在右上角调整图片格式和品质,在图片失真不明显的前提下压缩图片体积,点击 储存 保存图片。

用PS压缩图片体积

方法二:使用Yahoo! Smush.it 在线压缩图片(无损压缩)

Yahoo! Smush.it是Yahoo提供的免费在线压缩图片服务,值得注意的是,它的压缩是“无损压缩”,也就是说,经过它压缩的图片绝对不会失真,所以,压缩程度比第一种方法稍差。可以上传本地图片,也可以输入网页上图片的链接。支持多图片处理。

Smush.it

压缩后建议勾选Keep directory structure in zip file,这样会以 Zip压缩包下载优化后的图片,而且会保存图片原来的目录结构。

Smush.it

方法三:用OptiPNG压缩 PNG 格式图片(无损压缩,仅针对PNG格式图片)

PNG格式图片在网页上广泛应用,最大的特点是 支持透明背景(只有GIF和PNG格式支持透明背景)。试过以上两种方法的同学会发现,PNG格式图片压缩效果不佳,基本“榨不出多少油水”,如果硬是用PS把品质降低,就会导致严重失真,如果把图片格式转换为JPEG,会丢掉透明背景。

大家不妨试试OptiPNG这个软件。首先下载该软件。解压下载的optipng-0.5-exe.zip压缩包,得到optipng.exe程序,我们只需要这个程序。

optipng.exe使用非常简单,将PNG图片拖拽到程序上,用程序“打开”该图片。

随即,OptiPNG 会自动进行图片优化处理。处理好后,会覆盖原图片。(如果想保留原图片,建议事先保留副本)

总结:图片压缩类软件很多,无外乎笔者介绍的有损压缩(PS) 无损压缩(Yahoo! Smush.it、OptiPNG)

本文作者:Jeriff Cheng
个人博客:爱佳软(www.92app.com)

标签

发表评论

评论已关闭。

评论列表(15)

  • 雨天潮人网

    2012.6.28 09:06

    我来

    踩下我的脚印

    证明下 我真的在关注次博客 哈哈哈

  • 雨天潮人网

    2012.2.18 09:02

    一直在找图片压缩方法 碰巧在这儿找到了

  • 星雨镇Roy

    2011.6.4 16:06

    学习了,我直接用PS调jpg图片质量

  • 星雨镇Leo

    2011.6.2 12:06

    这个非常好用

  • 小西

    2011.6.1 10:06

    哈,我都用JPG的图片。。PNG的都不用

  • ET淘软件

    2011.5.31 22:05

    这个可以有

  • 黯然过客

    2011.5.31 16:05

    不错的总结,经常为图片文件大小纠结。不过我最常用的是Faststone Capture的保存选项了。

  • zrqx008

    2011.5.31 15:05

    一般没怎么压缩图片的。

  • 软件街小秘

    2011.5.31 12:05

    我是用软件压缩的

  • 古道私语

    2011.5.31 11:05

    我也是一般使用方法一,不过有时效果不佳。有时只能舍弃色彩追求最小压缩。

    • Mr·K

      2011.5.31 11:05

      To 古道私语:如果不压缩,流量伤不起啊。

  • elaphent

    2011.5.31 10:05

    饿,一般不压缩,感觉总会丢失细节

  • Mr·K

    2011.5.31 09:05

    我一般使用方法一

  • 美女图片

    2011.5.31 09:05

    貌似有些复杂,压缩后的图片应该不影响效果吧

    • Jeriff Cheng

      2011.5.31 12:05

      推荐方法二,用Smush it压缩。这是目前最好的无损压缩工具,在不失真的前提下,最大限度地剔除图片多余色彩信息,压缩体积。