Image Source RF

In this week’s image optimisation tutorial, Alex Jordan reveals the secrets behind getting more views for your images – it’s all about image size, name, and file type.

This session is part of my image optimisation series. For more information about the series please see my introduction.

In this session we will cover best practices that can be achieved with little or no web design or development experience. These practices can help deliver more viewers.

It’s simple. With the right file type, resolution and name, you can dramatically improve the user experience. You will also do wonders for your rankings in search engines.

Format, Resolution and File Size:

The first step in optimising your images for the web is choosing an appropriate file format. Since formats such as PSDs and TIFFs do not render in all browsers and potentially require additional software to read, you should stick to the most commonly used web-safe formats, i.e. JPEGs, GIFs and PNGs, which are supported by all major browsers.

When it comes to optimisation, size really does matter. Search engines penalise websites that take too long to load (too long being a matter of seconds!) so smaller is better when it comes to images on the web!

Reducing the file sizes of your images can be achieved by saving your photos in the optimal format of JPEG, GIF or PNG and by sizing your images at the resolutions at which they will be displayed. Using high resolution images that are then scaled down by the web browser are unnecessarily larger than they could be.

Many suggest keeping images below 10KB, but in this day and age with faster connections and high-definition monitors I think this advice is dated. I agree, keep them as low as possible, but I’d use 50KB as my benchmark size.

Filename and Directory

When search engines interpret what your image is about they don’t have much information to go on. One of the most important ways in which you can describe your images is by the filenames you give them.

Let’s say you have a photo named ‘IMG00047.jpg’, it doesn’t tell you much! If you renamed it to describe the image, for example ‘small-dog-eating-bone.jpg’ then search engines have a little more information to go on. If you then store your image in the ‘/images/animals/’ directory, search engines will have even more information.

Directories also help search engines categorise images. Using the above example, search engines will make the logical assumption that all of the images in the ‘/images/animals/’ directory will be related in some way and will add weighting to the fact that they are categorised as ‘animals’.

So although these changes may seem simple and maybe even tedious, they really could make a difference. The web is a competitive environment and ultimately if you are to succeed you need to ensure your image files are optimised.

Check back next week to find out about ‘alt tags’ and how to use them to tell search engines about what your photos are about.


Your download will start shortly, please do not navigate away from this page until the download prompt has appeared. Doing so may cause your download to be interrupted.