What Is The Best Font For Your Website?
March 24th, 2008There are many decisions a new website owner must make, and one of them is selecting a font for the content of their website. Often clients ask me to try out different fonts to see how they look. I’ve now made this process easier by creating my very own font-selection tool.
There are several things to consider when choosing a font for your website.
First, you want the website font to be readable. Generally speaking, fonts that are “sans-serif” are considered a bit more readable than “serif” fonts, but some studies that compare different fonts have found mixed results for different font types and sizes. The study noted:
Overall, Verdana was the most preferred font, while Times was the least preferred font.
Secondly, fonts all have different emotional characteristics/values or “ethos” or even personalities. Some are more casual, while others are more formal. Think about your small business clients and what type of products or services you are selling and pick a font that strikes an appropriate mood.
Thirdly, try not to mix and match fonts on your website. Mixing font types just makes your valuable content harder to read.
Lastly, the font size, font color, font weight, and background color will have an impact on readability. The study mentioned above noted that contrast was a very important factor, so make sure there’s enough contrast between your font, and your background. Font size is also a huge factor so make sure your font size isn’t too small – ask someone over 40 (who has lost their near-sighted vision) to take a look at your fonts. The Witchita study found:
Older Adults are more accurate with, and prefer larger font sizes. They also prefer sans serif fonts over serif fonts.
The Witchita study stated that for all age groups:
Fonts at the 10-point size were read more slowly than fonts at the 12-point size.
Here’s my font selection tool. Simply click on the font name to see what the font looks like. I’ve specifically chosen this subset of fonts because they are widely available on both Mac’s and PC’s.
If you find this tool useful, please do leave me a comment. I just love comments! They encourage me to build more tools like the font selector. 🙂
Enjoy!
Jill--------------
J. Olkoski
Aldebaran Web Design, Seattle
Jill Olkoski has a BS in Engineering, a BS in Computer Science and an MA in Clinical Psychology. She delights in using her advanced technical and psychological skills to help small business owners develop cost-effective and successful websites.
March 25th, 2008 at 11:40 am
Thanks for doing this blog it really helps me to learn things about wordpress bit by bit…and I agree completely about the font thing. Too many fonts are not your friend!
March 25th, 2008 at 1:46 pm
Hi Jill –
So, maybe I’m just responding to advertising and like Gill Sans because (I think) it’s the new font on your website, so I’m positively associating it with you, but it is my favorite on your tool! It’s hard for me to know how “serious” I want to be on my site. For the last eight months (since launch, that is) I’ve been using Book Antiqua, which is my personal favorite. I fear it has too many serifs, but I like the roundness and readability of it. This font (Gill) seems more, I don’t know, hip? (Is it unhip to use the word hip?? 🙂 And I like how it looks on subject headers.
Another thought about your tool: you could consider making it possible for people to look at the different fonts in different forms, such as italics or subject headers. One big complaint I have about Book Antiqua is that the italicized version looks bigger than regular script for some reason, and I think that’s distracting, irritating.
And be sure to warn your clients that this kind of stuff really brings out obsessive-compulsive tendencies! 🙂
March 25th, 2008 at 3:20 pm
Hi Stephen,
Yup, it’s Gill Sans – and I was attempting to be more “hip” or “creative”…I think those words are still ok to use. I will definitely expand to be able to let them view different font sizes and font style (bold and italics).
March 30th, 2008 at 4:22 pm
And just for Stephen, I’ve added font size choices and some bold and italics to my font selection tool:
http://aldebaranwebdesign.com/resources-contentfonts.php
Other suggestions are welcome.
July 2nd, 2009 at 10:24 pm
A recent study found that the most common font on popular websites is Arial by far. Furthermore, it is usually set with the absolute size “small” which translates to about 13px for most browsers.
February 22nd, 2010 at 1:19 pm
i am in the process of choosing a font now for a new website design. My readership is older women (55+) so I want to use a large font. My site is also about Victorian things, so I think a serif font would fit the theme better. My site designer is pushing Verdana because it ranks highest for readability. i still want to keep the old-fashioned look. What do you think? Scott
February 22nd, 2010 at 1:42 pm
Hi Scott,
While I have read that Verdana is the most readable, I usually let clients pick from any of these fonts: http://aldebaranwebdesign.com/resources-contentfonts.php I think that as long as you used one of these for the content, and made the font large enough (12, 14, 16), you’d be fine…in my opinion. While it’s important that web designers inform clients of repercussions, I do think that ultimately it’s the client’s choice. Great question!
July 17th, 2012 at 8:11 pm
I still opt for verdana; with the size of 10;