Recently in graphics Category

There are many websites accepting user’s photos and many of them want very small images. They always specify maximum file size. But many programs designed to help in such problems support only choosing image’s dimensions. So I wrote a Bourne shell script which could help with this.

There is a simple reason why we can’t simply predict appropriate image dimensions – usually the files are compressed. I’ve written previously about using PNG or JPEG on the Web and that files in these formats usually can be made smaller without any visible changes. Therefore, a program should determine appropriate dimensions, knowing how large the output file might be.

My shell script uses binary search to determine the dimensions of the image. It tries to scale a image to an integer percentage of the original size, starting with the original size, then with its half, recursing then in the half in which the optimal size lay, i.e. which has the largest dimensions with file size less than or equal to the specified value. For an image scaled to 17% of its original size it tried 9 scales, when without binary search it would test 100 cases (it would be nice if post offices used this method to find letters).

Like many other shell scripts, this one was designed to be simple. It uses ImageMagick to convert the images between any supported by it file formats and to scale them. If the output file name suggests that it is a PNG or JPEG, then appropriate program is used to make the file smaller without changing its appearance. For JPEGs comments and EXIF date are removed, since in my opinion they are not used by services requesting such small files.

The simplicity of it also leads to some possible problems with the script. Since it does not detect if the input and output files have the same format, even unscaled files are passed through ImageMagick. For JPEGs this may decrease quality. For one of KDE’s wallpapers it even increased file size by 10 KiB (not a real problem since I asked it to make a file smaller than a much large size). The binary search algorithm assumes that the list of output files with increasing dimensions is increasing, I’m not sure if this is true if any compression is used.

The script is licensed under the GNU General Public License, version 3 or later. It is available in my Mercurial repository. I tested it on Gentoo GNU/Linux with the dash shell.

Several weeks ago I wrote about raster graphics file formats used on Web. Today I read an article by Susie Sahim about optimizing such files.

The basic things to do are:

• crop out blank margins – the video by Sahim shows how to do it ‘by hand’ in a proprietary image editor; the GIMP has special functions to do it automatically
• use appropriate file format

Usually only three file formats are available for graphics on the Web – GIF, PNG and JPEG. The article states that JPEG should be used for photos and colourful artwork; it does not explain that the lossy compression of this format has negative influence on image quality least visible in these types of artwork.

The article recommends using GIF or PNG images with small number of different colours. Maybe the software used in the video does not have this problem, but most programs which I use make large PNG files. This can be solved by processing them by OptiPNG. OptiPNG does this more slowly than program producing highly unoptimal PNGs, but more time will be saved on transfer of the file. This program also selects optimal colour space and converts similar file formats to PNG.

I don’t use GIFs, but in some cases they are smaller than PNGs produced from them by OptiPNG. The only cases in which I’ve observed this are icons; maybe it is better to put many icons in one file and select then by CSS property background-position?

On the Web mainly two raster graphics format are used – PNG and JPEG. They both have specific uses and are nearly useless in others.

PNG is used for computer generated graphics, i.e. everything that is not a photo. Most of these are generated from vector graphics formats, so SVG should be better for them, but most web browsers have better support for PNG.

Many years ago the GIF format was used instead of PNG. Then there were patents on an algorithm used for GIF compression, which led to the development of PNG. Now non-animated GIF is clearly obsolete, since PNG supports higher quality graphics (e.g. by having 24-bit colour or gamma correction) and has smaller file size due to better compression.

JPEG files are used only for photos. This is because they use a compression algorithm which decreases quality in a way visible in most graphics except photos. It also does not provide such features as alpha transparency which are useless for photos.

Compression algorithms for both PNG and JPEG may make many compressed files which can be decompressed to the same graphics (most compressed file formats have this property which has very uncommon uses). In case of PNG, there are several parameters selected by the compressing software. The choice of optimal values of these parameters is difficult without many slow trials, so there are programs like OptiPNG optimizing PNGs to decrease their size without any change in decompressed image. For JPEGs there are similar programs, e.g. jpegoptim. Both of these programs largely decreased sizes of some files which I recently used and generated by Inkscape or the GIMP.