Dokumentin pää voi sisältää metatageja, joista monet ovat näkymättömiä käyttäjälle selainikkunassa. Siksi tulevissa esimerkeissä et näe mitään näkyvää sisältöä. Nämä tagit tallentavat metatietoja sivusta.

Sivun otsikko

Teksti <title>-tagin sisällä näytetään selaimen välilehdessä. Otsikon tulisi olla ytimekäs sivun kuvaus ja sen tulisi olla enintään 60 merkkiä pitkä.

Tämän koodin avulla voit saavuttaa tällaisen ulkoasun verkkosivustolla. Selainvälilehdessä näet täsmälleen saman tekstin, joka on suljettu <title>-tagin sisään (valkoinen kehys kuvassa).

Metadata

<meta>-tagi sisältää tietoa selaimille ja hakukoneille: dokumentin koodaus, tiedonsiirto ja paljon muuta. Meta-tageilla voi olla monia attribuutteja, sillä ne kaikki välittävät erilaista tietoa. Tärkein on sivun koodaus. Se auttaa selainta näyttämään tekstin oikein. Jos koodausta ei ole määritetty, selain saattaa näyttää mojibakea merkkien sijaan.

Meta-tagin attribuuttien merkitys

• name: ominaisuuden nimi voi olla mikä tahansa sana tai lause, mutta verkkoselaimet odottavat yleensä arvoa, jonka ne tunnistavat ja jota ne voivat käyttää toiminnon suorittamiseen. Esimerkki olisi <meta name="author" content="name"> sivun tekijän ilmoittamiseksi;

• content: määrittää ominaisuuden arvon. Esimerkki olisi <meta name="language" content="english"> sivun tekstikielen määrittämiseksi;

• http-equiv: tarkoittaa HTTP-vastaavuutta, ja sitä käytetään simuloimaan HTTP-vastausotsikoita. Tämä on harvinaista nähdä. Esimerkki olisi <meta http-equiv="refresh" content="30"> kertomaan selaimelle, että sivu päivitetään 30 minuutin välein.

Perus meta-tagit SEO:n parantamiseksi

• <meta name="description"/>: määrittää verkkosivun lyhyen kuvauksen;

• <meta name="author" />: määrittää verkkosivun tekijän;

• <meta name="language"/>: määrittää verkkosivun kielen;

• <meta name="robots"/>: kertoo hakukoneille, miten indeksoida tai ryömiä verkkosivua;

• <meta name="googlebot" content="notranslate"/>: ilmoittaa Googlelle, ettei tarjoa automaattisia käännöksiä verkkosivusta;

• <meta name="copyright" content="Copyright 2024"/>: määrittää verkkosivun tekijänoikeudet.