Your website type or fonts are important for your overall design and branding, but your headings are important for Search Engine Optimization (SEO). It helps search engines (in other words Google) understand what is important on a website page.

* This post contains affiliate links, as noted with an asterik.* I may receive a small commission for any purchases you make through these links at no additional cost to you, of course.

Here are some quick tips to help you easily boost your website SEO through type hierarchy.

But first, let’s start with your website type …

Type Suite

To begin with, you should have a Type Suite. A Type Suite is the combination of your fonts that create a type hierarchy in your brand. Your website fonts should match or compliment your branding.

How to choose the fonts for your Type Suite:

Choose 1 - 3 fonts. Be minimalistic. Less is more! A good rule of thumb is one font for Headings and one font for Body copy. When choosing fonts for your website, a go-to resource for free web fonts is Google Fonts. When you find your favorite Google Font, you also have the option to choose from suggested font pairings. Other good resources for finding fonts that pair well together are fontpair.co and fontjoy.com.
Squarespace also has recommended font pairings. Within the Site Styles on your site, you can go to Fonts and choose a Font Pack based on all Serifs, San Serifs, or a mix of both. Squarespace includes an awesome variety of built-in fonts sourced from Adobe and Google Fonts.

Type Hierarchy

A Type Hierarchy is how your type is displayed on your site from most important headlines on down. This Type Hierarchy consists of your Headings, Subheadings, and Body copy.

Consider that most people will skim through your site so it's important to have short and clear messages that stand out. For more on website copywriting, read about How strategic website copywriting attracts and connects you with your audience.

HEADING

The most important copy on your page is your Heading. This should be a prominent, larger font and should be used near or at the top. On your Home page, this should be a strong and purposeful headline. This is what excites your dream customer or client to search your site further and then seek out that fabulous thing you have to offer!

Note: Your main Heading 1 should be used only once on a page. This is most important for SEO since this is what's read (like by Google) to understand what the page content is about.

Tip: For the sake of design, if you would like to have more than one heading in the same size as your big Heading 1, you can make your Heading 2 size the same as Heading 1. This won’t affect SEO but will give you the option to have more than one heading in a larger font size. (This works well in Squarespace 7.1 since you have up to 4 heading sizes to work with.)

SUBHEAD

Your Subhead is smaller in font size than your Heading. The Subhead is typically below the Heading, but can also be used above. The Subhead supports the Heading copy.

BODY

Your body copy should be in an easily readable font. This is where you will have more information in the form of (short) paragraphs. (Remember your audience will most likely be skimming through so consider short and sweet in length!)

Note: In your body text, use ALL CAPS sparingly! It is okay to use in short titles or even short sentences to make a standout point. But not more and never a full paragraph! It's harder to read and is almost like YELLING at your reader!

On Another Note: It is fun to use display fonts, such as fancy script (or cursive) styles. Please also use these sparingly! They are called display fonts for that purpose — just to be displayed as a design element.

Setting up Site Styles on SQUARESPACE 7.0 for your type

For Heading styles on Squarespace 7.0, there is a Heading 1 (h1), Heading 2 (h2), and Heading 3 (h3). Heading 1 would be your main Heading that should stand out above the others. This is the heading style that Google will use to understand the content of your page. This is why you should only use an h1 style once on each page. Normal would be your body copy.

Setting up Site Styles on SQUARESPACE 7.1 for your type

For Heading styles on Squarespace 7.1, there are four Headings — Heading 1 (h1), Heading 2 (h2), Heading 3 (h3), and Heading 4 (h4). Again, Heading 1 would be your main Heading that should stand out above the others. This is the heading style that Google will use to understand the content of your page. This is why you should only use an h1 style once on each page.

Body copy on Squarespace 7.1 is slightly different than on Squarespace 7.0. Instead of just one Normal Body copy style, there are three choices created as Paragraphs — Paragraph 1 (p1), Paragraph 2 (p2), and Paragraph 3 (p3).

To learn more about formatting and styling your fonts on your Squarespace website, read more here on Squarespace: Formatting and styling text

For my type styles on 7.1, I am using a custom font for my Heading styles (Heading 1 - 4). This custom font is HV Clio by Harmonious Visuals. My Body copy (Normal and Links) is the minimalistic and modern San Serif Google Font Montserrat that is available to choose from in the Squarespace fonts.

My fun and fancy script font is also a custom font, Modena Script* by Jen Wagner Co.*
Use code TARYNMERCEDES for 15% off

If you’d like to add a custom font, see this post: How to add your favorite custom brand font to your Squarespace website