The Best Google Webfonts & Why You Should Be Using Them

The Best Google Webfonts & Why You Should Be Using Them | Kanuka Digital

The Best Google Webfonts & Why You Should Be Using Them

The Google WebFont service is an ever-growing depository of fonts, all available to use for free on the web, through Open Source Licensing. Whilst it isn’t the only platform available to deliver typefaces to your site, it does have the largest free selection out there.

What is Google Fonts?

The platform first launched in 2010 with a “whopping” 19 font families. This revolutionised the way type could be used on the web. Designers & developers were no longer limited to a handful of web safe fonts which could be found on the users’ machine.

Now they could deliver a plethora of typefaces directly to them. Since then the depositary has had a number of facelifts and added almost 900 new families to the ever-growing library.

Although the platform does contain fonts from the world’s biggest type foundries, they’re often not their flagship products, which are sold through other distributors such as myfonts.com and Adobe Fonts.

That doesn’t mean that these aren’t high-quality fonts though. They offer support for a lot of languages and OpenType features.

The Advantages Of Using Google Fonts

  • Free for commercial use – the fonts in the library are covered by open licenses, giving you endless options with how you use them. They can also be downloaded for use in print projects without the need for further licenses.
  • They’re easy to use – Google has made it particularly easy to add them to your site.
  • There are a lot of choices – there is an alternate font for a lot of the most popular typefaces out there. New fonts are added to the library regularly, offering alternative cuts of classics like Baskerville & Franklin Gothic, which all bear the prefix ‘Libre’.
  • The fonts themselves are updated – and you don’t have to do a thing for the new versions to appear on your site. Apart from clearing your cache that is.
  • Language support – there is a host of different languages supported by the fonts in the library. Be sure to check that your chosen font supports all the languages you will need though.

The Disadvantages Of Using Google Fonts

  • They are freely available – this does raise the issue that anyone can use them, and a lot of people are. This could lead to the web becoming a boring net filled with all the same text everywhere.
  • They are free – type foundries are not making £100s from the use of their fonts so they may only upload a subset of font weights or an alternative cut of the ones available elsewhere. This isn’t true for all options with some performing better than their paid-for counterparts.

Why you should be using webfonts

Some of you may be asking why you should be using webfonts at all. It is a common question.

With the evolution of technology, using text within images is becoming a problematic issue. Not only does it limit the amount of compression you can utilise on the images to reduce file size, whilst maintaining the quality.

It can also have a knock-on effect on speed and search engine results for the page. Wherever possible you should use HTML text overlaying an image.

The Most Popular Google Webfonts

Now we’ve covered why you should use webfonts, we’ll take a look at the 5 most popular fonts on the Google service.

1. Roboto

Top of this list is Roboto, which, in the last week alone has been delivered 64 billion times by Google’s font API, across 20 million different websites.

Roboto by Christian Robertson for Google.

This neo-grotesque, sans-serif typeface, designed by Christian Robertson and developed in-house at Google, was originally intended for use as the system font for their mobile operating system Android in 2011. Since then Google has adopted the font for various platforms such as Gmail and their Campus network.

Roboto Versions

It has been adapted into condensed, slab serif and monospaced versions and even has a Hebraic counterpart in Heebo. So this is a very flexible font allowing you to keep consistency across the various styles you require.

Hebrew pangram with English translation set in Heebo

It’s without a doubt that Roboto is the most popular font they provide, but that doesn’t necessarily mean that you should choose it for your site.

It’s not been long since Helvetica dominated the type world. It could be seen everywhere from hairdressers to restaurants to banks and everything in between. This can give fatigue in readers and cause them to glance over text which seems too familiar.

An opposing argument from Jacobs Law of UX determines that users prefer to use products that are similar to other products they have used. So using a popular font can have its benefits.

2. Lato

This font is becoming increasingly popular due to its similarities to another popular font Brandon Grotesque. It also has a lot of similarities with the infamous Gill Sans typeface which makes it a great alternative. It is one of the bigger families available with 10 variations from Light to Black with true italic counterparts.

Lato by Łukasz Dziedzic

This typeface, designed by Łukasz Dziedzic, takes its name from the Polish word for “Summer”. Originally created for a Polish bank, it has been released with an OFL and gained huge popularity on the repository.

3. Open Sans

Next on the list is Open Sans designed by Steve Matteson for Google. This Open Source font utilises a large x-height (tall lowercase characters) which add to the overall legibility of the font which was created for use across all media on screen and in print.

Open Sans by Steve Matteson for Google

By using the same font across all branded materials you can ensure that you keep consistency across platforms. Delivering your brand messages with the same voice everytime.

4. Montserrat

The Montserrat family was inspired by the typographic posters which once surrounded the Montserrat area of Buenos Aires. It is also clear to see the connection to some classic geometric typefaces such as Gill & Futura.

Montserrat by Julieta Ulanovsky

Originally created by Argentinian type designer Julieta Ulanovsky, in the summer of 2017. The whole family had a redesign at the hands of Jacques Le Bailly with the regular version becoming lighter and optimised for use in longer texts. These features make this a great choice for blocks of copy on blogs and pages. The heavy version of the fonts works great for eye-catching titles.

5. Libre Baskerville

One of my personal favourites, based on the classic Baskerville design but modernised for the digital age. The original also comes from a local designer, albeit one who has not been around for a few centuries, Birmingham’s own John Baskerville.

Although this is not the first time this typeface has been resurrected, with the extremely popular Mrs Eaves by Emigre being one of the first digital renditions of the font.

Libre Baskerville by Pablo Impallari

Through various studies conducted, Libre Baskerville has resoundingly won at being named the most agreeable typeface available. People like the way the characters represent traditional penmanship and classic characteristics.

This makes it a great option for long bodies of text. Its italic counterparts have elegant pen strokes which are great for displaying quotes at larger point sizes.

Things to consider when choosing a font

The User

It is highly important that you consider who is going to be reading the text when choosing how to display information on your site.

If you are aiming a site at a young audience you will want to choose a font which contains large lower case characters with a soft touch. A font like Kalam with its letters that appear to be written with a thick marker pen will make it an easier site for them to navigate.

Your font choice can cause a user to make an immediate decision about your business. You need to ensure that you portray your brand values through it. So Kalam might work for a young audience but if your business is aimed at an adult audience you may be creating an association that you don’t want. Making your graphic style condescending to the end user.

Look at why a font has been created if it was originally produced for a certain brand or product. When recognised by the reader this could create an unwanted association.

Languages

If you expect your website to be translated into various languages its best to make sure that the character set of your chosen font allows for this. If you’re selling your services or products in Germany, make sure that there is full support for the German language – including umlauts or the eszett.

On the subject of languages, it is important to check which the font is optimised for. Some of the GF collection has been designed to deliver a specific language, such as Heebo, the Hebrew counterpart for Roboto.

Although it does contain the full Latin alphabet, it has been optimised for reading right-to-left. Along with this, the characters have not been optimised for the screen to the same standard as its parent font, they are really just there as a fallback for when western users visit a Hebraic site.

This isn’t the only font on the platform which has been created for use with a specific language. If you need that extra bit of reassurance about font choices, speak to us and we can advise you language support.

Pairings

Although you now have access to over 900 fonts, it doesn’t mean you should be trying to use all of them. A good rule of thumb is to choose two fonts which go well with each other and your branding.

Need help?

Choosing the right fonts can be a difficult task, have no fear we are here to help.

Whether it is choosing the best font to display the navigation, call to actions, titles or copy on your site. We’ll look at the core values for you business, who your main users are and how to best connect with them through great use of typography.

For help picking the best font for your website or branding, contact Kanuka Digital today

Tags:
,
Andy Tindale
atindale@kanukadigital.com