Is your website text too small? How to fix readability problems
Hand your phone to a parent or an older customer, open your website, and watch. If they hold the screen closer, pinch to zoom, or tilt it towards a window, your site has a website readability problem. These issues rarely show up in the office, where staff know the content and use large monitors. They show up with real customers on real phones, often outdoors. This article helps you diagnose what is making text hard to read, fix each cause and confirm the improvement with quick tests.
Symptoms that point to readability trouble
Before changing anything, look for evidence. Common signs include:
- Customers calling or messaging to ask for information that is clearly written on the site.
- Complaints that prices, delivery charges or terms were “hidden”, even though they were present in small print.
- High bounce rates or short engagement time on text-heavy pages in GA4, particularly from mobile visitors.
- Lighthouse accessibility audits flagging insufficient colour contrast.
- Staff zooming in when demonstrating the site to customers.
None of these proves a readability issue alone, but two or three together are a strong hint.
Diagnosis 1: text that is simply too small
Open your key pages on a mid-range Android phone and read everything, including the footer. Note any text you have to strain to read. Frequent offenders are:
- Captions under photos and product images.
- Prices “per unit” or “plus GST” notes beside a larger price.
- Form hints and error messages.
- Footer contact details and legal links.
- Text inside banner images, which shrinks with the image on phones.
The fix
Raise paragraph text to at least 16px, and keep anything a customer needs in order to make a decision at body size too. Supporting text can be slightly smaller, but avoid going below about 13px. Take text out of banner images and place it as real HTML text over or beside the image, so it stays readable and adapts to screen size.
Diagnosis 2: pale grey and low-contrast text
Light grey text on white looks elegant in a design mock-up on a bright monitor. On a phone in sunlight, it nearly disappears. This is one of the most common readability failures on modern websites.
Use a free contrast checker, or run Lighthouse in Chrome DevTools, which lists elements with insufficient contrast. The WCAG AA standard requires a ratio of at least 4.5:1 for normal text and 3:1 for large text.
The fix
Darken the text colour rather than making it bolder. For secondary text, a mid-to-dark grey usually passes on a white background while still looking softer than main text. Watch for other low-contrast combinations too: white text on light photos, coloured text on coloured section backgrounds, and placeholder text in form fields used as the only label.
Diagnosis 3: lines that run too long
On a wide laptop or desktop monitor, a paragraph stretched across the full screen can reach 150 characters or more per line. Readers lose their place when jumping back to the start of the next line, and they start skimming or give up.
The fix
Limit the width of text containers so lines hold roughly 50 to 75 characters. Developers can set a maximum width on paragraphs, often expressed in the ch unit, which is based on the width of a character in the current font. Images and background colours can still run full width while the text column stays comfortable.
Diagnosis 4: cramped lines and dense blocks
Text with tight line spacing and no breaks feels heavy even at a decent size. Service pages copied from brochures, terms and conditions, and product descriptions pasted from suppliers are frequent examples.
The fix
- Set line height for body text to around 1.5.
- Split paragraphs longer than four or five sentences.
- Add descriptive subheadings every few paragraphs so people can scan.
- Turn lists of features, documents required or steps into bullet or numbered lists.
- Leave clear space between paragraphs.
Diagnosis 5: fonts and styling that fight the reader
Thin font weights, all-capital paragraphs, italic blocks, justified text with uneven gaps, and decorative typefaces used for body copy all slow reading down. So does centred alignment for anything longer than two or three lines.
The fix
Use a regular weight (usually 400) of a clear typeface for paragraphs, left-aligned. Keep capitals for short labels and italics for occasional emphasis. If your theme uses a light 300 weight for body text, switching to 400 is often the single fastest improvement available.
Fixing website readability in the right order
If you are short on time or budget, tackle problems in order of impact:
- Contrast failures on body text and key information.
- Small text on anything related to prices, terms, contact details and forms.
- Body text size and weight across all templates.
- Line length on desktop layouts.
- Paragraph structure and headings on your most visited pages.
Global fixes to the stylesheet, such as body size, colour and line height, improve every page at once. Content restructuring can then happen page by page, starting with whichever pages GA4 shows get the most traffic.
Quick tests with real users
Tools catch contrast and size, but people reveal the rest. These tests take minutes and cost nothing:
- The arm’s-length test: ask someone over 50 to read a product or service page on a phone held at a normal distance. Note where they zoom.
- The sunlight test: stand outside with screen brightness at medium and read your homepage and checkout or contact page.
- The find-it test: ask a friend to find the delivery charge, working hours or refund period within 30 seconds.
- The read-back test: have someone read a paragraph, then explain it in their own words. Confusion may point to dense writing rather than type size.
Repeat the same tests after your changes so you can compare honestly.
Next step: audit one page this week
Choose your highest-traffic page, run Lighthouse, do the arm’s-length and sunlight tests, and fix what you find. Then roll the stylesheet changes across the site. If your theme makes these fixes awkward, our team can help through website development, or you can contact support if we already manage your site.
Frequently asked questions
Can visitors not just zoom in if text is small?
They can, but many will not bother, and zooming on a phone often forces sideways scrolling. Relying on zoom also makes the site harder for people with low vision.
Is light grey text ever acceptable?
Grey text is fine as long as it meets contrast requirements against its background. The problem is very light grey, which fails the 4.5:1 ratio for normal text.
Does readability affect SEO?
Readability is not a direct ranking factor, but pages that people can read comfortably tend to keep visitors engaged and generate more enquiries, which is the real goal of ranking.
What free tools check text readability?
Lighthouse in Chrome DevTools and PageSpeed Insights flag contrast and some legibility issues. Free online contrast checkers test specific colour pairs, and Chrome’s device mode previews text on phone-sized screens.
We can do this for you
See what a package covers and what it costs, or ask us about your own project.

