How to Use Typography for Web Design

How to Use Typography for Web Design

Source: gnosh.co.uk

How much type is considered too much for a website? What font is the best when it comes to designing a website? Typography is as important as anything else when it comes to creating a website. When users are looking at type, it helps them understand what it is that they are looking for and further understand your site. Type for the web can be anything between a beautiful piece of typographic art or a simple text for a descriptive paragraph. Across the web, there are sites that go above and beyond when it comes to utilizing type, and others, not so much. It is important to understand how to manage copy and lettering when it comes to building a web page. 

Limit the amount of fonts used. 

For a while, the quantity of fonts used have always been no more than two. Anymore than that, and the design of your entire site becomes confusing giving out free headaches to your users. The bottomline answer nowadays is that it really depends. Unless your site’s purpose is to provide your users with an emotional rollercoaster ride, it should remain at no more than two. Websites need to be simple and consistent to the brand. Anymore than two should only be considered if that extra font serves a particular purpose and can greatly benefit your users. 

Great usage of limited font use. Source: fourfathersgroup.com

Web Standard Fonts 

Design experts will tell you that web standard fonts such as Arial, Helvetica, and Open Sans are best when it comes to type for content. They are called standard fonts because these fonts are available across most web browsers and will rarely change. They are also very easy to read when they are used for large bodies of text. 


Display fonts can be very good for branding or promotional occasions. However, there are dozens of other elements that needs to be considered when using some of the unique fonts such as navigation, colors, and layouts. Display fonts should be used sparingly, and must be used to serve some kind of purpose for the user. 

The amount of type

In this day and age, people just don’t like to read. Attention spans have gotten significantly smaller and as a designer, you must convey messages with as little text as possible. As soon as a user is exposed to a large paragraph after a large paragraph, they will shut down and leave. 
Too much text can also affect the design of a website entirely. It can actually change the direction of a design and users could potentially interact with your site differently than intended.

An example of a website that has excessive text. Source: http://chnm.gmu.edu/digitalhistory/designing/2.php

Font size matters 

A lesson that we have learned over the years in the web design world is hierarchy. In the dark ages, designers used font sizes to give users direction, which allows them to figure out how the site works. With HTML5 and CSS3, we are allowed to help users give direction in numerous ways. This allows text to not be used in other ways, such as highlighting or giving specific details. Nowadays, large bold typefaces are used to convey a simple message, or to get the users attention on something important. Small and simple fonts are used to provide details, but only if the user wants to zone in on the subject. 

Spacing 

It is important to note how much space will compliment the type. Leaving enough whitespace will allow users to comfortably read text. If text is placed tightly against other elements, it can be too hard for the eyes for reading. People tend to be very uncomfortable when it comes to white space, but with web design, it should be embraced. No matter what fonts and what their size is, whitespace has to be allowed to help showcase it. 

Contrast 

The most annoying thing you can do for type is to have text be displayed as a different shade of the same color as the background. It should not be difficult to view lettering regardless of background color. When in doubt, it is always best to keep black text against a white background and vise versa.  

Great use of contrast for text. Source: https://www.dailymail.co.uk

Type is an important aspect of web design, and it should be used as an effective tool. As much as web designers should know about layouts, designers should master the art of using type to make a design effective.

Leave a Reply

Your email address will not be published. Required fields are marked *