Images are very effective in generating interest, showcasing your product and drive a person to a call to action. Adding images to a site also leads to an increase in time spent on the site. This is because a visitor spends more time exploring the product. According to Neilson pictures are treated as important content and scrutinized by the visitor.
When you were last booking a hotel room, apart from prices, what was the one thing that you spent time looking at?
You were scrutinizing the hotel by looking at the images on their website, weren’t you?
But at the same time when images are not used correctly it can be a source of frustration. Imagine you want to look at what a room looks like and the image is so small you cannot tell clearly whether it is good or not. This leads to a bad user experience and potentially a loss of sale.
Here is how Four Seasons uses image & colour to guide you to their call to action.
They use a big image on their home page to create an immersive environment and then they use the colour red as the background for their ONE call to action, Make A Reservation.
We are programmed to stop and pay attention as soon as we see the colour Red. This not only assists in guiding your vision to the call to action but also gets you to pay attention to it.
This is Peter Island Resort; they have some impressive imagery on their site. One of the rotating images is of this model in the water. Studies show image of a pretty women make men impatient and they look for immediate gratification (in this case it would be making a reservation) but this picture while doing the job per the study it is leading the viewer away from the content on her left.
If the content was placed from her left to her right it would have lead to better focus and engagement with the message.
Look at the result of this heat map generated from an eye tracking study and the impact of the models looking at the product or towards the message.
The red areas in the image are where people focussed the most. It was directly influenced by where the model was looking.
In the first instance the viewers only saw the headline when the model looked directly back at you. When it was switched to the model looking at the shampoo you can clearly see (marked by the red hot area) how it leads to the looker following her line of sight.
It had the similar effect in the second instance too. The headline and the image of the product become the focus of attention.
When Google launched Google plus,this is how they announced it on their homepage.
Anybody who came to their homepage saw the big blue arrow leading their eyes to the +You button on the page. It was a clear way of directing the visitor to the call to action and reduce distractions by making the arrow so prominent.
How we use colours and an arrow to guide your line of sight.
This site has one very clear goal. We want you sign up for blog updates. There are two ways we are guiding you to sign up by targeting your line of sight on the home page.
1-The colour: The colour orange stands out from everything else around it and it is a trust colour. This highlights the Call to Action.
2-The arrow: The arrow here reinforces what I am trying to do with the colour and guide your vision to the sign up button.
When deciding on using images and colours keep in mind how it is impacting the visitor and how it is guiding the visitor to the one main goal of your site.
-Make sure the image you are using is in context with what the visitor is looking for.
-If you use the right image it will increase engagement.
-Size of the image matters
-The colours used for the call to action and the images used are part of non-verbal website intelligence
What are you doing with the images on your website and how are you using it sell rooms?