Download - Make your site faster through image optimization - GoDaddy

How To Make Your Website Faster

Episode 2) Image Optimization

The Goal

Smallest filesize;still looks great

1.01MB 92.76 KB

What Format? When? How?

JPEG (JPG)Use for

● Photo

Tips● Resize WxH● Remove all metadata● Progressive always● 75 quality, try lower

PNGUse for

● Graphics (logos, graphs)● Transparency

Tips● Resize WxH● Remove all metadata● Interlace size tradeoff● Try 8-bit (256 colors) and lower

○ 24bit okay

GIFUse for

● Very small image (1x1 pixel)

● Animation needed

JPEG - Quality vs File Size!

Tools of the trade[GENERIC TOOLS]RIOT Windows GUI based and CLI based + batch processing

ImageOptim GUI based tool for Mac

ImageMagick Multi-platform command line utility

[ONLINE TOOLS/SERVICES]Smush.It Yahoo’s free JPEG and PNG optimizer

tinypng Free drag & drop tool for PNG optimization (reduces color palette to 8-bit!)

kraken.io Supports JPEG, PNG and GIF - free and paid service

JpegMini JPEG optimization; free and paid services

[OTHERS]PNGOptimizer, PNGcrush, OptiPNG, JpegOptim, JpegTran

http://luci.criosweb.ro/riot/





http://imageoptim.com/

http://imageoptim.com/

http://www.imagemagick.org/script/index.php




http://github.com/thebeansgroup/smush.py




http://tinypng.org/

http://tinypng.org/

http://tinypng.org/

http://tinypng.org/

http://tinypng.org/

http://www.kraken.io




http://www.jpegmini.com/





http://psydk.org/PngOptimizer.php

http://pmt.sourceforge.net/pngcrush/

http://optipng.sourceforge.net/

http://freecode.com/projects/jpegoptim

http://jpegclub.org/jpegtran/

http://psydk.org/PngOptimizer.php

Athletesbrand.com - Before/After

0.7 MB!2.8 MB!

BEFORE AFTER