This guide is for the blogger whose writing is good but whose pages look like a wall: the expert who writes 2,000-word posts in long paragraphs, the business owner whose theme uses pale grey text on white, the new blogger unsure whether to use headings every 200 words or every 800. Formatting decides whether a reader on a phone stays long enough to discover the writing is good. Most of it comes down to a handful of decisions, and two of them have clear published guidance behind them.
Start with how people read online
Readers rarely start at the top and read every word. They scan headings, read the first lines of paragraphs, look at lists and tables, and decide whether to commit. Good formatting supports both groups: the scanner who wants one answer and the reader who wants the whole argument.
The US government’s plain language guidance recommends organising information so readers know what to expect, summarising long documents up front, and using lists and tables where they help. Those habits suit blogs as much as government pages.
Headings: a map of the page
Write headings that say something
“Introduction”, “Overview” and “Conclusion” tell a scanner nothing. “Why your sourdough is flat” or “What to pack for a three-day trip” tells them whether to stop or scroll.
Use heading levels in order
One h1 (the post title), then h2s for main sections and h3s for subsections. Do not choose a heading level because of its size; restyle it instead. Screen reader users often navigate by heading level, so a logical order matters.
Space them sensibly
There is no fixed rule, but a heading every few paragraphs gives scanners regular landmarks. If a section runs for more than a screen on a phone with no heading, consider splitting it.
Paragraphs: shorter than you think
Digital.gov’s clear and short guidance cites writing experts who recommend paragraphs of no more than 150 words, in three to eight sentences, and never longer than 250 words. It also says an occasional one-sentence paragraph is fine and that varying paragraph length keeps writing from feeling choppy.
On a phone, 150 words can fill the screen. Many bloggers aim lower for that reason. Each paragraph should cover one idea, ideally opening with a sentence that states it.
Lists, tables and other scannable elements
Bulleted lists
Use them for items without a set order: features, ingredients, options. Keep items parallel in form, so they all start with a verb or all start with a noun.
Numbered lists
Use them for steps or ranked items. If the order matters, number it.
Tables
Tables are not only for numbers. A comparison of three options against four criteria is easier to read as a table than as three paragraphs. Keep them narrow enough to work on mobile, or check that your theme makes them scroll sideways.
Pull quotes and callouts
A single highlighted sentence can break up a long section and catch a scanner’s eye. Use one or two per post, and make sure the sentence is worth repeating.
Format for the reader who will give your post ten seconds before deciding whether to give it ten minutes.
Text contrast: the rule with a number
Pale grey text on white looks elegant in a design mockup and is hard to read in daylight on a phone. The Web Content Accessibility Guidelines set a clear minimum. WCAG success criterion 1.4.3 requires a contrast ratio of at least 4.5:1 between normal text and its background, and 3:1 for large text. The W3C’s explanation defines large text as at least 18 point, or 14 point bold, roughly 24px and 18.5px in CSS.
The same page explains why the 4.5:1 figure was chosen: it compensates for the loss of contrast sensitivity typical of people with vision around 20/40, which it describes as commonly reported for people at roughly age 80. Good contrast is not a niche concern; it helps anyone reading in bright light or on a dim screen.
| Text | Minimum contrast (WCAG AA) | Typical blog use |
|---|---|---|
| Normal body text | 4.5:1 | Paragraphs, lists, captions |
| Large text (18pt+, or 14pt+ bold) | 3:1 | Headings, large pull quotes |
| Logos and purely decorative text | No requirement | Brand marks, background patterns |
How to check
Free contrast checker tools let you enter two colours and see the ratio. Check body text, link colour, captions and any text over images. Text placed over photos is a frequent failure, because the background changes from one part of the image to another.
Links that look like links
Make links visibly different from body text, usually by colour plus underline. Write link text that describes the destination: “our guide to alt text” rather than “click here”. Readers scanning a page often read link text on its own.
Images and white space
Images
Place images next to the text they relate to. Add alt text, and keep file sizes small enough to load quickly on mobile data.
White space
Line spacing of roughly 1.5 times the font size and a comfortable line length make body text easier to follow. Very wide text columns on desktop are tiring; many themes limit them for that reason.
Font size and type
Body text that looks fine on a large monitor can be tiny on a phone. Many readable blogs use a body size of around 16 to 20 pixels. Choose a typeface designed for screens, and avoid very thin weights for body text; the WCAG contrast guidance notes that thin or unusual fonts can render fainter than their specified colour.
Common formatting mistakes
Bold everywhere
When half a paragraph is bold, nothing stands out. Reserve bold for a few key terms or the first words of list items.
Headings used as decoration
A heading over every second paragraph fragments the argument as much as no headings at all. Each heading should introduce a section a reader might want to jump to.
Centred body text
Centred text is hard to read beyond a line or two, because the eye has to find a new starting point on every line. Keep body text left-aligned.
Walls of links in the introduction
Several links in the first paragraph pull readers away before they have started. Place links at the point of need.
Ignoring the mobile view
Most formatting problems only show up on a small screen: tables that overflow, images that push text far down, ads that split paragraphs. Preview every post on a phone before publishing.
A formatting pass before publishing
1. Read only the headings. Do they tell the story of the post?
2. Scroll on a phone. Is any stretch longer than a screen without a break?
3. Check every list for parallel wording.
4. Run your main text, link and caption colours through a contrast checker.
5. Read link text out of context. Does each make sense alone?
6. Confirm images sit beside their related text and have alt text.
Readable formatting checklist
- Descriptive h2 and h3 headings in logical order
- Paragraphs mostly under about 150 words, one idea each
- Bulleted lists for options, numbered lists for steps
- At least one table or checklist where comparison helps
- Body text contrast at least 4.5:1; large text at least 3:1
- Links visibly distinct with descriptive link text
- Body text around 16px or larger, with comfortable line spacing
- Images next to related text, with alt text
Takeaway
Readable formatting lets a scanner find their answer and a careful reader stay comfortable. Use headings that say something, short paragraphs, lists and tables where they help, and text that meets the WCAG 4.5:1 contrast minimum. Then check the result on a phone, because that is where most of your readers will see it.
