Not just a pretty type-face

In our everyday lives we are constantly surrounded by typography whether we’re aware of it or not.

 Every single day we read books, browse on our phones and other devices, choose from menus,  follow signage, read ingredients on food packaging… the list goes on and on. 

Whilst communicating online there are many considerations apart from choosing colour, images and composition: it’s compulsory that the fonts chosen are highly legible and equally easy to scan, not just because they’re pretty or a personal favourite. Used correctly it can play a vital role in improving the UX of any website. It can also improve the comprehension and even the mood of the user. 

To maximise the user experience the typography should be visually appealing as well as well written to keep the user engaged. But it’s not just about having great content in your website - this content needs to have hierarchy, legibility, clear Call to Actions and clear formatting. 




When typography is on point, words become images.
Shawn Lucas

Hierarchy matters

Proper hierarchy leads the user through a page with more ease. Its vital for good readability. Every website should have a very well defined typographic hierarchy. The headline, sub headline, body text etc should have a defined size and type style. This hierarchy can be achieve by following a few simple rules:

  • Choose a font that’s easy to read, whether it be serif or sans serif. A bad font choice and have serious consequences for conversions.

  • Size matters. Heading are very important as part of the usability experience. They need to grab the users attention and help lead them through the content with ease.


See below examples of very thoughtful typographic hierarchy: 







Typography is a vital part of a designers work. It can make or break a design. No-one wants to land on a web page where the type is too small or overwhelmingly big - bad typography can sometimes be the downfall for the usability of a website. If CTAs don’t stand out this can have a negative effect on conversions. Typography must communicate clearly to the user and highlight information in an engaging way. It sets the tone for the user experience and helps make your brand more recognisable. At the end of the day the purpose of any text on your website or app is to help your users accomplish their goals and have a good experience at the same time.

How often do we land on a website and get bombarded with a massive amount of content that we merely scan (if we could be bothered!) It’s not fun for the user and can cause huge drop off rates. The more content heavy the page is the more likely it is for readers to give up. Keeping content relevant and interesting is really important but it’s also equally as important to make sure its formatted in a readable and thoughtful way.

By making itself evident, typography can illuminate the construction and identity of a page, screen, place, or product.
Ellen Lupton, Thinking with Type


It gives the audience a link to your brand

Typography can have positive and negative associations. A font choice can change the entire tone of a website whether it be playful or serious. It’s an extension of your brands visibility and tone - it gives your business a personality. It can build brand trust and give positive connotations. Make your typeface choice professional and appropriate for your business type. If a bank used a fun, hand-drawn font it would give the user the wrong impression. For example, banks usually use professional, corporate fonts and these font choices in turn give the user more confidence on the business - it can build trust. Similarly, Disney has a playful font that defines their brand. It symbolises a fairy-tale, child’s world and is instantly recognisable. A font should match a brand. 


Space

Here we go again, the white space debate. It’s simple really - use white space to reduce the amount of text the user sees at once and to frame important blocks of information. I wrote an article about this before as its something I feel very strongly about. Who wants to experience a cluttered website with no space or considered layout?? White space is very important so the user can scan a web page and easily recognise the information they are looking for. It creates order. https://www.strata3.com/blog/2016/white-space-is-not-your-enemy

The most popular typefaces are the easiest to read; their popularity has made them disappear from conscious cognition. It becomes impossible to tell if they are easy to read because they are commonly used, or if they are commonly used because they are easy to read.
Zuzano Licko



Colour

At the moment anything goes when it comes to colour and typography and getting a balance can be tricky. Not only is it imperative that the colours are accessible but colour can also play an important role in conversions. Colour can have a psychological effect on us and can influence our decisions. Of course it depends on your project but as a general rule colours should be chosen carefully to break up the monotony of a design. Different colours should be used for text and background for easier visibility and better contrast. 





Optimising typography is optimising readability, accessibility, usability, overall graphic balance.
Oliver Reichstein, Web Design is 95% Typography
 

Final word

It’s my mantra for design in general and typography is no different. Less is more. Enhance readability by using well considered, clean typography. Make your users smile!

 

See how we can help you with your next project

Get in Touch
Oriana Corbett - Senior UI Designer

Oriana Corbett - Senior UI Designer

Senior UI Designer at Strata3