When you visit a website that feels polished and easy to read, part of what you are responding to is good typography. The choice of font, the size of headings, the gap between lines of text — all of these decisions combine to create a reading experience that either keeps people engaged or pushes them away.
Most small business website owners do not think about typography until something feels wrong — a font that looks childish, text that is too small to read on a phone, or a heading that clashes with the body copy beneath it. Understanding a few basic principles prevents all of these problems.
What Is a Font, and What Is a Typeface?
You will hear these terms used interchangeably, though they technically mean different things. A typeface is the overall design of a set of letters — Helvetica, Times New Roman, and Arial are all typefaces. A font is a specific version of that typeface — Helvetica Bold, Helvetica Light, and Helvetica Italic are all different fonts within the Helvetica typeface.
For practical purposes when building a website, you will usually choose a typeface and then decide which weights (bold, regular, light) you want to load.
The Two Main Categories of Fonts
Fonts fall into several categories, but the two you need to understand for a business website are:
- Serif fonts have small finishing strokes at the ends of letters — the little feet on the bottom of a capital T, for example. Georgia, Times New Roman, and Garamond are serif fonts. They tend to feel traditional, authoritative, and trustworthy. Many law firms, accountants, and heritage brands use them.
- Sans-serif fonts have clean, unadorned letterforms with no finishing strokes. Inter, Lato, Arial, and Helvetica are sans-serif fonts. They tend to feel modern, clean, and approachable. Most technology companies, startups, and contemporary service businesses use them.
A very common and effective combination is a serif font for headings paired with a sans-serif font for body text — or vice versa. The contrast between the two creates visual interest while maintaining readability.
How Many Fonts Should a Website Use?
Two. Occasionally three — but almost never more than that.
Using too many different fonts is one of the most common signs of an amateurishly designed website. Each additional font you add introduces visual noise and makes it harder for the eye to know where to focus. Professional designers often spend considerable time choosing just two fonts that work well together, then apply them consistently throughout the site.
The typical setup is one font for headings (which creates personality and draws attention) and one font for body text (which prioritises readability above all else).
How Big Should the Text Be?
A common mistake on small business websites is body text that is too small. Older websites were often built when screens were lower resolution and text was rendered differently — a size that looked acceptable in 2010 can feel uncomfortably small on a modern high-resolution phone screen.
As a practical rule: body text should be no smaller than 16 pixels, and 17 or 18 pixels is often more comfortable for reading paragraphs. Heading sizes depend on the hierarchy you want — a main page heading (H1) might be 36–48 pixels, section headings (H2) around 24–30 pixels, and so on downwards.
Line height — the vertical space between lines of text — matters as much as size. A line height of around 1.5 to 1.6 times the font size is generally comfortable for reading paragraphs. Cramped lines (line height of 1.0 or 1.1) are noticeably harder to read, and visitors will leave paragraphs unfinished.
Where to Find Free Fonts for Your Website
You do not need to pay for fonts. Google Fonts is a free library of hundreds of professional-quality typefaces that you can use on any website. Popular choices include:
- Inter — a modern, clean sans-serif widely used by technology companies and SaaS products. Excellent for body text.
- Lato — a friendly, readable sans-serif that works well for small businesses wanting an approachable feel.
- Playfair Display — an elegant serif with strong personality, suited to premium brands and headings.
- Merriweather — a readable serif designed specifically for screens, good for body text if you want a traditional feel.
- Raleway — a geometric sans-serif with thin, modern letterforms, often used for creative businesses and agencies.
Most website builders — Squarespace, Wix, WordPress — let you choose from Google Fonts in their settings panel with a simple dropdown menu. No technical knowledge is required.
Does Font Choice Affect Google Rankings?
Not directly — Google does not rank websites based on which typeface they use. However, typography affects two things that Google does care about: readability and time on page. A website with small, cramped, hard-to-read text will cause visitors to leave quickly. A high bounce rate (people leaving after viewing just one page) and short time on site are signals that can indirectly affect how Google perceives the quality of your pages.
Font choice also affects page speed if you load too many different fonts or too many font weights. Each font you load requires an additional request to a font server, which adds a small delay. Loading two fonts with two weights each (regular and bold) is reasonable. Loading five fonts with five weights each will noticeably slow your page.