First posted: Jan 18 2022
Read time: 5 minutes
Written By: Steven Godson
It is absolutely true to say that using images on your website is a great way to make it more interesting, break up large sections of text and generally improve the user experience. In this post, I will share some of my experiences to hopefully make you better informed.
When considering whether an image should be used you should ask yourself the following design question.
“Will it improve what is already there in some way…?”
Some great reasons to say yes are:
If the answer is no, then look no further. However, if your answer is yes, then read on.
This depends on your answer to the following question.
“Am I showing a proprietary product or service that I want to have specific images of on my website?”
If YES, then either hire a professional photographer to take the images you want (make sure the price includes you owning the right to own/use) or, if you are a budding photographer, take the images yourself and store them securely.
If NO, then using stock images is a great way to go. Just make sure you read the licensing terms and understand whether you need to add an ‘attribution’ against each image or somewhere on your website.
Most stock image websites will have ‘free’ content where only attribution is needed as well as ‘premium’ content that you have to pay for on either a subscription or per-image basis.
Examples of stock image sites are:
Image optimisation is all about ensuring that you only use the largest image needed on your website. The size of an image impacts two things:
Speed – how fast your website loads when a user has lower bandwidth for their internet connection, and
Quality – generally the small the image size the worse the quality of the image that is seen.
Example: a 300 x 300 pixel is unlikely to look great if stretched to 1200 x 1200.
One of the great things about using WordPress is that it will, when you upload an image to the media gallery, automatically create, assuming your image is large enough, a number of different versions of the image in different sizes.
So when you go select an image, to include on a page or in a post, it will present you with these options.
This is the point where you need to think about where you are placing the image and how big it is likely to be on a screen. If the image will be nested within text then there is little point in selecting a high-resolution version. The opposite is also true, if you want the image to be the width of a page you need to select a suitably large image resolution.
If the standard resolutions that WordPress provides, as standard, are not enough do not worry. Custom image sizes can be added with a little development.