Typography for Business Websites: What Your Font Choice Says
Why Typography Deserves More Than a Five-Second Decision
Most business owners spend five seconds picking a font, usually choosing whatever looks "professional" in their website builder's dropdown menu. But typography accounts for roughly 90% of the visual surface area of a webpage — nearly everything a visitor reads is rendered in a typeface. Typeface choice directly affects perceived trustworthiness, reading speed, and the emotional tone of your content. A study published in the journal Behaviour & Information Technology found that participants rated content set in high-quality, readable typefaces as significantly more credible than the same content set in poor typefaces. In other words, visitors judge your expertise partly by your font choice before they read a single word.
Serif vs. Sans Serif: Which One for Service Businesses?
Serif fonts (like Times New Roman, Georgia, and Merriweather) have small decorative strokes at the end of letterforms. They communicate tradition, authority, and formality — appropriate for law firms, financial advisors, and estate planning attorneys. Sans-serif fonts (like Open Sans, Lato, and Inter) lack those strokes and communicate modernity, clarity, and approachability — better for contractors, cleaning services, wellness practices, and tech-forward businesses. The distinction matters less for body text (both work well at proper sizes) than for headings, where the serif vs. sans-serif choice sets the emotional tone of the entire page. Mixing one serif heading font with one sans-serif body font — or vice versa — creates clear visual hierarchy without additional design elements.
The Readability Rules That Actually Matter
Three typography settings have an outsized impact on whether visitors read your content. First, font size: body text should never be smaller than 16px on desktop and 17px on mobile. Small text strains the eyes, especially for the 40+ demographic that makes up most service business clientele. Second, line height (the vertical space between lines of text): set it between 1.5 and 1.8 times the font size. Tight line height causes readers to lose their place between lines. Third, line length: aim for 50-75 characters per line. Lines that are too long (120+ characters) cause fatigue; lines that are too short (under 40 characters) feel choppy. A simple CSS adjustment from 100-character lines to 70-character lines can improve reading completion rates by 20% or more.
Font Licensing: The Hidden Legal Trap
Google Fonts are free and safe for commercial use. But many beautiful typefaces found on sites like Adobe Fonts, MyFonts, or Fontspring require a paid license for use on a commercial website. Using a licensed font without purchasing the correct license exposes your business to legal liability — type foundries actively scan commercial websites for unlicensed usage and send demand letters for thousands of dollars in back-licensing fees. Always check the license terms before using any typeface on your business website. When in doubt, stick with Google Fonts or use the fonts included in your website platform's licensing agreement. The cost of a proper font license ($50-$400 per year) is worth avoiding the legal headache.
System Fonts vs. Custom Web Fonts: The Performance Trade-Off
Custom web fonts like Google Fonts add aesthetic value but slow down your page load time. Each custom font file requires an additional HTTP request and can add 100-400ms to your load time. System fonts — the fonts built into every device, like Arial, Georgia, and system-ui — load instantly because the device already has them stored. For service businesses where page speed directly affects Google rankings and user experience, system fonts are an underrated choice. macOS and Windows now ship with beautiful, modern system fonts (San Francisco and Segoe UI, respectively) that look better than most free web fonts. The trade-off is less design control, but the performance gain is significant. Test your site with web fonts and then switch to system fonts — if the visual difference is negligible, keep the system fonts and save the load time.
The Two-Font Maximum and Visual Hierarchy
Using more than two typefaces on a single website creates visual chaos. The safe formula is one heading font and one body font. Your heading font can be distinctive and expressive — this is where your brand personality shows. Your body font should be highly readable and fade into the background so visitors focus on your message, not the typeface. Within that two-font system, create hierarchy using weight and size: H1 at 36-48px, H2 at 28-36px, H3 at 22-28px, and body at 16-18px. A contractor website using a bold condensed sans-serif for headings (communicating strength) paired with a lighter, more spacious sans-serif for body text (communicating clarity) tells a more coherent brand story than any single design element.
Want to know how your site performs in AI search?
Get a Free GEO Audit