HTML je skraćenica za HyperText Markup Language i osnova je svake veb strane. Ekstenzija HTML stranice može biti html ili htm. HTML je na samom početku omogućavao kreiranje jednostavnih veb stranica, a nije omogućavao unos grafike i multimedijalnih elemenata.
HTML se neprestano razvijao i razvija. U svakoj novoj verziji pojavljuju se nove funkcionalnosti. Trenutna verzija HTML-a je HTML5 i podržan je u svim novijim veb pregledačima.
Struktura jezika HTML
Osnovni građevni element u HTML-u je tag. Tagovi se pišu unutar oznaka „<” i „>” (bez znakova navoda). Tagovi mogu biti upareni ili neupareni.
Upareni tagovi imaju oznaku za otvaranje i oznaku za zatvaranje tagova:
- Otvaranje tagova:
<ime_taga> - Zatvaranje tagova:
</ime_taga>
Na primer <p> i </p>.
Neupareni tagovi imaju samo jednu oznaku, kojom se tag istovremeno otvara i zatvara: <ime_taga/>.
Na primer <br/> ili <img/>.
HTML jezik nije case sensitive, što znači da se imena tagova mogu pisati i velikim i malim i kombinovanim veličinama slova, ali je preporuka da se koriste mala slova.
Tagovi daju značenje sadržaju koji se nalazi u njima i diktiraju način na koji će ga veb pregledač prikazati.
Kod uparenih tagova funkcija koju tag obavlja počinje od mesta gde je tag otvoren i završava se mestom gde je zatvoren, a sadržaj na koji tag deluje je sadržaj između otvorene i zatvorene oznake tagova. Izvan zatvorenog tagova efekat tog tagova ne postoji.
HTML element je skup otvorenog tagova, njegovog sadržaja i zatvorenog tagova:<ime_taga> sadržaj_elementa </ime_taga>
Na primer, tag <b>, kojim se postiže da se tekst prikaže kao Bold, i koji deluje na tekst „Pera“, u kodu se piše kao element <b>Pera</b>, a u pregledaču prikazuje kao Pera.
Oznake za otvaranje i zatvaranje tagova se u pregledaču ne prikazuju, ali je njihov efekat na sadržaj elementa (u ovom slučaju Bold) postignut.
Atributi u HTML-u
Pored tagova, HTML se strukturno opisuje i atributima. Atribut se piše unutar imena tagova i služi da bliže definiše način delovanja tagova ili opiše tag.
Imena atributa su precizno definisana, kao i to koji atribut se može koristiti sa kojim tagom. U jednom tagu može biti više atributa.
Sintaksa zahteva da nakon definisanja imena atributa postoji operator dodele = (znak jednako) i unutar znakova navoda vrednost atributa.
Na primer, atribut align, sa vrednošću left, u tagu <p>, piše se kao:<p align="left">Pera</p>.
Svako ime tagova ima tačno definisan spisak atributa koji se mogu pisati unutar njega.
Ugnežđeni elementi
Već je naglašeno da svaki tag deluje na sadržaj koji se nalazi unutar tog elementa. Taj sadržaj može biti tekst za korisnika, ali može biti i drugi tag.
U slučaju da se kao sadržaj elementa nalazi novi element, kaže se da imamo ugnežđene elemente, i tada svaki od tagova deluje sa svojom funkcijom koju on realizuje.
Tekst na koji deluje više ugnežđenih tagova (tj. elemenata) podvrgava se uticaju svih tih tagova. Treba voditi računa da se kod ugnežđenih elemenata prvo zatvara poslednji otvoreni tag.
Na primer, ako pored tagova <i>, želimo da deluje i tag <b> (boldovanje teksta), pišemo:<i><b>Pera</b></i>
U pregledaču se prikazuje kao: Pera.
Komentari u HTML-u
U opšte pojmove o strukturi jezika treba svrstati i komentare.
Komentari su delovi veb stranice koji se ne interpretiraju, a samim tim i ne prikazuju korisniku. Uloga komentara je lakše snalaženje i navođenje unutar koda.
Sintaksa komentara je:<!-- tekst komentara -->
Tekst komentara može biti u jednom ili više redova.
Osnovna struktura veb strane
Svaka HTML strana počinje <html>, a završava se tagom </html>, čime se ukazuje na početak i kraj primene HTML jezika.
HTML strana ima dva dela:
- Zaglavlje (
head) - Telo (
body)
Zaglavlje se odvaja tagovima <head> i </head>, a telo dokumenta tagovima <body> i </body>.
- Tag
<head>definiše zaglavlje HTML stranice, u kome se nalaze informacije o samom dokumentu (naslov, opis, ključne reči, ime autora itd.). - Tag
<body>je namenjen za pisanje koda koji treba da se prikaže korisniku.
Prva HTML stranica može izgledati ovako:
<!DOCTYPE html>
<html>
<head>
<title>Moja prva veb stranica</title>
</head>
<body>
HTML nije težak!
</body>
</html>
Ovaj kod treba ukucati u bilo kom tekstualnom editoru (preporuka Notepad++) i sačuvati, npr. kao index.html.
Nakon snimanja, operativni sistem će prepoznati da se radi o HTML ekstenziji fajla i automatski će ikonu promeniti u ikonu pregledača.
Postavljanje kodne strane
Problem sa našim jezikom se javlja jer je podrazumevani kodni raspored u tekstualnom editoru i pregledaču engleski.
Ovaj problem se rešava dodavanjem sledeće linije koda u <head> sekciju:
<meta charset="utf-8">
Ova linija koda omogućava ispravan prikaz srpskog ćiriličnog i latiničnog pisma.