Optimise the Graphics on Your Web Site

Posted in Design by 3wise Solutions with 0 comment(s)

The biggest influencing factor on the loading speed on any of your web pages is invariably the graphic content.

Many clients make the mistake of wanting a big flashy graphic to welcome visitors to their site but don't realise that this will be slow to load and impatient visitors will move on instead of waiting.

Where it is possible to have a decent sized graphic on a page there is a skill in getting the speed of loading and the quality of the graphic right.

GIF or JPEG

The format of graphic is often dictated by the number of different colours that are in the graphic. As a rule of thumb, use JPEG for photos and GIFs for graphics with few colours. GIFs do support up to 256 colours so if you have say a black and white photo you could get away with using a GIF as normally this will create a smaller sized file.

When compressing photos in JPEG format, you should be aware that high compression factors will create what are know as compression artifacts. These are areas in the picture where the compression has optimised an area but the optimisation is visible.

I often see graphics where there is a text box and a photo beneath and the text looks messy because of the high JPEG compression. In these instances, you should slice the picture and create the text box as a GIF and the photo as a JPEG. See below for an example.