Fonts: A Beginner’s Guide to Fonts for Web Design and Branding.

Fonts: A Beginner’s Guide to Fonts for Web Design and Branding.

If you’re thinking about rebranding or exploring web design options, one of the first decisions you need to make will be fonts. This means the style of the text. While it may seem like a small decision, it can make a big difference to the overall look and feel of your brand.

How to Pick Fonts for Your Brand.

There is a huge range of fonts that you can use for your web design or marketing branding. While there are no limitations with print and image fonts, having fonts show up as text on a web page is a tiny bit more limited.

The best places to go are:
Google Fonts: Google’s collection of web fonts which can easily be added by code or integrated into WordPress Websites.

Github: If you have a developer building your website then Github has a vast selection of fonts, but you might need a bit of code to install it.

Before you dive into picking one (believe me, it’s a wormhole that’s hard to escape), let’s talk about how fonts work.

Different Types of Fonts.

Fonts can be broken into five main categories:
• Serif.
• San Serif.
• Display.
• Handwriting.
• Monospace.

If you are using Google Fonts, these are the categories they use to break down their vast library.

Serif.

Serif fonts have a small, decorative line or ‘serifs’ at the end of each letter. These fonts tend to be associated with traditional or luxury brands.

Example fonts:

  • Times New Roman.
  • Rockwell.

San Serif.

San Serif fonts don’t have any decorative flicks on the ends of the letters. The name means ‘without serifs’. These are usually associated with the modern and friendly design.

Example fonts:

  • Ariel.
  • Helvetica.

Display.

Display fonts are designed for use as headings. They include overly ornate or chunky fonts. These fonts are often difficult to read when used as paragraph text.

Example fonts:

  • Lobster.
  • Alfa Slab.

Handwriting.

Handwriting fonts mimic natural writing – either beautiful script or bubbly, marker style font. These fonts are usually associated with handmade brands or brands that want to come across as ‘non-corporate’. When used in the wrong way, these fonts can look unprofessional.

Example fonts:

  • Bradley Hand.
  • Papyrus.

Monospace.

Monospace or Fixed Width font are fonts which occupy the same horizontal space. These are mostly associated with typewriters. These fonts can look very mechanical or technical, but can also work well for modern brands when used correctly.

Example fonts:

  • Courier.
  • Roboto.

Picking Fonts.

Picking fonts can be a bit of a science. It can also be quite addictive. But here are some top tips on how to get the balance just right:

  • Think about what you want your brand to say. If you’re going to be luxury, pick a Serif font for headings. If you’re going to be modern, choose a san serif, thin font.
  • Don’t use too many. Try to stick to two different types – a heading and a body font. You can add a third font if it makes sense. However, too many different can look cluttered.
  • Make sure it’s readable. While having a funky font with loads of gaps may seem great if your audience is over 75 they may find it hard to read.
  • Use font weights to your advantage. Some fonts come with lots of different ‘weights’ – thick, thin, slab, regular. Use a mix of these in your designs.

Font Combinations.

FontPair.co is a brilliant tool that helps you find font combinations that work. Either take a peek at their ‘Featured Font Pairings’ section or choose a mix from their navigation bar.

 

 

No Comments

Add your comment