For any design, whether it’s for the Internet or for print, typography is a core element that can make or break your design. Although web design doesn’t allow as accurate type as print, it’s still important to keep your web typography well-designed. Let’s see what you should keep in mind when it comes to typography on your website when designing it.
To keep a website that’s legible and credible, you shouldn’t use too many fonts and try to avoid going too crazy on font variations, styles, or colors. Choose a legible font for main texts and an attractive font for titles, but you shouldn’t go much further than that. If you have a good reason for it, you can eventually add a third font, but you should have a good reason for it.
What’s the reason for all these restrictions? Mainly legibility and branding. Using too many fonts will make the website increasingly harder to read, as your eye must adapt to a new font all the time. For branding, too many fonts will make it harder to recognize the website as it loses on consistency.
If you frequently write for the Internet, you know that structuring your content by using headings and sub-headings is crucial, as most visitors don’t really read the content, but tend to scan it. With good typography, you can increase that scanability and make your article even easier to read by creating clear typographic hierarchy. There shouldn’t be any possible confusion between the various titles or texts on the page, so you should differenciate them well with the right font sizes, styles and variants.
For paragraphs of text, it’s important to make it as readable as possible. Keep in mind that very short lines will break your reading rythm too often, making it unpleasant. Too long lines are tiring, you may loose focus and get tired. For all these reasons, you should make your text lines just the right length. According to experience and research, 50 to 80 characters per line seems to be just right.
Not all typefaces were designed equal, so you should pay attention to the versatility of the font before picking it. Having a versatile typeface means that it comes with many styles and sizes, which makes it much easier to use less fonts. The other big advantage of having a versatile font is that it improves the branding consistency on the site.
This should go without saying, but it’s better to write it: keep a good contrast to make sure the text is readable. This means mostly that your color choices should be readable, even for people with visual defficiencies.
As it becomes easier to create effects and animation, there is a temptation to overuse it. Of course, animated text will add some visual coolness, but it comes with a price in terms of readability and usability. As a rule of thumb, avoid using animated text, except maybe for some website intro if you are into that kind of things.
Although the use of whitespace may seem unrelated to typography at first, it’s a crucial part of typography. Adding some whitespace around typography is a way to give your readers some breathing space and to improve the comprehension of your texts.
Uppercase text can be a good option for some titles, but you should never use it for body text. The reason? It becomes very difficult to read. On top of that, it creates a weird vibe to your paragraph.
