Images as a percentage of page weight for the Alexa top 10 global web sites
图片在网站所占的比重越来越重。更好的优化图片可以提高网站速度。减少宽带流量。
1.对用户上传图片进行缩放
对于用户自己上传的图片不能简单的 用css限制大小，因为这样每次加载图片时候还是会加载整幅大图。占用多余的宽带，并且影响页面加载速度。应该根据实际显示需要进行缩放。比如我想要用户相册里的图片大小不能超过500x300：
用ImageMagick处理起来很简单
2.生成不同比例缩略图
一般相册等应用，都会提供缩略图和预览图，这些缩略图同样不能简单的用css来限制大小，要为每个图片生成不同比例的预览图。
3.去除多余信息
Exif信息是数码相机在拍摄过程中采集的一系列信息，这些信息放置在我们熟知的jpg文件的头部，也就是说Exif信息是镶嵌在JPEG图像文件格式内的一组拍摄参数，主要包括摄影时的光圈、快门、ISO、日期时间等各种与当时摄影条件相关的讯息，相机品牌型号，色彩编码，拍摄时录制的声音以及全球定位系统（GPS）等信息。简单的说，它就好像是傻瓜相机的日期打印功能一样，只不过Exif信息所记录的资讯更为详尽和完备。不过，具有Exif信息的JPEG图像文件要比普通的JPEG文件略大一点。还有就是像PS这种软件处理过的图片会有“program comments”。如果不是专业的摄影类网站，这些信息是没有用的，可以去掉：
4.调节压缩比
大多时候，我们的网站并不需要那么清晰的图片，适量调节JPG图片的压缩比会减少图片大小，肉眼并不会分辨出质量被压缩后的图片。通常75%是最佳比例。
上面几个步骤可以一次搞定：
上面说的都是针对JPG格式的处理方式，下面说一下BMP，GIF，PNG等格式的处理。
对于BMP直接转成JPG就可以了。再按照上面的方式处理。
而GIF和PNG貌似有些特殊。GIF的一些特性（动画效果，透明等）是JPG没有的，可以根据实际情况选择转或不转，如果转换成jpg，取第一帧只需要这样：
PNG也可以通过减少PNG图片color数量的办法达到压缩的目的。但是这种办法压缩出来的图像可以明显看出来失真，而且呈锯齿状。
对于真实世界的PNG图片（通常指照片），一般先转换成JPG，再通过上面的办法来压缩。
但是要注意一点，透明或半透明的PNG图片在转换成JPG时透明部分会变成黑色。。。建议做用户头像时候不要转成JPG。。很难看~~~
本人头像就是深受毒害。。
关于图片扩展名
发现大部分网站喜欢把用户上传的图片（头像，相册等）都统一转成特定格式（一般都是jpg）。这样做的潜在弊端就是在用像ImageMagick这样的软件处理的时候会根据扩展名做隐式格式转换。
个人觉得在保存图片的时候不加扩展名处理起来更灵活一些。
注:把上面的命令行用mini_magick改写用到rails里很容易的。mini_magick本质就调用系统命令行嘛~~
links:
本文所说的都是对用户上传的图片处理，对网站自身的图片（header，banner等）处理《Even Faster Websites》一书第十章里面写的很详细了：
http://www.graphics.com/modules.php?name=Sections&op=viewarticle&artid=756
更多ImageMagick用法:
http://www.imagemagick.org/script/index.php
图片在网站所占的比重越来越重。更好的优化图片可以提高网站速度。减少宽带流量。
1.对用户上传图片进行缩放
对于用户自己上传的图片不能简单的 用css限制大小，因为这样每次加载图片时候还是会加载整幅大图。占用多余的宽带，并且影响页面加载速度。应该根据实际显示需要进行缩放。比如我想要用户相册里的图片大小不能超过500x300：
用ImageMagick处理起来很简单
Im代码 
- convert -resize "500x300>" input.jpg output.jpg #如果图片比500x300小就保持原样，以防小图片被放大失真。
2.生成不同比例缩略图
一般相册等应用，都会提供缩略图和预览图，这些缩略图同样不能简单的用css来限制大小，要为每个图片生成不同比例的预览图。
3.去除多余信息
Exif信息是数码相机在拍摄过程中采集的一系列信息，这些信息放置在我们熟知的jpg文件的头部，也就是说Exif信息是镶嵌在JPEG图像文件格式内的一组拍摄参数，主要包括摄影时的光圈、快门、ISO、日期时间等各种与当时摄影条件相关的讯息，相机品牌型号，色彩编码，拍摄时录制的声音以及全球定位系统（GPS）等信息。简单的说，它就好像是傻瓜相机的日期打印功能一样，只不过Exif信息所记录的资讯更为详尽和完备。不过，具有Exif信息的JPEG图像文件要比普通的JPEG文件略大一点。还有就是像PS这种软件处理过的图片会有“program comments”。如果不是专业的摄影类网站，这些信息是没有用的，可以去掉：
Im代码
- convert -strip input.jpg output.jpg
4.调节压缩比
大多时候，我们的网站并不需要那么清晰的图片，适量调节JPG图片的压缩比会减少图片大小，肉眼并不会分辨出质量被压缩后的图片。通常75%是最佳比例。
Im代码
- convert -quality 75% input.jpg output.jpg
上面几个步骤可以一次搞定：
Im代码
- convert -resize "500x300" -strip -quality 75% input.jpg output.jpg
上面说的都是针对JPG格式的处理方式，下面说一下BMP，GIF，PNG等格式的处理。
对于BMP直接转成JPG就可以了。再按照上面的方式处理。
而GIF和PNG貌似有些特殊。GIF的一些特性（动画效果，透明等）是JPG没有的，可以根据实际情况选择转或不转，如果转换成jpg，取第一帧只需要这样：
Im代码
- convert -format jpg input.gif input.jpg
PNG也可以通过减少PNG图片color数量的办法达到压缩的目的。但是这种办法压缩出来的图像可以明显看出来失真，而且呈锯齿状。
对于真实世界的PNG图片（通常指照片），一般先转换成JPG，再通过上面的办法来压缩。
但是要注意一点，透明或半透明的PNG图片在转换成JPG时透明部分会变成黑色。。。建议做用户头像时候不要转成JPG。。很难看~~~
本人头像就是深受毒害。。
关于图片扩展名
发现大部分网站喜欢把用户上传的图片（头像，相册等）都统一转成特定格式（一般都是jpg）。这样做的潜在弊端就是在用像ImageMagick这样的软件处理的时候会根据扩展名做隐式格式转换。
个人觉得在保存图片的时候不加扩展名处理起来更灵活一些。
注:把上面的命令行用mini_magick改写用到rails里很容易的。mini_magick本质就调用系统命令行嘛~~
links:
本文所说的都是对用户上传的图片处理，对网站自身的图片（header，banner等）处理《Even Faster Websites》一书第十章里面写的很详细了：
http://www.graphics.com/modules.php?name=Sections&op=viewarticle&artid=756
更多ImageMagick用法:
http://www.imagemagick.org/script/index.php
相关推荐
使用ImageMagick的创建，编辑，撰写，或转换位图图像。它可以读取和写入各种格式（超过200种）的图像，包括PNG，JPEG，GIF，HEIC，TIFF，DPX，EXR，WebP，Postscript，PDF和SVG。使用ImageMagick可以调整图像大小，...
ImageMagick命令使用文档
使用ImageMagick的创建，编辑，撰写，或转换位图图像。它可以读取和写入各种格式（超过200种）的图像，包括PNG，JPEG，GIF，HEIC，TIFF，DPX，EXR，WebP，Postscript，PDF和SVG。使用ImageMagick可以调整图像大小，...
ImageMagick
使用ImageMagick的创建，编辑，撰写，或转换位图图像。它可以读取和写入各种格式（超过200种）的图像，包括PNG，JPEG，GIF，HEIC，TIFF，DPX，EXR，WebP，Postscript，PDF和SVG。使用ImageMagick可以调整图像大小，...
windows server 2012 完整的扩展dll+版本适合的ImageMagick压缩包+Ghostscript安装包+thinkphp5的测试代码
ImageMagick, JMagick安装、配置及使用 使用JMagick压缩图片大小尺寸 生成高品质缩略图，jmagick使用指南
ImageMagick英文原版参考手册,附有一个...特别对于ImageMagick内置的批处理语言Conjure有最详细的介绍.在其他地方我都没有看到过. ImageMagick + Conjure是批处理图像的终极工具 虽然本书是英文原版，但非常通俗易懂
Java图片处理解决方案：ImageMagick快速入门教程.docx
ImageMagick
ImageMagick是免费软件：全部源码开放，可以自由使用，复制，修改，发布。它遵守GPL许可协议。它可以运行于大多数的操作系统。ImageMagick的大多数功能的使用都来源于命令行工具。 由本人手动编译，添加了exr格式的...
使用ImageMagick生成水印的JavaScript脚本
利用ImageMagick，你可以根据web应用程序的需要动态生成图片, 还可以对一个（或一组）图片进行改变大小、旋转、锐化、减色或增加特效等操作，并将操作的结果以相同格式或其它格式保存，对图片的操作，即可以通过...
使用ImageMagick的创建，编辑，撰写，或转换位图图像。它可以读取和写入各种格式（超过200种）的图像，包括PNG，JPEG，GIF，HEIC，TIFF，DPX，EXR，WebP，Postscript，PDF和SVG。使用ImageMagick可以调整图像大小，...
使用ImageMagick的®创建，编辑，撰写，或转换位图图像。它可以读取和写入各种格式（超过200种）的图像，包括PNG，JPEG，GIF，HEIC，TIFF，DPX，EXR，WebP，Postscript，PDF和SVG。ImageMagick可以调整图像的大小，...
是一个免费的创建、编辑、合成图片...ImageMagick是免费软件：全部源码开放，可以自由使用，复制，修改，发布。它遵守GPL许可协议。它可以运行于大多数的操作系统。ImageMagick的大多数功能的使用都来源于命令行工具。
ImageMagick是免费软件：全部源码开放，可以自由使用，复制，修改，发布。它遵守GPL许可协议。它可以运行于大多数的操作系统。ImageMagick的大多数功能的使用都来源于命令行工具。它可以读取、转换、写入多种格式的...
ImageMagick是一个免费的创建、编辑、...ImageMagick是免费软件：全部源码开放，可以自由使用，复制，修改，发布，它遵守GPL许可协议，可以运行于大多数的操作系统，ImageMagick的大多数功能的使用都来源于命令行工具。
ImageMagick (TM) 是一个免费的创建、编辑、合成图片的软件。它可以读取、转换、写入多种格式的图片。图片切割、颜色替换、各种效果的应用，图片的旋转、组合，文本...ImageMagick的大多数功能的使用都来源于命令行工具