Understanding Typography in Good Web Design

What is typography?

Simply put, typography is the style or appearance of text. And though you may not believe it, good typography can make or break a user experience.

But before the internet age, it was known as the art of logically arranging and designing the text of any printed matter to make it logical and easy to read while also having a pleasing and attractive look.

Good typography was considered essential when it came to the publishing of books, manuscripts, newspapers, and other types of print media.

Nowadays, this form of art is still held to a high standard. But with digital media and the internet becoming more popular over print media, some of typography’s finer points are being forgotten in place of flashy animations, high-resolution images, and stylised backgrounds.

This is especially evident in website development, where many website designers often rely on attractive graphics, auto-playing videos, and other distracting features to attract visitors and compel them to stay on the page.

Unfortunately, this particular trend can have a detrimental effect on a website’s ability to keep their visitors around, especially when such features have become commonplace.

As such, it is up to web developers to employ best practices for typography to ensure that their websites remain effective in attracting visitors.

Best Practices for Typography

Good typography immediately communicates the website’s purpose to the visitor. Once landing on a webpage, a user will immediately begin scanning for information.

This information needs to be easily found, otherwise the user will exit the website and you’ll lose a potential customer.

Font Choice

A clear, easy to read font that is appropriately sized will make their experience a more positive one, increasing the likelihood of them returning to your website in the future.

Typeface can make or break a website. Sure, the playful, calligraphic fonts are fun to look at, but they’re not very easy to read.

Instead, choose from a popular font family such as Helvetica, Calibri, or Arial, to make sure users can easily read the on-page text.

Headlines

Consider the last time you looked at a website. Did you read every single word on the page or did you scan for text that was bigger and bolder?

You may not have realized it, but you subconsciously scanned for headlines as soon as you landed on the page. 

As such, it’s important to make sure that headlines stand out on a website.

Web designers can quickly convey to a visitor that they are looking at news articles by having the “News” subheadings displayed with bolder and larger typefaces than the rest of its content.

These article headlines would then draw the visitor’s eye to the smaller blurb paragraphs below them, prompting them to read further.

Proper headlines can help direct users exactly where you want them to go.

Evoke Emotion

Another reason why typography is important in web design is that it can help evoke specific emotions and mindsets within the visitor.

Just like the previous news website example, the larger size of the headlines among the other text immediately grabs the viewer’s attention and establishes a sense of urgency, as well as a desire to know more. As such, they stay on the website for longer as they satisfy their curiosity through reading the articles in full. 

In the case of an eCommerce store however, typography serves a different purpose. 

Though you want to provide sufficient information in the product description, a more effective use of typography in eCommerce is a minimal use of text, combined with attractive brand & product photos. 

The minimal amount of reading they have to do also ensures that they can find and spot the specific product or product line they’re looking for.

Spacing

Just as headlines drag your attention to a certain spot on the page, the use of white space often helps make larger volumes of content easier to read.

Reading large volumes of text, especially from a computer monitor or smartphone screen, can easily cause eye strain and eye fatigue. This can make it difficult for a website, especially one that conveys information through large blocks of text, to retain visitors.

However, a text-heavy website can avoid tiring out its visitors and encourage long periods of enjoyable binge, simply by breaking up the content with white space. 

If you’ve been paying attention, that’s what we’ve been doing in this blog.

It’s easy to overlook typography when it comes to building and designing a website.

However, to do so is to risk making your website look confusing or difficult to engage with, which can drive off its potential visitors and users.

Recognise how good typography can shape the perception of your website and take to heart its importance in web design for the reasons listed above, and you’ll see why this fine art is still essential even today.