Purple Spider Web Design

Hello, my name is James Cocker,
I'm a freelance web developer & designer,
based in Edinburgh, Scotland.

Website Content Tip 3: Insert Headings to Improve Readability & SEO

11 April 2014 - By James Cocker

This is the third tip in a series of articles about writing and structuring the content on your website.

Breaking up the content on a web page with headings is a very effective way to make it easier for users to locate the information they are looking for, as well as to improve Search Engine Optimisation.

Increased Scan-ability

If there is a lot of text on your page, consider having an introductory sentence or two at the top, insert a heading to label your first block of content, then give each further block of content its own heading.

headings before after

Not only does this help to break up the page, making it more scannable. But a user looking for a specific piece of information can scan over the headings to find the section they require.

Heading Levels

Depending on your website configuration, it will be possible to choose from different levels of heading, e.g. Heading 1, Heading 2, Heading 3, etc. You may not have the option to insert a Heading 1 into the content of a page, as this level is usually reserved for the main page name that automatically appears at the top of the page.

Make sure you stick to the heading level hierarchy, and don't miss out any levels. For example, if you insert a Heading 2, and wish to add a smaller heading within that section, use a Heading 3, don't jump straight to a Heading 4. As well as helping to keep the style consistent among pages, this also improves accessibility, for example it allows website screen readers used by the visually impaired to better understand the hierarchy of your page content.

Extra Tip: Horizontal Rules

Depending upon the content of your headed section, inserting a horizontal rule immediately before a heading can really help to further outline the section, making it even more obvious where each section of the page starts and finishes, therefore further increasing the scan-ability of the page.

Improved Search Engine Optimisation

As well as improving the usability of your website for humans, adding headings to your pages also does wonders for your Search Engine Optimisation (SEO). This means your website is more likely to appear higher up in search results.

The reason for this, is that search engines look at the headings on web pages and assume that the page content is highly relevant to the phrases mentioned in the headings. So bear this in mind when thinking about the text to use as your headings.

Creating Headings in the SilverStripe CMS

When you enter text onto a page in the SilverStripe Content Management System, by default it has the format of Paragraph. To change the format of a piece of text to a Heading:

  1. First, position the text on its own line, by inserting a paragraph break (by pressing enter) before and after it.
  2. Select the text, by clicking and dragging over it.
  3. Then click on the Format dropdown in the toolbar. It will probably currently say Paragraph.
  4. From the dropdown select a Heading level, such as Heading 2, and the text will update to display as a heading, complete with the appropriate styles and spacing.

SilverStripe headings

Subscribe to my free website content tips newsletter, to receive new tips straight to your inbox. I'll only send you 1 or 2 e-mails per month, and I will never send you any unrelated content.

Purple Spider