HTML prvi koraci - lekcija 1 - Tagovi h1-h6, p, strong

26/05/2025, by Ivan

O tome kako kreirati HTML dokumente pročitajte u HTML prvi koraci.

U prethodnoj lekciji smo kreirali naš prvi HTML dokument.

<html>
  <head>
    <title>Moj prvi HTML dokument</title>
  </head>
  <body>
    HTML moji prvi koraci
  </body>
</html>

U ovoj lekciji ćemo popuniti naš dokument tekstom. Dodajemo najrasprostranjeniji tag u HTML-u, tag . Ne zaboravite da se tagovi pišu na latinici i da to nije ruska slova "er". Tag je skraćenica od reči paragraph (pasus) i označava pasus teksta.

Sav tekst u HTML-u mora biti unutar nekog taga, zato hajde da u našem dokumentu tekst obavijemo tagom :

<html>
  <head>
    <title>Moj prvi HTML dokument</title>
  </head>
  <body>
    <p>HTML moji prvi koraci</p>
  </body>
</html>

Vizuelno naš dokument nije promenjen, ali struktura HTML dokumenta je sada pravilnija. Takođe možemo dodati još nekoliko pasusa teksta:

<html>
  <head>
    <title>Moj prvi HTML dokument</title>
  </head>
  <body>
    <p>HTML moji prvi koraci</p>
    <p>Svaki lovac želi</p>
    <p>znati gde</p>
    <p>sedí fazan</p>
  </body>
</html>

Vidite, sve je prilično jednostavno. Tagovi p se nalaze na istom nivou.

Dodajmo sada naslov u naš dokument. Zašto su naslovi potrebni u HTML-u? Pre svega da strukturiramo tekst, jer je strukturiran tekst lakše i brže čitati i razumeti. Drugo, naslovi su veoma važni za SEO - optimizaciju sajta. Zato nemojte zanemarivati naslove u tekstu.

Za naslove koristimo tagove h1, h2, h3, h4, h5, h6. Broj iza h (header - naslov) označava važnost tog naslova. Naslov h1 treba da bude samo jedan na stranici i on označava o čemu je ta HTML stranica. Nakon h1 mogući su h2 i h3, zatim h4 i tako dalje. Obično je šest nivoa ugnježdenja naslova sasvim dovoljno.

<html>
  <head>
    <title>Moj prvi HTML dokument</title>
  </head>
  <body>
    <h1>Moj prvi HTML dokument</h1><br>    
    <h2>Moji prvi koraci</h2>
    <p>HTML moji prvi koraci</p>
    <h3>Još jedan korak</h3><br>    
    <h2>Tako se kaže</h2>
    <p>Svaki lovac želi</p>
    <p>znati gde</p>
    <p>sedí fazan</p>
  </body>
</html>

Verovatno ste primetili da veličina taga h zavisi od broja iza slova. Tako pregledač pokazuje koji je naslov važniji od sledećeg.

Još jedna osobina tagova h1-h6 je što su podebljani. Tekst možemo podebljati i pomoću taga :

<html>
  <head>
    <title>Moj prvi HTML dokument</title>
  </head>
  <body>   
    <h1>Moj prvi HTML dokument</h1>
    <h2>Moji prvi koraci</h2>
    <p>HTML moji prvi koraci</p>
    <h3>Još jedan korak</h3>
    <h2>Tako se kaže</h2>
    <p>Svaki <strong>lovac</strong> želi</p>
    <p>znati gde</p>
    <p>sedí fazan</p>
  </body>
</html>

Obratite pažnju da za podebljavanje teksta koristimo tag strong. Nije dozvoljeno koristiti h1-h6 unutar taga p! Zapamtite ovo, korišćenje h1-h6 unutar p taga može ozbiljno narušiti pozicije sajta u Google pretraživaču.

Zapamtimo, pravilno je ovako:

<p>Veoma <strong>podebljan</strong> tekst</p>

A ovako je veoma loše:

<p><h3>nemojte</h3> tako raditi!</p>

Mislim da sada već možete dodavati onoliko teksta na stranicu koliko želite i podebljavati ga. Najvažnije je da to radite pravilno.

Dodatni tipovi blokova (EBT) - Novo iskustvo rada sa Layout Builder-om❗

❗Dodatni tipovi pasusa (EPT) – Novo iskustvo rada sa pasusima

HTML prvi koraci - lekcija 1 - Tagovi h1-h6, p, strong