One of my first assignments at Clockwork Design Group was to select potential photographs for a client’s redesigned website. At the beginning of the day I was energized and enthusiastic. By days end I was blurry eyed and full of questions. Exactly how do I illustrate a page for nonprofits and religious organizations when the customer requests no faces? How do I show an image of waste services that represents the industry but isn’t unappealing?
Since then I have a new appreciation for the imagery I see on websites I visit. And now, I know the effort that goes into those selections. Here are some words of wisdom from the staff at Clockwork that I have compiled to help you choose your images successfully:
Quality Images
You may consider hiring a photographer to take custom photographs, utilize stock photos, or a combination. Either way, you always want professional, high quality images. Screen resolutions on monitors and mobile devices are getting much higher, so make sure the photos you shoot or download are large enough so they look sharp on modern screens.
Relevant Photos
Images help your user navigate your website. Users will “read” the photography before they read the text on the page. So, you need the photographs to help you describe the purpose of the page the user has landed on. When choosing photos, think “main message” rather than focusing on the technical details of your subject matter.
The Power of People
Faces of people are a way to immediately connect with your readers, so be sure to utilize people who reflect your target audience. Studies show that users relate and respond to faces (of people as well as animals).
Consistency in Imagery
You are telling a story to your readers and you want a consistent story from the home page and beyond. Be sure the choice and treatment of the photos is uniform. Are you using black and white photos? Then use them exclusively. The same is true for color, cropping, style, and orientation of your photos.
Here is an examples of a client’s website that illustrates how we leveraged photographs to create a powerful, consistent brand:
On the Anderson Kreiger pages (above), notice how each page uses black and white “silhouetted” photographs. Each image is “cut out” and breaks the frame of the blue to green gradient it is superimposed onto. Silhouetted photos are seen as objects, in contrast with “square-up” photos, which are defined by the box they are within.
Now to test your skills, in each group of four images below there is one photo that doesn’t fit in. Can you figure out which photo doesn’t belong?
Although two of these images show chess pieces, D is a square-up, while the other three photos are silhouetted. Option D, therefore is inconsistent with the overall style.
Three of the photos below were used for Modrall Sperling’s website, a law firm located in Albuquerque, New Mexico. Which one doesn’t belong?
Hopefully you picked C. While all landscapes, all the others reflect similar color schemes that coordinate with Modrall Sperling’s warm palette of oranges and yellows.
The next test is a little harder. Can you tell which photo looks out of place?:
Three of the banners above are from Peak Financial Management’s website. Capitalizing on the company’s tagline, “We see the difference,” each photograph changes from a full-color image to black and white, with one object remaining in full color. In this line up, B is the photo that doesn’t fit, since it is all full color, not following the pattern.
The old adage, “A picture is worth a thousand words” is no less true in website design. Your website’s pictures are another way to reinforce your brand and tell your company’s unique story to the world.
Related Posts:
Where to Find Great Stock Photos
Design Lesson: What is Depth of Field?
