Selke\u00e4 ja ymm\u00e4rrett\u00e4v\u00e4 otsikkorakenne parantaa tekstin luettavuutta ja tekee rakenteesta selke\u00e4n. Lis\u00e4ksi se helpottaa n\u00e4k\u00f6vammaisten k\u00e4ytt\u00e4jien navigointia verkkosivuilla ja parantaa hakukoneoptimointia.<\/p>\n
Verkkosivua tai mit\u00e4 tahansa tekstidokumenttia teht\u00e4ess\u00e4 on suositeltavaa k\u00e4ytt\u00e4\u00e4 eri otsikkotyylej\u00e4. Pelkk\u00e4 fontin suurentaminen ja lihavoiminen ei siis riit\u00e4. Otsikoille, kuten muillekin elementeille, on annettava semanttinen merkitys.<\/p>\n
Esimerkiksi Microsoft Word -tekstink\u00e4sittelyohjelmassa eri tekstityylit ja samalla my\u00f6s otsikkotasot voidaan valita ylh\u00e4\u00e4ll\u00e4 olevasta nauhavalikosta.<\/p>\n
HTML-kieless\u00e4 otsikot ja niiden tasot voidaan merkata <H1>-, <H2>- ja <H3>-koodeilla, jotka osoittavat mink\u00e4 tasoisesta otsikosta on kysymys.<\/p>\n
Sivun p\u00e4\u00e4sis\u00e4ll\u00f6n tulisi yleens\u00e4 alkaa ensimm\u00e4isen tason (<H1>) otsikolla. P\u00e4\u00e4sis\u00e4ll\u00f6ss\u00e4 ei normaalisti tule olla muita ensimm\u00e4isen tason otsikoita.<\/p>\n
Ensimm\u00e4isen tason otsikoita voi kuitenkin olla yhdess\u00e4 sivun\u00e4kym\u00e4ss\u00e4 useampia, jos esimerkiksi sek\u00e4 p\u00e4\u00e4sis\u00e4ll\u00f6ss\u00e4 ett\u00e4 alaviitteess\u00e4 (footer) k\u00e4ytet\u00e4\u00e4n ensimm\u00e4isen tason otsikoita.<\/p>\n
Otsikkotasoja ei saisi j\u00e4tt\u00e4\u00e4 v\u00e4list\u00e4. Toisin sanoen jos k\u00e4ytt\u00e4\u00e4 otsikkoa <H1>, sit\u00e4 tulisi seurata aina <H2> eik\u00e4 <H3>.<\/p>\n
Oikeaoppisesti toteutettu otsikkorakenne auttaa ruudunlukuohjelman k\u00e4ytt\u00e4ji\u00e4 selaamaan sivua otsikkojen perusteella. Navigoiminen on nopeampaa, kun k\u00e4ytt\u00e4j\u00e4n ei tarvitse lukea sivun kaikkea sis\u00e4lt\u00f6\u00e4.<\/p>\n
Otsikkorakennetta voi ajatella sivun sis\u00e4llysluettelona. T\u00e4m\u00e4 saattaa helpottaa otsikkorakenteen tekemist\u00e4.<\/p>\n\n","protected":false},"excerpt":{"rendered":"
Selke\u00e4 ja ymm\u00e4rrett\u00e4v\u00e4 otsikkorakenne parantaa tekstin luettavuutta ja tekee rakenteesta selke\u00e4n. Lis\u00e4ksi se helpottaa n\u00e4k\u00f6vammaisten k\u00e4ytt\u00e4jien navigointia verkkosivuilla ja parantaa hakukoneoptimointia. Verkkosivua tai mit\u00e4 tahansa tekstidokumenttia teht\u00e4ess\u00e4 on suositeltavaa k\u00e4ytt\u00e4\u00e4 eri otsikkotyylej\u00e4. Pelkk\u00e4 fontin suurentaminen ja […]Lue lis\u00e4\u00e4…<\/span><\/p>\n","protected":false},"author":10,"featured_media":0,"parent":134,"menu_order":10,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-283","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/283","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/comments?post=283"}],"version-history":[{"count":0,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/283\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/134"}],"wp:attachment":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/media?parent=283"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}