January 28th, 2013
Tips on Choosing Great Typography for Your Website
The past few years have brought technologies that allow you to use of a wide array of typefaces on your website. We’ve put together some tips on how to make your site look the best it can with your use of fonts.
Note: This is part 3 of our series on how to create a great looking Onepager. See the whole series here.
The web was once an ugly place for typography. Either you had to lock your words in an image/flash file or be forced to use fonts that sit on your users’ hard drives. The former meant impairing your SEO presence by not allowing the text to be crawled. The latter meant limiting your font selections to twelve or so ‘web safe fonts‘. Thankfully, that’s all changed in recent years. Advancements in browsers and font-licensing has enabled designers to start using beautiful typefaces without hurting SEO. These new fonts are called ‘webfonts’. Onepager uses a variety of webfonts that are available for anyone to use. If you’re working elsewhere, Typekit, Fonts.com, and Google Webfonts are great solutions.
When deciding which typefaces to use for your site, think about your site or company’s mood. Playful? Maybe a script typeface for the headers would work. Forward looking? Just take a look at sci-fi movies and see that sans-serifs like Arial and Open Sans are the font styles of the future. Prestigious? A serif typeface like Georgia or Times might be for you.
Decided on what style you prefer? Not so fast! You should also consider how important it is to vary your styles.
Mixing font styles is a great way to improve the aesthetics of your site. To do this, keep it as simple as pairing a serif and sans-serif typeface by using one for headlines and the other for body text. If you’d like to get more sophisticated, Hoefler & Frere-Jones has an excellent and brief article.
Other Font Tips
There are a few other things to consider when choosing fonts and writing content for your site:
- Be careful about using overusing all uppercase words. A sentence or phrase written in all uppercase is much more difficult to read. This is because our minds gather initial word information by the shape of the word. When you use all uppercase letters, all of that shape information is lost. The result is a harder and slower read.
- Don’t use extremely small font sizes. Major sites have increased the size of their type over the past few years and for good reason. You want the user to be able to read your content easily. Making users with less than perfect vision squint and struggle is a good way to lose their attention.
- Choose a color for your typefaces that provides enough contrast to distinguish it from the site’s background. You don’t have to use black text on a white background, but be sensitive to the reader’s comfort for the same reasons as above.
- Script typefaces can be very difficult to read as body text (large areas of sentences, paragraphs, etc.). Stick to legible serif and san-serif fonts in these areas.
Looking for more tips on how to make your Onepager look great? Be sure to check out our series overview.