Skip to: Navigation | Content | Sidebar | Footer

Weblog Entry

Toned Photographs on the Web

November 19, 2002

Unfettered by the freedom a 16.7 million colour palette offers, it’s compelling to use the full-colour version of a photo for maximum impact.

Using full-colour photography due to lack of technical limitations is a choice made by limited designers though. While not inherently wrong, the inevitable “it’s a full-colour photo, why not use it?” is a simplistic view, and it can be equally argued that if we have a 26-letter alphabet, why not use all the letters in every sentence?

Photography in the context of good design is used to accent and highlight. It can bring context to a piece, or provide additional information. A picture is worth a thousand words, but those thousand had better say something important, or they’re liable to fall on deaf ears.

Photographs are useful because they can provide realistic detail that will pump up an otherwise flat piece. However, as with any element of design, a balance needs to be struck between too dull and too much.


Toning a photo doesn’t necessarily mean bumping the colour value to monochrome and then assigning it a uniform hue. Adjustments to the overall colour makeup can be made subtly with Photoshop’s adjustment layers.

Increasing the brightness of the red channel can change an outdoor scene from bleak and winter-esque to warm and summery by adding more warmth to the photo. Dropping the contrast and toning a portrait with subtle blue tones can add a melancholy feel that accentuates the subject. The experienced designer will tell you there are many levels between full colour and monochrome colour.

figure 1

In figure 1 we see an ambiguous photo of a woman on the phone. What emotion is she showing? Anger? Excitement? Triumph? The designer can interpret it any way he wants, and reinforce his view by colouring the photo to match.

The original photo is on the left. The center photo has been toned with additional red to boost the dynamic nature of the photo and increase the visual tension. The woman takes on a more aggravated or angered look, simply due to a minor colour change. On the right, the same photo has been toned a monochrome blue to cool it down and give it a more tranquil feel. The subject matter conflicts with the peace of this new colour scheme, however, so this particular variation is unsuccessful.

weight considerations

Sometimes a photo is needed to provide context for the surrounding text, but isn’t as important as the text itself. A lush, vivid photo thrown into this scenario can only serve as a distraction and draw the reader’s eye away from the text.

figure 2

This is illustrated in figure 2, above. The panel is an ad that requires primary focus on the text. The example on the left uses the full-colour photo and seems to emphasize the “confusing” message of the piece, since the eye has no resting place within the borders of the white box. Too much is happening, and it’s overly confusing for the reader. The example on the right uses a toned version of the same photo that takes on the same lack of dominance as the less important faded text in the background, leaving the main message in the foreground clearer and more easily readable.

The designer’s job is to make the decision on a case-by-case basis of what processing needs to be applied to the photography being used, if any. As in other facets of design no rules exist that can’t be broken, but it’s important to establish a general guideline in your own work to keep your approach consistent, clean, and logical.

Develop an eye for picking up the most important part of a page. Determine if the surrounding photography adds to it. If the distraction is too great, figure out a way to pull it back and restore the focus to the element that deserves it.

Good design is part function, part form; making the proper choices when processing your photographs will satisfy both sides of the equation.

Reader Comments