The Right Image

More and more people are creating their own websites and although that’s potentially less work for me I’m all for it. There is, however, a disturbing side effect of hairdressers, mechanics and other people with actual skills dabbling in the arty farty world of web design.

When I create a blog post or a new page on the internet I’ll spend the next few hours looking at it from every conceivable angle and on every device I own. I suspect the owners of these sites have actual jobs to do so don’t have the luxury of checking that their page looks good on a Nintendo Game Boy screen.

At this stage of my web career, I very rarely alter an image that I have uploaded as I’ve normally prepared the image first and have a good mental picture of its placement on the site. I’m also assured that it will scale properly on different devices as all my sites are responsive. I can only conclude from those two facts that I’m spending all this time looking at my recent work for self-gratification.

Sadly you could all learn a thing or two from my compulsion to smile and point at everything I do.

I’m not suggesting that you spend as much time as me on selecting your images but you could at the least follow two basic tips to ensure your site retains a professional appearance.

1: Select the right Image

Making sure the image fits with your site is not just about the quality or the content of the image but also its proportions. You don’t want to put a portrait picture into a space configured to display a landscape image, I’m not saying you should never do that but be prepared for the top and bottom of your image to be chopped off. Make sure your picture is big enough for the space as well, a picture that’s smaller than the space it’s uploaded into will be enlarged to fit and if it’s a lot smaller it can look very poor quality. If you’re concerned about the file size of large images you can add plugins to your site or visit websites that will optimize your images for free (usually capped for free accounts).

2: Check Your Work

This sounds like a no-brainer but when this isn’t your day job it can be all too easy to go back to your real work and leave your site for others to look over. Sadly the ‘others’ are your customers and if you chop an important picture or have a number of images on the same page, maybe on your shop page and those images are all different shapes and sizes your site can look chaotic.

In Summary:
Check your work. Have a set of standards that everyone that posts on your site can follow.

If You Don’t Believe Me Here Are Some Examples.

Use Images of the same proportion

The example below gives a good visual representation of what happens when you use images of different sizes. You won’t notice the difference if you are looking at the page on a mobile device but on a larger screen the difference in size of the center image breaks the flow of the images. If this was added in the form of a slider the difference would look even worse. I’ve added a portrait image to the bottom center so you can see the issue more clearly.

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

Try and Repeat the style of your images

This is a much more subtle difference but if you are presenting a large number of items or images then the more styles you have the more confusing your site will become. The last image is obviously of a flower but it’s not been taken in the same style as the first two images so looks a little out of place.

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

Tell A Consistent Story

If you’re selling stuff then add your images so they show your products off in a uniform manner, set a standard image list so each product has for example: a head on shot, 45 Left, 45 right and a rear shot.

A Title or Price

A Short Description

A Title or Price

A Short Description

A Title or Price

A Short Description

Leave a Reply

Your email address will not be published. Required fields are marked *

This website uses cookies. By continuing to use this site, you accept our use of cookies.