Christian Bloggers

Equip, Encounter, Encourage

How To Create Must Read Photo Badges That Stand Out

How to Create Must Read Photo Badges That Stand Out - Christian Bloggers

I’ve pushed photo badges quite heavily in this series on images, and I believe there are some good reasons and they seem to be becoming more popular. Although I looked last time at editing your images, creating a photo badge creates a few more specific challenges. First, making sure that your text stands your on the photo…and second, how to add text to your photos.

So in this post we’re going to tackle those two challenges so you can make attractive and easy to read photo badges or alternative quotes or questions to use on social media platforms. With that in mind let’s dig in.

[featured-image single-newwindow=”false”]

Write Text that Must be Read

If your text is easy to read but doesn’t strike a chord with the reader then it might as well be unreadable. If you place your headline on it then make sure it’s irresistible to read, if you use a quote then make sure it’s clear, concise and one that people want to share. If you put a course of action then make sure every step is clear. What you actually put on the photo badge is as, if not more, important than how well designed it is (extremely bad design or extremely bad text won’t be saved by the opposite number being great).
Overall though, I’d rather have good text with a poor design than a great design with poor text. If you can’t think of good text to add…just use the image.

Don’t Use Busy Images

A busy image has a lot of different things happening in the background. An example would be a crowd of people, in a photo like this there will be a lot of different colors, lines and changes in shapes. This type of images makes it difficult to set a good font that will stand out against it. There are some tricks to help but in general if you can use a less busy image, one which has a large space of a single color, then it makes it easier for the text to be read.

A busy image [Photo credit :Joncandy]

A busy image [Photo credit :Joncandy]

Don’t Use The Same Color Text As The Background

There’s a simple fact that if you have two similar colours on a page then it’s going to be hard to tell them apart. Likewise if you have bright text against a bright background, it’s going to be hard to read. Or if you have dark text on a dark background then it will be hard to read too.
If you are really in doubt then using plain white text is a good option on a dark background especially when used in combination with one or more of the tricks below. If the image is lighter then using black or grey text is better.

Use A Containment Device To Make Text Clearer

A great trick for making a background less busy is to add a block around the image. If you place a white square and then adjust the opacity to let more of the background image through it dulls the background and makes it easier to focus on the text. It also boxes the readers eyes as to where the text is. Just try to make sure that it is even around the text rather than extending further in one direction or another.

Use Drop Shadow To Make Your Text Stand Out

Drop shadows can add depth to your font, by adding drop shadows it causes they to leap from the photo more and look as though they are slightly off the page. Be careful here as modern design trends are less in favour of drop shadow. I often use a very light touch of drop shadow to help my text standout from the page.

Use An Appropriate Font

The font you use makes a big different. If it’s too difficult to read will people even bother? If it is boring and dull but the title is jokey and fun you’re giving your readers conflicting messages. Take some time to think about the fonts you want to use and check out this handy infographic for some general guidelines. Remember, if in doubt, use the same font as your blog.

Think About Your Brand

This is similar to what we looked at in the last post. You don’t have to always follow the same font formats or colors but consistency is great and by creating that familiar theme and design you help your images to reinforce the message of your post. Just like the whole of a christian’s life should back up their words, the message what you put on your site should back up what your typing said.
white CB logo top square
This is certainly in elements like the photos you choose (I once saw a guy show a picture of a scantily clad woman on a post about avoiding temptation I kid you not) but also extends to the font and colours you use. A tip I learned from Michael Hyatt is to create your “Brand guidelines” (Such as the fonts, colours, size, how you write titles, links to logos or image files and so on) put this in an easy to find place when you will need them. I personally keep them on Evernote so I can read them easily wherever I need them.

Add Your Logo

Adding your logo helps remind people you created it and provides more context to the images or text on it. It’s part of building your brand, just like Nike put the swoosh everywhere, by putting your logo (this can just be the title of your blog by the way, it doesn’t have to be a clever graphic and many great companies logos are just text)  on what you’ve made you are “prodding” people who see it. Giving them a gentle reminder of who you are which can build up over time.

Position Your Text Correctly

The location you position your text is important, if it’s on a busy part of the image, or a significant section then it will remove the effect of the image or reduce readability. But there is another factor that you really need to consider, making your images and font symmetrical and line up. I’ll be honest, I don’t always think about this or spot this but it separates amazing from average photo badges. Identify reference points and lines within the photo and use these to help guide where you put your text in the image.

Use A Simple Program Or App

I’ve already covered a few apps for editing image but I want to look very quickly at a few very specific apps that will help you add good text to your images.

PicMonkey

PicMonkey is a chrome app that one of our Google plus members (Brandi Eissinger) mentioned. It’s a basic editing app that also adds the ability to add text. As it runs on Chrome you can use it on pretty much any computer.

Phonto

Phonto is a simple Android and iOS app. You can add in images, text, and also purchase extra filters and image packs to use in images.

Over

Over is an iOS only app but has some really nice features and simple to use program. It allows you to upload your photos and then add either a text or icon fr0m a set list. The text options really stands out as it comes with amazing stock fonts that are really easy to place and adapt in your images.

Gimp

The last application is one I’ve mentioned before. Gimp is an open source application that you can download on any computer and it is full featured so you can add text as well as hundreds of other functions.

There you have it, a few simple tools and tips to make some great looking photo badges that will attract more people to your site. A little task for you, take a look at the feature image at the top. What elements of my advice have I used in it’s design? Do you think it works well? Can you think of a better design?

Do you have any Photo Badge design tips or tricks?

[Photo Credit: pinprick via Compfight cc]

About Chris Wilson

I'm a 27 English as a foreign language Teacher based in Badajoz in Spain. I also run the Christian Bloggers community and enjoy writing in my free time.

Loading Facebook Comments ...

One Reply

  1. Mark Hanson

    Some good tips there, Chris. It is also important not to overload the text (some of my earlier works have been too busy in the text, varying colour, size, font etc. causing the final result to appear disjointed). It is good to have some contrast in the text to make key words stand out a touch more, but if it is overdone it looks pretty awful.

    Also don’t always seek to be symmetrical. Aligning text to the left or right can work much better than a centre alignment in some cases, depending largely on the photograph you use as a background.

    Otherwise you have covered the basics pretty well my brother!

Leave a Reply