When you decide you’re ready for a website there are so many things you need to consider – domain name, hosting, website platform, page builder, logo, copy, images, colors and, yes, fonts. So, I wanted to share a bit about how to choose website fonts.
Fonts are an incredibly important part of your website design and the fonts you choose actually say a lot about you and your business. Your font choices need to represent your brand personality. If you have a brand document, then your fonts have already been selected and they should carry over to your website for consistency.
If you don’t have a brand document, you should start by thinking about what your brand personality is, what kind of business you are, who your target audience is and what you want to convey about your business.
For example, is your business classic, chic, traditional, elegant, creative, stylish, friendly, unique? There are fonts that convey all of these personalities and when choosing fonts for your website you need to make sure they represent your business correctly.
When searching for a font, the best place to start is the Google Fonts library. It includes over 800 free licensed fonts and is also one of the top places for finding web safe fonts.
A web safe font is compatible with all modern web interfaces used on both desktop and mobile devices and will stay uniform across all browsers meaning your web presence stays consistent.
Now, when designing a website, you definitely want to use more than one font. Here are some basic rules to follow when combining website fonts:
Never use more than three fonts on your website
First you should define a primary font. This can be used for headings. Generally, you’ll want this font to be eye-catching. This is where you can use a fancier font that has more detail and personality so it grabs people’s attention. These fonts are designed for headings consisting of just a few words; they aren’t designed for a long page of text.
Then, you’ll want pick a secondary font which you’ll use for the body text. This font should be a standard font designed for easy reading. Standard fonts work well in smaller point sizes and in larger blocks of text. They are designed for legibility.
Finally, you can choose a third font, if you’d like, that can be an accent font. This is the font you can use on buttons and calls to action. It’s good if this font stands out, since calls to action are very important, but it needs to be legible as well.
Make sure your fonts complement one another
Font pairing can be difficult. There are some basic principles to remember.
Be sure to think about letterforms that are similar in mood, stroke and height.
Consider the shape and slant of the letters and go for typefaces with similar outlines.
It’s a good idea to mix and match type styles so you can select a serif and sans serif pair or a sans serif and a novelty typeface.
It’s ok to get help with this and there are several websites that offer great suggestions for font pairings. Two that I recommend are Fontpair and Canva.
If you’re afraid of messing it up, a helpful tip is to keep it in the same font family. A font family is a group of related typefaces which vary in some respects but not in design. An example is the Roboto font family which consists of the normal Roboto font, Roboto Condensed and Roboto Slab. All three have their own styles and offer variation, but are cut from the same cloth is a safe bet for your three fonts.
Never give up readability for design
Please don’t ever choose a font that is too difficult to read! The main purpose of your website is to give visitors the information they need and if they can’t read it, it doesn’t do any good.
There are some other factors you need to consider as well when choosing fonts for your website. One is the size of the fonts you’ve chosen. A good guideline is as follows:
Titles: 30-70
Subtitles: 22-30
Paragraph: 16-20
Other important considerations are the spacing between letters and the spacing between lines of text. All of these factors contribute to the legibility of the content on your website.
Remember, a clever combination of fonts can have a powerful effect on your website’s design. Your choice of website fonts says a lot about your business, so choose wisely.
If you found this information helpful, I hope you’ll share it with others who may benefit from it using the links below.
If you’d like to start the conversation about working together, please fill out the client application form and I will be in touch to schedule a complimentary introductory call.
