Choosing the best fonts for your site

Finding the perfect fonts is both an art and a science, and the right fonts can really help your site stand out from the noise of a billion websites online today.

The 3 Big Font Mistakes

Let's kick off with the 3 big font mistakes that you need to avoid at all costs.

If you make these mistakes, people will land on your site and something will feel slightly “off” to them, whether they consciously know the reason or not. And because of that, they’ll be much less inclined to want to do business with you.

Here they are:

  • Using too many fonts. This is a mistake that creative people make all the time. The fact is that online, more fonts equal confusion not creativity. You need just 4 fonts for your entire site -- a headline font, a body text font, a button font (which is normally the same as your body text font), and another font for special occasions, or to draw attention.
  • Using fonts that don’t match your brand. If you’re a law firm, you wouldn’t use a flowy, spiritual-looking font. And similarly, if you’re a healer, you probably wouldn’t use really traditional blocky fonts that a bank might use.
  • Using too many font sizes. In our experience, 6 headline sizes and 3 body font sizes give you 9 font sizes in total -- all of the flexibility you need to build a professional website that positions you well. In case you think that’s not a lot, just take a look at Amazon. It’s got a billion pages, but only 6 headline and 3 body text styles. So it’s not about having a hundred sizes of text -- it’s about using a great selection of them, consistently.

How to change your fonts in Heroic

Your Heroic starter site came with a beautiful font-palette already built in for you to use, so that’s one thing you don’t have to worry about. Your fonts are already beautiful. But what if one day you decide that you want to change things up and try some different fonts?

With any other platform, it’s a long, tedious and time-consuming process. Hours of work.

But with Heroic, all I have to do is go to the Global Fonts page, and adjust the font there, and then the font adjustment just happens everywhere.

  • Go to Global Styles
  • Click on Header Styles
  • Adjust your headline properties as you like. All changes made here will be reflected across your entire site

Font Pairings

If you're not sure which fonts to use, try our new Font Pairings feature. Simply click Global Styles in the left panel and look for Font Pairings at the bottom of the panel.

Here, you'll choose from our crafted Header and Paragraph pairings to instantly give your site a well-designed look and feel.

The 6 Global Headline Styles and What They're Used For

Website headlines come in six main sizes.

The largest (called "H1") is reserved for single use on any given page and gives Google the biggest clue about what to expect from a page. The next size down (called "H2") should be used as a sub-headline throughout your page, to indicate different sections or ideas.

The next size down (called "H3") is usually reserved for the rare case where a sub-sub-headline or sub-section divider is needed to help format and organize any given section.

The next three, H4, H5 and H6 are rarely used except for reference websites that need to go into many layers of hierarchy.

On this page you're able to control the format of any of your headlines throughout your entire site.

Making a "one-off" font or size change to a piece of text

We don't recommend making a headline or a text element a different size or font than your Global Font Styles, because consistent (and limited) font styles across your site help limit confusion, enhance your site's performance, and make your site look much more professional.

But sometimes you need to make a "one-off" update. For example, you might have a landing page that requires much larger text than the rest of your site, so it doesn't make sense to have that headline size as part of your Global Styles.

Or you might have an oversized headline on your home page, but nowhere else. Again, it might not make sense to have that headline size as part of your Global Font Styles.

If you need to make one piece of text in particular a different size or style than your Global Styles, here's how to do that.

  • Select the text you wish to update
  • Click the A icon
  • Adjust your font or size as desired

Lots of people found these next topics pretty useful...

NEW: Can we do the work for you?

If you're like most entrepreneurs, you have a million projects in your head, with no way to get them all done. As a result, you feel stalled and frustrated.

You've tried doing it all yourself, but you know it's unsustainable, and a one way ticket to burnout and overwhelm.

You don't yet have the resources to hire your own team of designers and developers, so you feel stuck, going around in circles.

If you resonate, then relax, because we're here to help.

Our in-house tech, design & web team is ready to help, and available for almost anything. (Seriously!)

We'll take all of the tasks you've been collecting, and make them happen for you quickly and efficiently in the background, leaving you free to focus on what you do best.

And you won't pay through the nose either -- it's available for an incredibly low 5-hour "done for you" package -- it's just $200 for access to our in-house, highly-trained team of tech and design professionals. Best of all, the time never expires and you can use it as quickly or as slowly as you like.

Grab your 5-hour 'done for you' package here and let's get your business moving again!

Creating Pages

Pages are the heart of your site, and what you can build in Heroic is simple unmatched. Here's all the support you need to get started.

View this category

My Account

Got questions about how to manage your account? We're compiling them all here. If we missed anything, let us know and we'll add it.

View this category

Integrating

Our goal is to integrate with every 3rd party platform out there. Here's what we have currently!

View this category

Blogging

Heroic comes with a full featured, yet simple-to-use blogging platform that allows virtually anyone to get bloggin'...

View this category

Popups

Normally popups are hard to create, add to your site, and integrate with 3rd party platforms. Not here :)

View this category

Fonts & Colors

Heroic's global font & color system keeps everything looking great, and makes editing FAST!

View this category

Domains

Here's how to connect your site with your custom domain

View this category

Conversion U

Some our best articles on copywriting, design, branding and more!

View this category

Random Stuff

A home for articles that don't seem to fit anywhere else. Give 'em some love?

View this category

Trainings & Courses

Our expertly curated collection of education and training...

View this category

Recommended Tools

Here are the 3rd party tools that'll make life easier as an online entrepreneur!

View this category

105