Web Footer Image Optimization with ImageMagick: Principles, Commands, and Traffic Savings

The author shares a practical experience of optimizing three small footer images on a website, showing that lossless compression can reduce an image from 4436 bytes to 915 bytes, saving up to 3.5 GB of daily traffic for 1 million page views.

Key principles for image usage are listed: avoid BMP, avoid GIF for static images, prefer PNG, and strip metadata from PNG and JPG files.

ImageMagick is recommended as the tool for these tasks; it is pre‑installed on many Linux distributions and can be installed on macOS via MacPorts or on Windows via the official installer.

macOS Setup

Install MacPorts (requires Xcode command‑line tools).

Install ImageMagick with sudo port install ImageMagick .

Windows Setup

Download and install the Windows version of ImageMagick, including the libraries.

Open cmd.exe to run commands.

Command Examples

Basic format conversion:

convert bmpfile.bmp -strip bmpfile.png

convert giffile.gif -strip giffile.png

PNG lossless compression and metadata removal:

convert pngfile.png -strip -quality 100 pngfile.png

JPG lossless compression:

convert jpgfile.jpg -strip jpgfile.jpg

GIF to PNG with compression:

convert giffile.gif -strip -quality 100 giffile.png

Batch processing of animated GIFs (resize, optimize, add border):

for f in *.gif; do convert $f -coalesce -bordercolor LightSteelBlue -border 0 -resize 64x64 -layers Optimize -quality 60% new/${f}; done

Crop a portion of an image (e.g., remove 280 px from the right side):

convert 7ef2f0e977b5de9093835fbb.jpg -crop -280+0 7ef2f0e977b5de9093835fbb_c.jpg

The author advises using the latest ImageMagick version because newer releases handle complex image metadata fields that older versions may ignore, leading to better compression results.

Note: The article is reproduced from the company wiki "老何的1001夜"; please credit the source when reusing.