How to Design a Blog Theme People Can Actually Read

Most blog themes are designed to look good in a screenshot. Reading is a different test, and a much harder one: it happens for ten minutes, often on a phone, often at night, by someone who will leave the moment it becomes work. Almost everything that decides whether they finish comes down to four decisions, and none of them is the typeface.

Measure is the decision that matters most

Line length, or measure, is the width of a line of text. Too long and the eye loses its place returning to the next line; too short and the rhythm breaks every few words. The usable range is roughly 60 to 75 characters, and full-width text on a desktop monitor can reach 150, which is why so many otherwise attractive blogs are exhausting to read.

Constrain the text column, not the page. A content column around 65 characters with the layout breathing around it is the single highest-value change most themes could make.

Size and spacing

Body text wants to be larger than most designers instinctively set it. On a blog, 18 to 20 pixels is a comfortable range, with line height around 1.5. Then give the vertical rhythm room:

• Paragraph spacing should be clearly larger than line spacing, so paragraphs read as blocks rather than a wall.
• Headings need space above, not below. A heading belongs to the section it introduces, and spacing should say so.
• Lists and quotes need breathing room on both sides, or they read as interruptions rather than structure.

Contrast, and the grey-text mistake

Light grey body text on white looks refined in a mockup and fails for a substantial number of readers. Body text should meet at least 4.5:1 against its background, and this is a correctness requirement rather than a preference: below it, people with ordinary age-related vision changes simply cannot read comfortably.

The related trap is using colour as the only signal. If links are distinguished from body text by hue alone, readers with colour vision deficiency cannot see them. Keep an underline, or a weight change, so the signal survives without colour.

Dark mode is not an inverted stylesheet

Inverting a light theme produces two specific problems. Pure white on pure black causes halation, where text appears to smear for many readers, so use an off-white on a dark grey rather than maximum contrast. And font weights look heavier on dark backgrounds, so a weight that read as regular in light mode reads as semibold in dark; dropping a step usually fixes it.

Respect the system preference rather than forcing a choice, and if you offer a toggle, remember it.

Every decision in a reading theme is answering one question: does this make the next sentence easier to reach?

What to leave out

Restraint does more for readability than any addition. The usual candidates for removal are the sticky header that eats a fifth of a phone screen, the newsletter modal that fires before anyone has read a paragraph, the social buttons nobody clicks, related-post grids stacked three deep before the comments, and animation on scroll that delays the text arriving. Each is defensible alone, and together they are why readers bounce.

Performance is a design decision too: a theme that loads four font weights it never uses is a slower theme, and speed is part of whether someone reads you. Our piece on web typography for blogs goes deeper on the type side.

Themes as a system, not a skin

The practical way to keep all of this consistent is to separate layout (structure: where things sit, how wide the measure is) from palette (colour and tone). Change one without disturbing the other, and a redesign stops being a rewrite.

That separation is how Inkwell handles theming, with layouts and colour presets chosen independently, so a site can change its look without touching structure. You can see the range on the themes page, and the wider platform comparison is in self-hosted blogging platforms.

• #Design
• #Typography
• #Themes
• #Guides