Best Practices for Caption Text for Images

Question

Website in question is a long form content focused and will include inline images as per user input when they create their blog/ content entries hence number of images in post is not controllable.

Need to decide the suitable typeface size (as a percentage of other blog body text say 70%/60%/50% of main text if it is say 14px) for image caption. Also need to determine if italics works better than regular text for image captions.

Research is providing contradictory information with some sites suggesting to use italics sparingly, other research suggesting no impact on readability on using italics. See italics being used widely across many content heavy websites and news sites for image captions.

Thanks.

Answer 1

More important than typeface, size and style is the use of whitespace. You need to make sure that your readers knows that this text belongs to the image as a caption. You could try with 2em between the image, it's narrow caption and the surrounding text, and see if the effect of the caption belongs to the image or not.

From what I've seen, captions are usually 80% (0.8em) of the body text size. But when you size down text, the harder it is for users to read. And that's an impact on readability. Having a second style change with italic would be to overdo the effect you're after. Either make the size smaller OR make the text italic.

The meaning of italic is often to emphasize the word or phrase. When you make the size of the text smaller, you send the message that this text is less important. Decide what message you're sending, before making style or size change.

Answer 2

I would eyeball it. Maybe start around 75-80% of the body font size. How small you can go depends on the font. Note that you should honor the users' font size browser settings, hence don't assume all users will be viewing the same size font that you are seeing.

I would not use italics for captions (reserve italics for what they're traditionally used for), but consider using a different typeface. If you're using a serif font for the body text, maybe use a font that works well at small sizes for captions (e.g. Verdana). If you use a different font for captions, use your judgement regarding sizing - one caption font might look right at 60%, another might work at 100%.

And as Benny said use of whitespace is critical. This is the realm of typography, which is more of an art than a science, that's probably why you won't find much modern research on the subject. It's a collection of rules-of-thumb honed over hundreds of years of craft.

Answer 3

John Caples—legendary adman—said that headline determines if the ad will even be read. But if the ad contains images, readers are often attracted to the captions of those images first. That means image captions are extremely important content—more than the headline in some research. He talks about the psychology of this stating that when we are in elementary school we learn to look at pictures first. When a picture interests us we read the caption.

With that said, image captions are super important and should not be reduced in size, thus importance. In fact, you should do the opposite. Make them stand out. Use highlights, italicize if the captions are critical, or use an alternative font that makes them stand out. But do not subordinate them.