Headings

Traditionally, headings are used in the print world to break text into digestible pieces of information, helping the reader focus on data that may interest them. Headings are used the same way; however, when we talk about headings online, we talk about HTML tags. HTML tags range from Heading 1 <h1> to Heading 6 <h6> and can be found in your visual editor.

The appearance of headings on your site will depend on the theme you are using and can look quite different from site to site. Headings on our site display like this:

H1 is reserved for the page title

H2 is your primary section heading

H3 is your second-level sub-heading

H4 is a third-level sub-heading

H5 is a fourth-level sub-heading

H6 is a (rarely used) fifth-level sub-heading

Headings Are Signposts to Your Content

As you may already be aware, most site users won’t be reading every word in your post. The majority of people only scan a webpage. If they catch a phrase or sentence they like the look of, they carry on reading. Otherwise, they will continue browsing down the page before exiting.

Headings help break the content into helpful junks, pointing the reader toward content that may be interesting or helpful to them. Rather than write paragraph after paragraph of content that may overwhelm your reader, we recommend using brief headings with one or two keywords.

For those interested in how users read content, you might like to check out these posts by Nick Babich, on the Z-shaped and F-shaped reading patterns.

Headings & Search Engines

First and foremost, we feel it’s important to say that you should be writing exciting and high-quality content for your readers, not with the sole purpose of search engine optimization in mind. Don’t be obsessive about writing SEO-only text stuffed with keywords — make sure it’s for the visitor and not just Google!

However, it is worth pointing out that clear and logical headings get you extra SEO brownie points when a search engine scans your page. As you progress down the heading sizes, the less importance a search engine places on that heading. And although titles range from H1 through to H6, you’ll probably only need the first four in most cases.

Text Styles

As we mentioned above, consistency is critical. It may feel tempting to go wild, choosing lots of different text styles and multiple colors, but simplicity is often better. Stick to a few styles and keep it simple. It’s incredible how much more professional your pages will look if there is an underlying pattern.

Important Styling Tips

We’ve put together some quick tips to bear in mind when adding text to your posts or pages:

• Use Unordered or Ordered lists for relatively short lists. Resist the temptation to use them for paragraphs — instead, use the Heading styles.
• Bold and Italic should be used in moderation. Do not use bold as a substitute for heading styles — bold is not particularly important to a search engine.
• You may want to select the blockquote button when adding a quotation — it helps the quotation stand out from the rest of the text on the page.
• Keep text left aligned. You’ll rarely need to center-align text.
• Most themes will highlight links in a different color and with hover properties.

Color Palette

To maintain brand consistency, it is advisable to stick to the colors defined in the color palette below.

Bamboo Colors

Good Luck with your New Site!

From our experience, I hope to have touched upon some of the areas most new site owners struggle with when visually maintaining their new website and provide you with some quick and simple tips to help you get started.