HTML-otsikoiden suurin ongelma on, että niitä ei aina käytetä oikein. Otsikoita tulee käyttää sivun sisällön jäsentämiseen, mutta usein niitä käytetään sen sijaan muotoilutarkoituksiin. Tämä voi johtaa hämmennykseen ja huonoon käytettävyyteen käyttäjille, jotka luottavat näytönlukuohjelmiin tai muihin aputekniikoihin. Lisäksi, jos otsikot eivät ole kunnolla sisäkkäisiä tärkeysjärjestyksessä, hakukoneiden on vaikea indeksoida sivun sisältöä tarkasti.
Nimike 1
Nimike 2
Nimike 3
Nimike 4
Nimike 5
Nimike 6
1. Tämä rivi luo otsikko 1 -elementin, joka on suurin otsikon koko:
Nimike 1
2. Tämä rivi luo otsikko 2 -elementin, joka on yhtä kokoa pienempi kuin ensimmäinen:
Nimike 2
3. Tämä rivi luo otsikon 3 elementin, joka on yhtä kokoa pienempi kuin toinen:
Nimike 3
4. Tämä rivi luo otsikon 4 elementin, joka on yhtä kokoa pienempi kuin kolmas:
Nimike 4
5. Tämä rivi luo otsikko 5 -elementin, joka on yhtä kokoa pienempi kuin neljäs:
Nimike 5
6. Tämä rivi luo otsikkoelementin 6, joka on pienin kaikista otsikoista:
Nimike 6
HTML-otsikotHTML-otsikoita käytetään määrittämään verkkosivun rakenne ja hierarkia. Ne vaihtelevat
että
, kanssa
on tärkein otsikko ja
on vähiten tärkeä. Otsikoita tulisi käyttää sisällön osioiden jakamiseen, jotta lukijoiden on helpompi skannata ja ymmärtää sisältöä. Lisäksi hakukoneet käyttävät otsikoita ymmärtääkseen paremmin sivun sisältöä, joten niiden oikea käyttö voi parantaa hakukoneoptimointia.
Otsikon tasot
HTML:ssä on kuusi tasoa otsikoita, joita voidaan käyttää sisällön jäsentämiseen. Nämä otsikot vaihtelevat
(tärkein) siihen
(vähiten tärkeä). Kunkin otsikon tekstin koon määrittää selain, mutta yleisesti ottaen
on suurin ja
on pienin.
Otsikot ovat tärkeitä saavutettavuuden ja hakukoneoptimoinnin kannalta, koska ne auttavat käyttäjiä ja hakukoneita ymmärtämään sivun rakenteen. Niitä tulisi käyttää luomaan sivulle hierarkia, jotta käyttäjät voivat nopeasti skannata ja löytää etsimänsä.
Miksi HTML:ssä on vain 6 otsikkoa?
HTML:ssä on vain 6 otsikkoa HTML:ssä, koska se on suunniteltu tarjoamaan verkkosivuille rakenne ja merkitys. Otsikoiden avulla luodaan sisältöhierarkia, jonka avulla käyttäjät ymmärtävät sivun rakenteen ja löytävät nopeasti etsimänsä tiedon. Kuusi otsikkoa ovat h1, h2, h3, h4, h5 ja h6. Jokaisella otsikolla on erilainen tärkeysaste, joista tärkein on h1-tunniste ja vähiten tärkeä on h6-tunniste. Näin verkkokehittäjät voivat luoda selkeän hierarkian sisällöstä sivuilleen.
H1 H2 H3 -tunnisteiden käyttäminen HTML:ssä
H1-, H2- ja H3-tageja käytetään otsikoiden luomiseen HTML:ssä.
H1: H1-tunniste on korkeimman tason otsikko, ja sitä tulee käyttää sivun pääotsikona. Sitä tulee käyttää säästeliäästi ja vain kerran sivulla.
H2: H2-tunniste on toiseksi korkein otsikko, ja sitä tulisi käyttää sivun pääsisällön alaotsikoissa. Sitä voidaan käyttää useita kertoja sivulla.
H3: H3-tunniste on kolmanneksi korkein otsikko, ja sitä tulisi käyttää alaotsikoissa sivun sisällön osissa. Sitä voidaan käyttää myös useita kertoja sivulla.
Kun käytät näitä tunnisteita, on tärkeää muistaa, että ne ovat hierarkkisia. Tämä tarkoittaa, että H2:n tulee aina tulla H1:n jälkeen, H3:n H2:n jälkeen jne. Tämä auttaa luomaan sisällöllesi loogisen rakenteen, joka helpottaa käyttäjien navigointia verkkosivustollasi tai verkkosivuillasi.
