duncan­lock­.net

How I compress PNG files on this website

Fri 5th July, 2013
by

3 min read, 681 words.

updated Tue 1st June, 2021

Category: tech

Tags:

Compressing Limited Colour PNG images

Most of the .PNG files on this site are the ‘blueprint’ style diagrams, like this one:

Blueprint style diagram showing an optical microscope. The sample inside is magnified in a bubble to 2500 times, showing it to be a complex, detailed paisley pattern.
Figure 1. This illustration is a large 5.6MB SVG file, mostly because of the very detailed paisley pattern that I used. Exported to PNG - and then compressed using the process below, you can get this down to 118.5kB.

I create these in Inkscape as vector .SVG files & export them to bitmap .PNG files. I then re-compress them, to ensure that the image files that are used on the live website are as small & quick to load as possible.

As these diagrams have a fairly limited colour palette, I can get lots of extra compression by reducing the colour depth of the final .PNG files from the default 32bit (millions of colours) to 8bit (256 colours) - without any …

Continue reading “How I compress PNG files on this website”