Optimise the images

There are two steps to reducing the size of each image:
   1. Reducing the number of colours to fewer than 256;
   2. Compressing the resulting image as much as possible.

Reducing the number of colours

This step is very important: it is crucial that your chosen Image Manipulation package is flexible in its palettising options.
In Photoshop and its siblings (I used Photoshop Elements), you need to change the mode of the image (from the Image | Mode > menu). For each image:

   1. Choose Indexed Color (Indexed... in The GIMP), and a dialogue box will appear.
   2. Choose a Local palette (Perceptual, Selective or Adaptive are available). Your aim is to let the package choose the most appropriate set of colours itself. In The GIMP, choose Generate Optimum Palette.
   3. Set the number of colours - 128 is fine for Photoshop, but use 256 in The GIMP.
   4. Photoshop only: set the Forced colours to Black & White.
   5. Important: set the Dithering to None (No Colour Dithering in The GIMP). The images are of dialogue boxes, which contain large patches of identical pixels. By preventing dithering, you force the package to keep these large patches, which is good for compression.
   6. Photoshop only: if you check the Preview box, you can see the effects of your options as you change them.

Note: the smaller, icon-sized images compress better if left as True-colour images. If an image is larger than 30×30 pixels, use the above procedure.

Compressing the image files

Image manipulation packages tend to be rather poor at compressing PNG files well. Therefore, you'll need to recompress the images. When saving the files from your chosen Image Manipulation package, ensure they are saved as interlaced files.
If you are including the Help images in the download, you need only use pngout, a closed-source, freeware PNG image optimiser.
If you are having the images hosted by mozilla.org, you will want to save the larger files using interlacing, which allows a low-resolution image to appear quickly and be “upgraded” to the full resolution version as it downloads. For these larger files, you'll need pngrewrite and pngcrush, which are both open-source PNG image manipulators that preserve interlacing.

pngrewrite optimises the palettes of PNG images. Its syntax:

>pngrewrite file.png file_out.png

pngcrush recompresses PNG images, preserving interlacing. The syntax you want:

>pngcrush -e .c.png -brute -l 9 file_out.png

pngout also recompresses PNG images, but removes interlacing. The syntax you want:

>pngout /c3 /b2048 file.png file_out.png