Načrtovanje in razvoj spletnih aplikacij

Uvod v HTML?

HTML je okrajšava za HyperText Markup Language in je označevalni jezik za izdelavo spletnih dokumentov. Z njim določimo strukturo in pomen vsebine, na primer naslove, odstavke, sezname, povezave, slike, tabele in obrazce. Za videz strani običajno uporabljamo CSS, za interaktivnost pa JavaScript.

Pomni: Datoteka HTML je navadna besedilna datoteka. Brskalnik iz njene vsebine sestavi in prikaže spletni dokument.

Osnovna pravila

  • HTML datoteka je navadna besedilna datoteka.
  • Datoteke HTML imajo praviloma končnico .html, lahko pa tudi .htm.
  • Elementi HTML so zapisani z oznakami v špičastih oklepajih.
  • Mnogi elementi uporabljajo začetno in končno oznako.
  • Nekateri elementi so prazni in nimajo zaključne oznake z vsebino med njima.
  • Elementi so lahko gnezdeni, pri čemer mora biti zapiranje oznak pravilno urejeno.
  • HTML dokument pišemo v urejevalniku, rezultat pa preverjamo v brskalniku.

Urejevalnik HTML in brskalnik

Urejevalnik uporabljamo za pisanje in spreminjanje izvorne kode, brskalnik pa za prikaz spletnega dokumenta. Urejevalnik in brskalnik zato nimata iste naloge.

Orodje Glavna naloga
urejevalnik pisanje in urejanje kode HTML
brskalnik prikaz in obdelava dokumenta HTML

Oznake v paru in prazne oznake

Nekateri elementi imajo začetno in končno oznako, na primer <p> in </p>. Drugi elementi so prazni, zato praviloma nimajo vsebine med začetkom in koncem, na primer <br> ali <img>.

Vrsta zapisa Primer
oznaka v paru <p>Besedilo</p>
prazna oznaka <br>

Pozor: Pri gnezdenju oznak morajo biti oznake pravilno zaprte. Če se element odpre znotraj drugega elementa, mora biti tudi zaprt pred zaključkom zunanjega elementa.

Datoteka HTML

Datoteka HTML je običajna besedilna datoteka, ki jo lahko odpremo v različnih urejevalnikih besedila ali kode. Najpogosteje uporabljamo končnico .html, v starejših primerih pa lahko srečamo tudi končnico .htm.

<!doctype html>
<html lang="sl">
<head>
   <meta charset="utf-8">
   <title>Moja prva stran</title>
</head>
<body>
   <p>Pozdravljen svet!</p>
</body>
</html>

Pri delu z datoteko je pomembno, da po spremembi kodo shranimo, nato pa dokument ponovno naložimo v brskalniku. Tako lahko preverimo, ali se spremembe prikažejo tako, kot smo pričakovali.

Ogled izvorne kode

Izvorno kodo strani si lahko ogledamo tudi v brskalniku. To je uporabno pri učenju, pri preverjanju zgradbe dokumenta in pri primerjanju lastne kode s prikazom v brskalniku.

HTML koda spletne strani

Primer ogleda izvorne kode spletne strani

Priporočila

  • Za datoteke praviloma uporabljaj končnico .html.
  • Kodo zapisuj pregledno in z ustreznimi zamiki.
  • Elemente uporabljaj glede na njihov pomen in ne le glede na videz.
  • Po spremembi datoteko shrani in nato preveri rezultat v brskalniku.
  • Pri gnezdenju vedno preveri, ali so oznake pravilno odprte in zaprte.
  • Za pisanje kode uporabljaj urejevalnik, ki pomaga pri preglednosti in označevanju sintakse.

Pomni: Brskalnik ne prikazuje izvorne kode kot navadnega besedila, ampak jo obdela in na njeni osnovi sestavi spletni dokument.

Pogoste napake

  • Datoteka ni shranjena z ustrezno končnico .html ali .htm.
  • Oznake niso pravilno zaprte ali so nepravilno vgnezdene.
  • Urejevalnik in brskalnik se obravnavata kot isto orodje, čeprav imata različni nalogi.
  • Po spremembi kode datoteka ni shranjena, zato se spremembe v brskalniku ne pokažejo.
  • HTML elementi se uporabljajo predvsem zaradi videza namesto zaradi pomena vsebine.
  • Pri pregledu dokumenta se ne preveri, ali je izvorna koda dovolj pregledna in urejena.