Meta oznake v glavi HTML

Oznaka <meta> se zapisuje v glavi HTML dokumenta, torej znotraj elementa <head>. Z njo določimo metapodatke o dokumentu. Ti podatki se praviloma ne prikazujejo kot glavno besedilo spletne strani, uporabljajo pa jih brskalniki, iskalniki in druga orodja.

Meta oznake lahko določajo nabor znakov, opis strani, podatke o avtorju, nastavitve prikaza na mobilnih napravah, samodejno osveževanje strani in druge informacije, ki pomagajo pri razumevanju ali prikazu dokumenta.

Pomni: Meta oznake sodijo v glavo dokumenta. Z njimi ne zapisujemo glavne vsebine strani, ampak podatke o dokumentu.

Osnovna pravila

Oznaka <meta> je zapisana v elementu <head>.
Meta oznake določajo metapodatke o dokumentu.
Pri sodobnih straneh je posebej pomembna oznaka <meta charset="utf-8">.
Na straneh za mobilne naprave pogosto uporabimo tudi oznako viewport.
Meta oznak ne uporabljamo za glavno vsebino dokumenta.

Pozor: Meta oznako refresh uporabljamo previdno. Prepogosto samodejno osveževanje ali preusmerjanje lahko uporabnika zmede in poslabša uporabniško izkušnjo.

Pogoste meta oznake

charset

Ena najpomembnejših meta oznak določa kodiranje znakov dokumenta. Za določitev kodiranja uporabimo atribut charset. Danes najpogosteje uporabimo zapis utf-8, saj podpira zelo širok nabor znakov.

<meta charset="utf-8">

description

Meta podatek description vsebuje kratek opis vsebine spletne strani. Tak opis je lahko uporaben pri predstavitvi strani v rezultatih iskanja ali pri deljenju povezave.

<meta name="description" content="E-gradivo za modul NSA.">

keywords

Meta podatek keywords vsebuje ključne besede, povezane z vsebino strani.

<meta name="keywords" content="splet, HTML, CSS">

Meta oznaka keywords je v preteklosti igrala večjo vlogo. Danes je bistveno pomembneje, da je vsebina strani kakovostna, jasno napisana in smiselno opisana z naslovom ter opisom strani.

author

Meta podatek author določa avtorja ali ustvarjalca dokumenta.

<meta name="author" content="Stanislav Jagodic">

viewport

Na sodobnih spletnih straneh pogosto uporabljamo tudi meta oznako viewport, ki pomaga pri pravilnem prikazu strani na mobilnih napravah. Pri odzivnih straneh pogosto uporabimo zapis width=device-width, initial-scale=1.

<meta name="viewport" content="width=device-width, initial-scale=1">

refresh

Meta oznaka refresh omogoča samodejno osvežitev ali preusmeritev strani po določenem času. Primer preusmeritve je zapis <meta http-equiv="refresh" content="20; URL=page4.html">.

<meta http-equiv="refresh" content="10">

Atributa `name` in `content`

Pri številnih meta oznakah uporabljamo atribut name, ki določa vrsto meta podatka, in atribut content, ki vsebuje njegovo vrednost. Tak zapis uporabimo na primer pri opisu strani, avtorju ali nastavitvi prikaza.

<meta name="description" content="Primer opisa spletne strani.">

Primer meta oznak v glavi HTML dokumenta

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="E-gradivo za modul NSA.">
  <meta name="keywords" content="splet, HTML, CSS, JavaScript">
  <meta name="author" content="Stanislav Jagodic">
  <meta http-equiv="refresh" content="30">
  <title>Meta oznake</title>
</head>
<body>
  <p>V glavi dokumenta so zapisani meta podatki, kot so kodiranje znakov, opis strani, ključne besede, avtor, nastavitev za mobilne naprave in po potrebi osveževanje strani.</p>
</body>
</html>

V glavi dokumenta so zapisani meta podatki, kot so kodiranje znakov, opis strani, ključne besede, avtor, nastavitev za mobilne naprave in po potrebi osveževanje strani.

Zakaj so meta oznake pomembne?

Meta oznake pomagajo pri pravilnem prikazu dokumenta, pri opisu vsebine strani in pri boljši strojni obdelavi dokumenta. Zlasti pomembni sta oznaki za nabor znakov in za prilagoditev prikaza na mobilnih napravah.

Pomni: Med najpogostejšimi in najpomembnejšimi meta oznakami sta <meta charset="utf-8"> in <meta name="viewport" content="width=device-width, initial-scale=1">.

Priporočila

V dokumentu uporabi <meta charset="utf-8">.
Na odzivnih straneh uporabi tudi oznako viewport.
Za opis strani dodaj smiseln description.
Meta oznako refresh uporabljaj samo takrat, ko je to res potrebno.
Meta oznake zapisuj v glavo dokumenta in ne v telo strani.

Pogoste napake

V dokumentu ni določeno pravilno kodiranje znakov.
Meta oznake so zapisane zunaj elementa <head>.
Opis strani je preveč splošen ali ga sploh ni.
Meta oznaka refresh je uporabljena brez jasnega razloga.
Meta oznaki keywords se pripisuje prevelik pomen glede na sodobno rabo.

Nazaj

Naprej