Website fonts: It’s not just Arial anymore

Back in the early days of websites, there was a simple rule: No fancy fonts! Whatever font you chose for your website had to be a font that the person looking at your website had on their computer, so you were pretty limited in choices, and they pretty much were: Arial, Helvetica, Georgia, Verdana, Trebuchet MS, Tahoma, and Lucinda Sans.

Not a wide selection, just a few serif and san serif fonts for you there.

So designers got into the habit of putting all their text into images so they could have the fonts they wanted. Grids and grids of images simply to maintain a font.

Back in 2009, I had a client come to me with a website that was entirely in JPGs. Every aspect was a JPG. Me: “Why is everything an image?” Client: “We had to do that to get our fonts.”

I explained that doing that was a bad idea, because that removed all the text content from their website, leaving nothing in the site for Google to index for starters. But it also made it not responsive, difficult to share via email, and complicated to update.

So we had to have a talk about fonts. Yes, fonts can be important to branding, but in this case, changing those fonts to something universal was more important.

But guess what? You can have fonts now!

Long gone are the days of picking from 10 different fonts. Now with the Google and Adobe font libraries (and more) you can have almost any font you want!

How does it work?

It used to be that the computer being used to look at a website had to have the font loaded on it for the website to render in that font. That’s no longer the case. Now the fonts are instead loaded from a shared external library on their server.

Google fonts are open-source and free to use both for commercial or personal websites.

Adobe fonts are included as a part of your Adobe Creative Cloud subscription, so if you aren’t an Adobe user, you won’t have access to these fonts.

A few things to note:

Pick from one source: Try to stick with either Google fonts or Adobe fonts or whatever third party font library you want to use, and don’t mix and match. When you are pulling fonts from an external library, it can slow down your site and having to load from multiple libraries will add to the time it takes to load your site. Keep it at once library when at all possible.

Don’t use too many. Too many fonts make your website hard to read, and your visitors may leave if they can’t read your site. Don’t get too fancy. Just because Google has over 800 fonts to choose from, doesn’t mean you need to use a ton.

Make sure it’s readable. Yes, fancy fonts can be fun… if you’re 11. But once you grow up, make sure to pick fonts that are easy for your users to read.

Match them up. Your logo may use a fancier font than your website text, and that’s okay. You can work to find complimentary fonts to enhance your website and brand even if they aren’t identical.

And check out our handy infographic for more information on where to use fonts.

Have font questions? Send add them in the comments! Need help choosing fonts for your website? Send us a request!