Suunnittele sivun otsikkorakenne huolellisesti

Selkeä ja ymmärrettävä otsikkorakenne parantaa tekstin luettavuutta ja tekee rakenteesta selkeän. Lisäksi se helpottaa näkövammaisten käyttäjien navigointia verkkosivuilla ja parantaa hakukoneoptimointia.

Verkkosivua tai mitä tahansa tekstidokumenttia tehtäessä on suositeltavaa käyttää eri otsikkotyylejä. Pelkkä fontin suurentaminen ja lihavoiminen ei siis riitä. Otsikoille, kuten muillekin elementeille, on annettava semanttinen merkitys.

Esimerkiksi Microsoft Word -tekstinkäsittelyohjelmassa eri tekstityylit ja samalla myös otsikkotasot voidaan valita ylhäällä olevasta nauhavalikosta.

HTML-kielessä otsikot ja niiden tasot voidaan merkata <H1>-, <H2>- ja <H3>-koodeilla, jotka osoittavat minkä tasoisesta otsikosta on kysymys.

Sivun pääsisällön tulisi yleensä alkaa ensimmäisen tason (<H1>) otsikolla. Pääsisällössä ei normaalisti tule olla muita ensimmäisen tason otsikoita.

Ensimmäisen tason otsikoita voi kuitenkin olla yhdessä sivunäkymässä useampia, jos esimerkiksi sekä pääsisällössä että alaviitteessä (footer) käytetään ensimmäisen tason otsikoita.

Otsikkotasoja ei saisi jättää välistä. Toisin sanoen jos käyttää otsikkoa <H1>, sitä tulisi seurata aina <H2> eikä <H3>.

Oikeaoppisesti toteutettu otsikkorakenne auttaa ruudunlukuohjelman käyttäjiä selaamaan sivua otsikkojen perusteella. Navigoiminen on nopeampaa, kun käyttäjän ei tarvitse lukea sivun kaikkea sisältöä.

Otsikkorakennetta voi ajatella sivun sisällysluettelona. Tämä saattaa helpottaa otsikkorakenteen tekemistä.