Selecting the Typography for Your Website
This page may contain links to Amazon.com or other sites from which I may receive commission on purchases you make after clicking on such links. Read my full Disclosure Policy
Last week in Planning a Website the Organized Way, we talked about the importance of establishing your business brand.
Many business owners spend a lot of time creating their color palette. There’s no question that colors have a huge impact on your visual brand, but how much thought have you given your typography?
I used to think that typography was about choosing a serif font (like Times New Roman) or a sans-serif font (like Verdana), and using bolding, italics, and varying sizes to present your message effectively. That’s part of it, but there’s so much more.
For a long time, we were restricted as to which fonts we could use online. If you chose something unique, unless visitors to your website happened to have that font installed on their own system, they would see something different – probably something boring or even ugly.
Technology has come so far that you now have thousands of choices!
Don’t select a font just because you like the way it looks! Each typeface has a different effect, so you need to choose one or two that best suit your business and your message. This infographic shows the characteristics that are commonly associated with several popular font styles. You can also see the impact of spacing, weight, and capitalization.
Resist the temptation to use a wide variety of fonts on your website. For a clean design, limit it to one for headings and one for your body text.
Explore different font combinations using a free tool such as Font Pair. Simply copy and paste your own text over the sample content to see how your message will look.
Other factors to consider include:
- The relative size of headings, subheadings, and regular text
- Spacing between characters and paragraphs, and between the text and the size of the page
- Where and when to use bolding and italics
There are over 700 free fonts available on Google Fonts and loads more on Font Squirrel. If you need more choices, Typekit, Fonts.com, and other web font services offer additional fonts for a fee.
Friday’s post will cover another aspect of your visual brand and the website planning process. Make sure you’re on my mailing list so you don’t miss it.
Did you find this post helpful?
Share it with your network, and sign up to get new posts by email every week!
Join the Conversation
I recommend...
I gave pretty much zero thought to this when I was getting started, and it does make such a big impact on the way people process your page and your business. I’m glad you are highlighting this aspect. If I were starting over, I might make some different choices. Someday I may revamp… this series really has me thinking, Janet!
That’s good to hear! I hope you’re keeping notes of all your ideas.
I really didn’t think about website/blog fonts because I had my brother who designed websites for a living pick one for me. I liked what he picked so I went with it. I think I would go crazy looking at all these fonts. Thanks for sharing these links on where to find free fonts.
I agree that choosing a typeface is harder than choosing colors – so many nuances! And as Geralin Thomas pointed out on Google+, you also have to consider leading (vertical spacing), kerning (space between letters) and tracking (spacing throughout the word).
I considered the typography more in my actual logo than on my website. I’m pretty picky about my lowercase letter a’s, preferring the rounded version like in the word ‘Scaling’ above! What does that say about me?! Unfortunately the website package I have limits font choices.
It shows you have very discerning eye! I visit some websites where they don’t even use the same font consistently, and I’m pretty sure they don’t even see the difference.
Your font choices may not be as limited as you think! I’m sure I saw an article once about using Google web fonts in a DotNetNuke website.
By the way, I like that style of “a” as well. You don’t see it often!
What an important feature that makes us think when we enter a site. I give a lot of thought and time to this factor whenever I am working on my site or sending out a newsletter. Thanks for sharing this information.
It’s one of those things we don’t always notice on a conscious level, but it affects us nonetheless.
Wow Janet that was fabulous. I too have a specific typeset for my business name but I don’t think about it as far as the content on my website. I love all the options you gave and identifying the specific type and impression it leaves. Very nice!
I’m so glad you liked it, Regina! Of course you wouldn’t want to use the same typeset for your website content as is in your logo, but finding something that went with it nicely could add some real impact.
Very informative post Janet! I’m wondering did we choose all of my fonts or do some fonts come with the theme you choose?
A bit of each if I remember correctly! I think the body text is the font that came with the theme, and you chose the others.