Typography Decides Whether Visitors Read or Leave
Your font choice controls whether a potential client reads your service explanation or closes the tab. A broker we work with had a site built on a template with 14-pixel body text and a decorative script font for headings. Bounce rate sat above 70%. After switching to a 16-pixel sans-serif body with clear hierarchy, session duration increased and enquiries followed. The content didn't change. The readability did.
Font size, line spacing, and contrast aren't aesthetic preferences. They're functional decisions that affect comprehension and trust. When a visitor can't easily scan your page, they assume the service will be just as hard to navigate.
Why Font Size and Line Height Matter More Than Style
Body text below 16 pixels forces visitors to lean in or zoom. Line height below 1.5 makes paragraphs feel cramped and hard to follow. Most broker sites we audit use 14-pixel text with 1.3 line height because that's what the theme defaulted to years ago.
Consider a broker offering refinance advice to time-poor clients. If the paragraph explaining offset accounts is set in 13-pixel text with tight spacing, the visitor skims, misses the benefit, and moves on. Increase that to 17 pixels with 1.6 line height, and the same paragraph becomes easy to absorb. The advice is identical. The delivery makes it usable.
Line length also affects readability. Paragraphs that stretch across a wide desktop monitor tire the eye. Limiting content width to around 70 characters per line keeps reading comfortable. Most mortgage broker websites we build use a maximum content width of 750 pixels for body text, even on large screens.
Not sure how your website compares?
Get a free Website Report and find out in seconds where you can improve
Contrast Ratios and How They Affect Trust
Light grey text on white backgrounds looks modern until someone over 40 tries to read it. Contrast ratio between text and background should meet WCAG AA standards, which means a ratio of at least 4.5:1 for body text. A ratio below that threshold doesn't just exclude older visitors. It signals carelessness.
We recently worked with a broker whose site used #777777 grey on white. It passed a quick glance test but failed under office lighting or outdoor glare. Switching to #333333 improved readability without changing the design. Enquiries from visitors aged 50 and above increased within weeks. The fix took ten minutes.
Contrast also applies to link colour. If your links are only distinguished by a subtle shade difference, visitors won't recognise them as clickable. Underlines or a bold colour shift make links obvious and improve navigation. This ties directly into your call to action strategy because unclear links mean missed conversions.
Heading Hierarchy and Scanning Behaviour
Visitors don't read websites the way they read books. They scan headings first, decide if the page is relevant, then read selectively. If your headings are only slightly larger or bolder than body text, that scanning process breaks down.
Headings should have clear visual separation. H2 headings might be 24 pixels, H3 at 20 pixels, with adequate spacing above and below. Font weight should differ from body text. If a visitor can't instantly distinguish a heading from a paragraph, your content structure is invisible to them.
A broker site we built for a client in Sydney used uniform font sizes across headings and body text because the previous designer wanted a minimal look. Visitors couldn't tell where one topic ended and another began. After introducing clear hierarchy, time on page improved and the contact form saw more completions. The words didn't change. The structure became visible.
Font Pairing and Professional Perception
Using more than two font families on a site usually creates visual noise. One font for headings, one for body text. Both should be easy to read and load quickly. Google Fonts like Inter, Open Sans, or Lora work well because they're optimised for screen reading and don't slow your site down.
Decorative fonts belong in logos, not paragraphs. Script fonts and condensed typefaces reduce readability and make your content harder to scan. If a font choice makes a visitor pause to decipher a word, it's the wrong choice. Website design should remove friction, not add it.
Font loading also matters for performance. Web fonts should be subset to include only the characters you need, and font files should be preloaded to avoid layout shifts. A site that jumps around while fonts load feels unfinished. Visitors notice.
Mobile Typography and Touch Target Sizing
Mobile screens demand larger touch targets and more breathing room. Body text should be at least 16 pixels on mobile, and buttons or links need enough padding that a finger tap doesn't miss. If your mobile font size shrinks below 14 pixels, visitors will pinch to zoom, and most won't bother.
Line height becomes even more important on mobile because paragraphs are narrower. Tight spacing makes text feel dense and hard to parse. A paragraph that reads comfortably on desktop can become a wall of text on a phone if line height isn't adjusted.
We regularly see broker sites where the desktop version is readable but the mobile experience is cramped. Given that most visitors now browse on mobile, this is where conversions are lost. Fixing mobile typography is part of improving your ranking on Google because user experience affects search performance.
Readability Tools and How to Test Your Site
Browser tools like WAVE or the Lighthouse accessibility audit in Chrome DevTools will flag contrast issues and text size problems. Run your site through these tools and fix anything marked as a failure. These aren't optional tweaks. They're foundational.
You can also test readability manually by stepping back from your screen or viewing your site on a phone in direct sunlight. If you have to squint or zoom, so will your visitors. Ask someone unfamiliar with your site to find a specific piece of information. If they struggle, your typography or layout is working against them.
Readability also ties into your website content strategy. Well-written advice is only useful if people can actually read it. Poor typography wastes good content.
How Typography Affects Conversion Rates
A readable site keeps visitors engaged long enough to understand your service and take action. If your contact form sits below three paragraphs of cramped, low-contrast text, fewer people will reach it. If your call-to-action button uses a thin font at 14 pixels, it won't stand out.
Buttons should use a font size of at least 16 pixels with enough padding to make them obviously clickable. Button text should be short and direct. Avoid vague phrases like "Learn More" in favour of "Get a Free Assessment" or "Book a Call". Clarity converts.
Typography also affects perceived professionalism. A site with inconsistent font sizes, poor spacing, and weak contrast suggests a lack of attention to detail. Visitors wonder if that carelessness extends to your service. A clean, readable site signals competence before a single word is read.
Call one of our team or book an appointment at a time that works for you. We'll review your current site, identify readability issues, and show you what a well-structured broker site should deliver.
Frequently Asked Questions
What font size should I use for body text on a broker website?
Body text should be at least 16 pixels on both desktop and mobile. Smaller sizes force visitors to zoom or strain, which increases bounce rates and reduces engagement.
How does line height affect readability on a website?
Line height below 1.5 makes paragraphs feel cramped and hard to follow. A line height of 1.5 to 1.6 improves readability and helps visitors absorb your content more easily.
What is a contrast ratio and why does it matter?
Contrast ratio measures the difference between text colour and background colour. A ratio of at least 4.5:1 ensures text is readable for all visitors, including those with vision impairments or viewing in poor lighting.
Should I use decorative fonts on my broker website?
Decorative fonts reduce readability and slow comprehension. Stick to clean, legible fonts like Inter or Open Sans for body text and use only one or two font families across your site.
How can I test if my website typography is readable?
Use browser tools like WAVE or Chrome Lighthouse to check contrast and text size. Also test your site on a mobile device in sunlight and ask someone unfamiliar with your site to find specific information.