One of the great features of our WordPress Themes, is the option to customize the typography on your blog or website. If you’re not sure how to do that, check out our post here. In this article we are going to review 5 top Nonprofit websites and the Google Fonts they use.
We include 14 web safe fonts and over 800 Google fonts in our themes. By any standard that’s a lot of fonts! So you might be scratching your head to decide which fonts are going to be the best.
What’s a web safe font?
There are a certain number of fonts that are guaranteed to exist on most devices, we call these web safe fonts or standard fonts. That’s because when people open your website those particular fonts will definitely be able to load. If you use a font that is not web safe, then your have include the font file, otherwise the visitors device might not have it, which means it won’t display correctly.
Luckily our themes already load your chosen font automatically, so that’s not a problem.
Choosing a Google Font
Now we’re going to focus on choosing some awesome Google fonts that are popular right now with big Nonprofits, this should help you when selecting the typography for your own website or blog.
Unicef uses Roboto as their main font. It’s a friendly, modern, sans-serif font with clean curves. Notice how they use different font weights for page titles and paragraph text. They also use uppercase for menu items and buttons. Overall the typography supports the fantastic images they use and doesn’t distract the visitor.
Another Nonprofit using a clean font is water.org. They use Open Sans, a font most designers will be familiar with that also has a nice ‘condensed‘ version as well. The design has a neutral quality, and works well on all devices from desktop to mobile. A few years ago it was one of the most popular fonts out there and is definitely a good choice if you want to keep things simple.
Below is another nice example of Open Sans.
Now we move onto Mozilla.org…
Originally designed in 2012 as a typeface for the Mozilla OS, Fira Sans now comprises of 16 different weights and is a standalone open source project. It has some great options for heavier weights, which will make titles stand out, especially when placed over striking images.
Another font that deserves a big shout out is the loud and proud Oswald, great name right? Shown here on food&waterwatch.org, Oswald has 3 different weights – Light, Regular and Bold. It is actually a reworking of a classic font “Alternate Gothic”, but better suited to digital screens, plus it’s free!
The National MS Society has also gone for bold stand out titles by using Source Sans Pro. This was actually Adobe’s first open source font, thus the name. In the example above, the designer has also added a nice text shadow to make the typeface stand out from the image behind.
What about paid fonts?
Generally fonts can be expensive, so if you are lucky enough to have a budget to spend on typography, there are even more options for you to choose from. One of the most popular paid fonts for Nonprofits is Proxima Nova by Mark Simonson. Here are some nice examples using this particular fonts.
Websites like Font Spring have a lot of different options for you, you can check out their bestsellers list to find some new ideas, or use their Matcherator to find a font you like from an image. If you like Proxima Nova you can also buy it over at fontspring.com (Charity Themes may get a commission).
One website that looks particularly good is www.wcs.org. They use 2 carefully selected fonts together and it gives a wonderful classic feeling. Along with powerful photography the design is really beautiful.
Both fonts are popular among many Nonprofits. Futura BT bold is often used for headlines, it makes a big impression when used on top of images. Erato Light is being used as the main body font, it’s actually a free font, but you will need to embed it into your website yourself as it doesn’t belong to the Google Fonts library.
Well that’s it, but I am sure there are many other great examples. If you have one, please let me know in the comments below!