DesignFor brands

Typography for content

Setting type that reads at feed size: one display face, one body, a clear hierarchy, sensible spacing, and when text-on-image beats a caption.

Adam Murray4 September 20268 min read
On this page

Your post has good words on it, and it still looks amateur. You have tried a few fonts, maybe a fancy script for the headline and something clean underneath, and the result feels either fussy or flat. Type is where a lot of non-designers lose the plot, because there are thousands of typefaces and no obvious rule for choosing between them. There is a rule. It is just not the one most people reach for.

Typography is not about finding a beautiful font. It is about setting words so they are effortless to read at the size and speed your audience actually meets them (which, on a feed, is small and fast). Almost every typographic mistake comes from optimising for how the type looks parked in a design tool at full size, rather than how it works as a thumbnail on a phone in someone's hand. This guide is the type half of the design principles; hierarchy and contrast run all the way through it.

Legibility at feed size comes first

The first question is not "is this font nice" but "can I read it at a glance on a phone". Those are different tests, and a font can pass the first and fail the second badly. Thin weights vanish. Tight letter-spacing clogs up. Ornate scripts turn into a squiggle. Anything low-contrast against its background disappears, however elegant it looked at full size.

So test the way your audience sees it. Shrink the post to thumbnail size on your own screen, or hold your phone at arm's length, and read it cold. If you hesitate, the type has failed, and no one on a moving feed will give it the second look you just did. Favour heavier weights over light ones for anything that has to carry across a small frame, keep letter-spacing normal or slightly open rather than cramped, and make sure the type sits on enough contrast to separate cleanly from what is behind it. The mechanics of that are in colour and contrast for content.

One display, one body: the whole system

Here is the rule that replaces agonising over fonts. Pick two typefaces and no more: one display face for the thing that has to grab attention, and one body face for everything that has to be read calmly. That is a complete system for almost any brand.

The display face is your headline, your hook, the four words on the thumbnail. It can have personality (a strong weight, a distinctive shape) because it only ever appears in short bursts at large sizes, where character reads as confidence. The body face is the caption, the supporting line, the small print. Its whole job is to disappear into readability, so choose something plain and well-drawn and let it be quiet. A dependable pairing is a characterful display face over a clean, neutral body face; the contrast between them does the work.

Two is the ceiling for a reason. A third typeface almost never adds meaning: it adds noise, and it breaks the consistency that makes a run of posts recognisable. If you need more variety, get it from the two faces you have: change the weight, the size, the case, the colour. A single family with a bold and a regular weight can express an entire hierarchy on its own.

Build a hierarchy you can see

Type is the main way you show what matters most, and a good hierarchy is obvious the instant someone looks. There should be a clear jump in size and weight between your headline and your body: not a nudge, a jump. When the headline is only slightly bigger than the caption, the eye cannot tell which to read first, and the whole thing reads as flat.

Think in three levels at most: the one thing seen first, the supporting line, and the small detail. Give each level a distinct treatment and reuse those treatments everywhere, so a viewer learns your system after a couple of posts. The commonest failure is timidity: making the headline "a bit bigger" instead of much bigger. On a feed, the headline should be large enough to feel almost too large in your editor. That is usually about right on the phone.

Sizing, line length and line height

Three settings decide whether a block of text is comfortable, and they are easy to get right once you know what to aim for.

Size follows from distance and importance, and the honest test is the phone, not the canvas. Set it, shrink it, read it. If it makes you squint, it is too small, and on social that is almost always the direction the error runs.

Line length is how many words sit on a line before it wraps. Very long lines are tiring because the eye loses its place returning to the left; very short ones chop the reading into stutters. For anything more than a line or two, aim for something in the region of a comfortable book column rather than a full-width banner of tiny text. If a caption runs the entire width of a wide graphic in one thin line, break it or narrow the column.

Line height is the space between lines. Set too tight, lines collide and the block turns into a grey mass; set too loose, the lines stop feeling like one paragraph. A little more than the natural single spacing usually reads best for body text. Headlines in large type can sit tighter, because there is already plenty of room between the big letters.

Pairing typefaces without a designer's eye

If two faces make you nervous, use the safest trick there is: do not pair two families at all. Take one good family that ships with several weights and set your whole hierarchy in it: heavy for the headline, regular for the body, light for the aside. It is impossible to clash with yourself, and the result looks intentional every time.

When you do pair two families, pair on contrast, not similarity. Two faces that are almost alike look like a mistake, as if you meant to use one and slipped. Two that are clearly different (a strong display face against a plain body face) read as a deliberate choice. The pairing you want is one face with personality and one that stays out of the way, never two personalities competing. And once a pairing works, freeze it and reuse it. That repetition is what turns a set of posts into a recognisable brand, the same discipline as the rest of your layout and composition.

When text-on-image beats a caption

Not every word belongs burned onto the picture. Deciding what goes on the graphic and what goes in the caption is a typographic choice, and getting it wrong either buries your point or clutters your image.

Put text on the image when it has to be understood before anyone reads a word of caption, or on a surface where the caption is hidden until tapped. The hook on a thumbnail, the one line that makes someone stop, the label a muted autoplaying video needs to make sense without sound. These have to be on the picture, because the caption arrives too late or not at all. Keep that on-image text brutally short; a graphic is not a paragraph, and the fewer words it carries the larger and more legible each one can be. What actually goes on there is its own craft, covered in writing copy that works on a graphic.

Leave text in the caption when it is context, detail or a call to action that supports the image rather than competing with it: the story behind the shot, the where-and-when, the link. Loading all of that onto the picture shrinks the type until nothing reads and hides the image behind words. The strong division is a few large, legible words on the graphic and everything else in the caption below it.

Do this today

Open your current post and count the typefaces on it. If there are more than two, cut back to one display and one body (or to a single family in two weights) and set them again. Then shrink the post to thumbnail size and read the headline cold. If you hesitate, make it bigger and heavier until you do not. Wherever you build the asset, whether that is Canva, Figma or Studio, the settings are the same: two faces, a real jump in the hierarchy, and type large enough to survive the feed.

Written by
Adam Murray
Founder, Acumin

Adam builds Acumin. He spends his days on the same two problems this library is about: working out what a piece of content is actually worth, and getting a brief through production without it turning into something else.

Want this done on your own channel?

Acumin reads your public content and your category and hands back what to make next. Every call comes with its confidence and the evidence it rests on. The first Snapshot is free.