On My Header Image
In what is probably the biggest visual change since I first created this theme back in ’05 — yes, it’s that old! — on June 2, 2011 I replaced the header image with a picture I took a month prior in the Keukenhof.
The opportunity presented itself to experiment slightly with decent JPEG compression, rather than simply depending on GIMP’s output, which unfortunately is virtually guaranteed to be suboptimal. Since all I did was crop and resize, I used PNG as my working format. I might’ve been able to use jpegcrop
and jpegtran
, but since I was going to re-encode in a lossy manner afterward that would have been nothing but needless extra effort.
First I tried cjpeg
, which doesn’t support a lot of input filetypes, so I had to save a copy as BMP.
cjpeg -quality 80 -optimize -progressive -dct float -outfile test80.jpg head.bmp
Then I discovered that imagemagick can do the exact same thing, optimized by default and everything. It also uses libjpeg under the hood, so the resulting image is exactly the same.
convert -quality 80 -interlace plane head.png test80.jpg
That results in JPEGs that are about as small as they can get without enabling options that might not be readily supported by all viewers. I wrote a (very) simple shell script to aid with a quick overview of size versus quality.
#!/bin/bash
#jpegs.sh
filename=$1
extension=${filename##*.}
filename=${filename%.*}
convert -quality 30 -interlace plane $1 ${filename}30.jpg
convert -quality 40 -interlace plane $1 ${filename}40.jpg
convert -quality 50 -interlace plane $1 ${filename}50.jpg
convert -quality 60 -interlace plane $1 ${filename}60.jpg
convert -quality 70 -interlace plane $1 ${filename}70.jpg
convert -quality 80 -interlace plane $1 ${filename}80.jpg
My rationale is that any quality under 30 is most likely too ugly and anything over 80 will result in a file size that’s too large for my intended purpose of using lower quality — but not low quality — images on the Internet.
I also decided it was time to get rid of my half-hearted concessions to Internet Exporer. This in no way inhibits readability of the content.
Permalink Tags: photography
[…] with lossless cropping first. After scaling down, check how long your quality can go (also see a little helper script I wrote). In any case, you should avoid introducing any unnecessary compression steps with associated […]
March 25, 2017 @ 15:24Permalink
Image Optimization Guide | The One with the Thoughts of Frans