Levels and structure for headings

Correct headings makes it easier for all website visitors. A page with clear headings and correct heading levels gives the visitor better overview and users who need aid to access information will have it easier. It will also result in better search hits.

Plan which template fonts should be headings and their level and how they shouldbe used.

Some rules to remember regarding headings:

  • Each page should have a heading (h1).
  • The first heading on a page should be a main heading (h1).
  • Headings should come in the correct order. (i.e. after an h1 there should be one or several h2. If having a sub heading beneath an h2 it should be an h3 and so on)

As an administrator you need to tag the headings with the correct heading level h1-h6. Set up heading levels.

The editors need to be informed that the template fonts are to be used in the correct order. Hide the template fonts that the editors should not have access to. The less choices, the easier to use correct heading levels.

Korrekt rubrikstruktur

Korrekt rubrikstruktur

Observe! Do not forget to have a h1 on the start page as well. You can have several headings tagged as h1, but only one primary.

Heading structure


Check that main headings and sub headings are organized hierarchially.
The first heading on a page must be a main heading (h1) no other heading should be before the h1.
En rubrikstruktur med fel ordning (h1 är inte överst)

En rubrikstruktur med fel ordning (h1 är inte överst)

Headings need to be in the correct order. (that is after an h1 there should be one or several h2. If you make a sub heading beneath h2 then there should be an h3 and so on)
En rubrikstruktur som saknar h1

En rubrikstruktur som saknar h1

En rubrikstruktur som saknar h2

En rubrikstruktur som saknar h2

A tip for accessibility! Create headings with h-element for increased accessibility:
  • h1 indicates it is a main heading
  • h2 that the text is a sub heading
  • h3 that the text is a sub heading to a sub heading and so on.
The hierarchic order i important!

Denna sida publicerades: 2015-05-13

Skriv ut PDF-avsnitt

Hjälpte informationen på den här sidan dig?

Missa inga nya rön, tips och tricks! Prenumerera på insite!

Find us!

SiteVision AB (Headquarter)
Vasagatan 10
702 10 Orebro
Sweden

Info: +46 19-17 30 30
Support: +46 19-17 30 39

Latest Tweets