Read more

Optimizing images for web

Daniel Straßner
July 03, 2018Software engineer at makandra GmbH

For webpages to load fast it's recommended to optimize images. Ideally an image's file size should be as small as possible while still being of decent quality. This card demonstrates two command line tools for image optimization

Illustration online protection

Rails Long Term Support

Rails LTS provides security patches for old versions of Ruby on Rails (2.3, 3.2, 4.2 and 5.2)

  • Prevents you from data breaches and liability risks
  • Upgrade at your own pace
  • Works with modern Rubies
Read more Show archive.org snapshot

Use identify to fetch information about pictures. convert can change size/quality and strip meta information. Both commands are supplied by ImageMagick.

$ identify in.jpg
in.jpg JPEG 294x440 294x440+0+0 8-bit sRGB 92.8KB 0.000u 0:00.000
$ convert in.jpg -resize x220 -strip -set profile sRGB2014.icc -quality 85 out.jpg
$ identify out.jpg
out.jpg JPEG 147x220 147x220+0+0 8-bit sRGB 10.1KB 0.000u 0:00.000

Always check the output for quality and compare to the original. It's also important to set a color profile after using ImageMagick's -strip method.

For some projects we used TinyJPG Show archive.org snapshot in the past, which is a web service that will significantly reduces file sizes even further.


webp

You might also consider using the webp Format for images which could be further compressed. Try https://squoosh.app/ Show archive.org snapshot for converting your images.

Posted by Daniel Straßner to makandra dev (2018-07-03 10:30)