Blog Post

Articles
2 MIN READ

7 Ways to Overlay Text on Photos (With Video!)

NicoleLegault1's avatar
NicoleLegault1
Community Member
10 years ago

Say you want to use fun and colorful background images in your e-learning, but you’re concerned about keeping your text legible. Well, I’m here to help with a list of seven easy techniques to help you do just that.

1. Choose Contrasting Colors

The first thing you want to consider is using a font that’s a contrasting color from the image. Obviously using a dark font on top of a dark image, or vice versa, will make it more difficult for people to read the text. Choose a font color that contrasts well with the image.

2. Use Empty Spaces for Text

This also seems obvious, but bears repeating: use images with large chunks of solid color or empty space, because those are great places to drop in your text.

3. Lighten Your Image

A great way to make your text pop is to adjust the transparency of your image to make it lighter and appear more faded. This makes your text pop so learners can read it more easily.

4. Darken Your Image

If you don’t want to go lighter, another option is to go darker. One way I do this is to add a rectangle shape on top of my entire slide, and then adjust the color and transparency. When you do this, you can use a bright, white font and it will be very legible.

5. Use a Gradient Overlay

Similar to the tip above, I can add a rectangle shape over the background of my slide; but this time, I use a gradient effect and set the transparency of half of the image to 100%. This allows part of the text to pop over the darker part of the gradient, but still allows the rest of the image to be visible.

6. Insert a Shape

Another trick that I use all the time is to to place a shape behind my text. Often I will adjust the transparency on my shape to allow a bit of the image to show through, so you still get the essence and feel for the image.

7. Add a Text Drop Shadow

Finally, adding a drop shadow or a stroke or outline to your text can also really help to make it pop against a busy background.

The next time you’re designing a course, try these tips to make your text easy for learners to read. Want to see how you can apply these tips directly in Articulate Storyline? Check out this video tutorial I created.

Do you have any tips of your own that I missed? Feel free to leave them in the comments—we love to hear your feedback. And follow us on Twitter for more e-learning tips, tricks, and advice!

Want to try something you learned here, but don't have Articulate software? Download a free trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any comments, please share them below.

Published 10 years ago
Version 1.0