Text and Images

These days we all are surrounded by a multitude of devices. And most of them have high resolution screens. This (and high internet speeds) makes it an attractive option for the designers to use huge images to make their creations more attractive and catchy. People tend to like beautiful images, even if they are unrelated to the content. It is not always easy to do it right, though.

I've been through a lot of projects involving this, and I can tell that combining text with images can become really tough sometimes. Here is a compilation of tips that might make it easier.

  1. Increase the contrast.
    Colour can make half of your work. Adjust colour settings in Photoshop for more contrast and less brightness with light text and do the opposite if you’re using dark text. Other settings like Colour balance or Curves can be useful as well. Feel free to experiment.

  2. Cover the image with a transparent overlay.
    Instead of editing the image contrast directly, you can put a transparent layer upon your photo to achieve a similar result. Adjust transparency along with text colour. It can just be darker or you can use a particular colour for overlay and use any complementary colour for your text for a better result.

  3. In fact, the overlay doesn't really have to be transparent.
    If you want to keep your photo in original condition without adding any colour adjustments use an overlay directly for the piece of text. It wouldn’t affect your photo and increases the contrast of text.

  4. Let your text work with an image.
    This is a bit tricky way to fix the readability of the text. But then it gives a great result and the users will remember it, without a doubt.

  5. Add some blur.
    Decreasing the detail level of the photo will help attract user’s attention to the text. This is a great solution if your content is more important than the image.

  6. Use less “noisy” photos. Choose better position of the text.
    Avoid complicated images with a lot of patterns, details, different colours etc. According to the layout of your photo, you can find a better position for the content.

Of course, there's no magic bullet to cover all cases. Feel free to experiment and train your eye. But don't forget that using too many tricks in one time will not make your design better. Be persistent and you will find the right one.