How to Pick Fonts For Your Blog

If you're branding (or rebranding) your blog, fonts are one of the key decisions you'll have to make. How to pick fonts for your blog is a crucial part of your brand, and how readable your site will be. There are no hard and fast rules about which fonts are "good" or "bad," but there are some guidelines to follow when picking a font out there to help you out. Let's check it out.

How to Pick Fonts for Your Blog

 How to Pick Fonts for your Blog! Learn how to pick the right fonts for your blog and your brand. Click through to read more! #blogbiz, #blog, #blogging, #blogger, #graphicdesign, #blogtips, #fonts

This post contains affiliate links. You can read my full disclosure right here.

Types of fonts

Technically there are more than four kinds of fonts (for real typography buffs), but for our purposes, these are the basic four. How to pick a font starts with knowing what types of fonts are out there, right?

The four main types of fonts are:

  • Serif
  • Sans serif
  • Script
  • Decorative

Let's look at each one.

Serif Fonts

A serif font is one that has little "legs" on the ends of the letters. If you ever had to write a book report in Times New Roman--that's a serif font. They're generally thought of as more traditional. Some studies say that they're easier to read as well.

Sans Serif Fonts

San serif fonts are, not surprisingly, fonts without serifs. The heading and body text on this site are both sans serif fonts. They're generally thought of as a little more modern.

Script Fonts

Script fonts are or handwritten fonts. You wouldn't want to use them for your main text, but they can be great to highlight a headline. The cursive font I use on my homepage is a script font.

Decorative Fonts

Decorative fonts are basically novelty fonts. They can draw attention and they have their place, but you shouldn't overuse them.

How to find fonts decorative

Things to keep in mind when choosing a font

Before you choose a font, think about what you want to convey. When asking how to pick a font, you've also got to ask how do you want your website to "feel"?

Even before a customer reads the message in your marketing, the font is already communicating something to them.
— 99 Designs

Fonts may seem trivial, but they can really affect your site and your branding.

Of course, you also need to consider legibility. No matter how pretty the font is, if it's not easily readable on the computer screen and on mobile, it's gotta go. Never pick a font that's not legible on both desktop and mobile.

You'll likely want 2-3 fonts for your branding and your website. One font for headings, one for body text (although you could use the same one for both). and one extra for things like the logo or the occasional callout.

You might be wondering "how do I pick fonts that go together?" When pairing fonts, it's important to have some contrast and to make sure that they look good together on the page and convey the same message. When thinking about how to pick a font, pairing is an essential element.

Sometimes you’ll want something that really pops, and other times the context will require a font that’s not distracting, such as for long passages of text.
— Canva

Serif and Sans Serif usually make a good pair. If all else fails and you really get stuck, having a serif headline and a san serif body font, or vice versa, usually makes a good choice. It'll allow you to emphasize what you want, while still remaining readable.

Grab Your FREE Blog Planner



Where to find fonts

These days there are tons of places to find fonts online. But when thinking about how to pick the right font, a few font-picking websites that I like are:

You can also check out Google Fonts, which are free, and often come with your theme.

How to use fonts on Squarespace

Squarespace comes with a huge number of fonts already included, so your chosen font may already be there for you. In that case it's easy.

Squarespace also integrates with Typekit (discussed more below), so you can get more fonts that way too.

You can also upload custom fonts to Squarespace, but it's a bit tricky and involves some code, so I'd steer clear unless you know what you're doing.

How to use custom fonts on WordPress

If you're moving beyond the fonts that come with your theme, you've got a few options for how to install those fonts:

Fonts that come with your theme

All themes should come with at least some fonts. Sometimes the included themes are robust, sometimes, not so much. If you like the fonts that come with your theme, great! One less thing to do. But if you're looking for something a little more special, these are some great options.

Typekit

Typekit is a subscription service from Adobe that offers thousands of fonts. Depending on the font, it can be used either on the web or on your computer (or sometimes both). It's a great option if you're looking for a new font.

When you find a font you like, you'll add it to a "kit," add in the site that you want it installed on, and then hit publish.

How to find fonts typekit 2

Back on your site, you'll need to install the Typekit plugin. This will allow you to assign your chosen Typekit font(s) to use on your site. To do this you do need to know a little bit of code, but it's easy.

Say I want to use the font Brandon Grotesque as the Header 1 font on my website. The code would look like this:

h1 {

font-family: "Brandon Grotesque";

}

That code tells the computer that all Header Ones should use the Brandon Grotesque font.

How to find fonts Typekit

You can also add other elements, such as font weight. That would look like this:

h1 {

font-family: "Brandon Grotesque";

font-weight: 900;

}

I use Typekit on my WordPress site to provide me with two different fonts. When you fall in love with a font, you've just to have it, right?

Use Any Font plugin

The Use Any Font plugin allows you to upload custom fonts to be used on your site. This works well for fonts that you bought somewhere like Creative Market. After uploading the font (make sure that you have permission to use it this way first), you'll then need to select which HTML tags you want it to be applied to.

How to find fonts use any font plugin

Easy Google Fonts plugin

The Easy Google Fonts plugin installs a wide variety of Google fonts on your site. And it will put them right into the theme customizer, so you don't need to code anything on the backend. This is a good option if the font you want is a Google Font.


So that's a wrap on fonts for today. Do you have any favorite fonts that you just can't live without? Let me know in the comments!