Optimize images for the web

Convert to another format

Install ImageMagick:

# pkg_add ImageMagick
quirks-3.16 signed on 2018-10-12T15:26:25Z
ImageMagick-6.9.10.10p1: ok
#

Convert PNG to JPG:

$ convert file.png file.jpg
$

Optimize size of JPG and PNG files

Install jpegoptim and optipng:

# pkg_add jpegoptim optipng
quirks-3.16 signed on 2018-10-12T15:26:25Z
jpegoptim-1.4.6: ok
optipng-0.7.7: ok
#

Run jpegoptim:

$ jpegoptim \
--strip-all \
--preserve \
--preserve-perms \
--verbose -m80 \
file.jpg
Image quality limit set to: 80
file.jpg 300x300 24bit N JFIF
[OK] 22417 --> 11849 bytes (47.14%), optimize
$

Run optipng:

$ optipng -preserve -strip all -o7 file.png
** Processing: file.png
400x400 pixels, 4x16 bits/pixel, RGB+alpha
Reducing image to 3x16 bits/pixel, RGB
Stripping metadata...
Input IDAT size = 42804 bytes
Input file size = 43049 bytes

Trying:
  zc = 9  zm = 9  zs = 0  f = 0         IDAT size = 27513

Selecting parameters:
  zc = 9  zm = 9  zs = 0  f = 0         IDAT size = 27513

Output IDAT size = 27513 bytes (15291 bytes decrease)
Output file size = 27570 bytes (15479 bytes = 35.96% decrease)
$

Optimize size of SVG file

Install node and svgo:

# pkg_add node
quirks-3.16 signed on 2018-10-12T15:26:25Z
node-8.12.0: ok
# npm install -g svgo
/usr/local/bin/svgo -> /usr/local/lib/node_modules/svgo/bin/svgo
+ svgo@1.2.0
added 49 packages from 83 contributors in 1.274s
#

Run svgo:

$ svgo file.svg

file.svg:
Done in 59 ms!
3.522 KiB - 45.2% = 1.93 KiB
$