Using the right photos for a design project is extremely crucial to its success. In this article, I’ll discuss a few ideas that will help you unleash the true potential of your web images.
At this point you may be wondering: Are images really important?
Let me tell you a story about how photos can make or break a company.
During the early stages of Airbnb.com — now a company worth $10 billion — it was on the . Faced with the challenge of growing the company in order to survive, co-founder Joe Gebbia set out to learn why his startup was underperforming.
To get his answers, he analyzed all 40 of the site’s rental listings in New York. During the analysis, Gebbia saw a distinct similarity among the rental units. “The similarity is that the photos sucked. The photos were not great photos,” the Airbnb co-founder said. “People were using their camera phones or using their images from classified sites. It actually wasn’t a surprise that people weren’t booking rooms because you couldn’t even really see what it is that you were paying for.”
His team took a leap of faith to test the theory: They went to New York, rented cameras, took high-quality photos of the rental units, and updated the listings on Airbnb.
A week later, Airbnb’s revenue increased by 100% — a decisive turning point for one of today’s biggest tech companies, and a lesson on just how important images are.
Information-Rich Images
Photos are effective tools for conveying information. about photos conducted by usability consultant Jakob Nielsen reported that “users pay attention to information-carrying images that show content that’s relevant to the task at hand.”
Images can transmit your ideas instantly, and are more easily comprehended than other forms of web content. For instance, if you were asked to explain the key factors involved in generating revenue for a website, you could do so efficiently with just one simple visual.
Examples of information-rich images are:
- High-quality product photos
- Illustrations and diagrams
- Flowcharts
- Graphs
- Infographics
Directing Attention
An image has the ability to affect the way we look at a design. Usability specialist James Breeze conducted to understand how photos can deliberately draw our attention to specific places of a design.
Breeze discovered we tend to first look at the faces of people in a photo, and then follow their eye gaze. In other words, our attention naturally goes towards whatever the subject of the photo is looking at.
Let’s see if this idea really works.
Ready?
Look at the following photo and then note down where your eyes go:
In the sections of the web design where you want the most attention, consider using a photo with a person gazing towards it.
Strategic Placement of Photos
The location of your images relative to the overall design is very important. A reported by web analytics company Kissmetrics reported on how Ogilvy, one of the biggest marketing firms in the world, was able to get their website’s headline text read by more people simply by placing a photo above it. 10% more people read the text as a result of this seemingly trivial design update.
In this web design, the headline might be read by more people when placed below an image, as shown.
Top Five Tips for Using Images
- Think big picture: Know your client’s goals for the design project before choosing your photos.
- Use information-rich images: Photos aren’t merely decorative art; a picture is worth a thousand words.
- Put images in strategic locations: Think about how a photo can reinforce key areas of a design.
- Analyze your photos: Tools such as VWO and Optimizely can help you determine whether or not your images are providing the results you want.
- Use images in moderation: Too many photos can be distracting, and can severely slow down a website.