心得技巧

关注公众号 jb51net

关闭
网页制作 > 心得技巧 >

网页图片优化工具及使用技巧分享

脚本之家

作为网页的基本元素,图片是影响页面加载速度的关键因素之一。和图片相关的网站优化技术有 CSS Sprites(图片合并)、延迟加载、图片渐进增强等等。下面向大家分享网页图片优化的一些优秀工具和技巧。

TinyPNG

TinyPNG 使用智能有损压缩技术,以减少 PNG 文件的大小。

Tools and Tips on how to Optimize Images for the Web

 

Smush.it

Smush.it 通过删除图片文件中的不必要的字节信息来减少图片尺寸。

 

OptiPNG

OptiPNG 是一款 PNG 图片压缩工具,不会丢失信息。

Tools and Tips on how to Optimize Images for the Web

 

ImageOptim

通过找到最好的压缩参数,消除不必要的注释和颜色配置文件,可以处理 PNG、JPEG 和 GIF 动画图片。

Tools and Tips on how to Optimize Images for the Web

 

CodeKit

CodeKit 可以帮助你建立更快,更好的网站,它也可以帮助你优化图像。

Tools and Tips on how to Optimize Images for the Web

 

imgo

imgo 是一种无损图像自动优化工具。能够把一个文件夹中的图像最大程度的优化。

Tools and Tips on how to Optimize Images for the Web

 

jQuery Lazyload

用于延迟图片延迟加载的 jQuery 插件。

Tools and Tips on how to Optimize Images for the Web

图片优化文章推荐

Smashing Magazine – Optimize Images With HTML5 Canvas

Smashing Magazine – Clever JPEG Optimization Techniques

Smashing Magazine – Clever PNG Optimization Techniques

The Smashing Book – Performance Optimization for Websites

A List Apart – Responsive Images and Web Standards at the Turning Point

A List Apart – Using SVG for Flexible, Scalable, and Fun Backgrounds, Part II

A List Apart – Using SVG for Flexible, Scalable, and Fun Backgrounds, Part I

Six Revisions – The Comprehensive Guide to Saving Images for the Web

Six Revisions – JPEG 101: A Crash Course Guide on JPEG