HTML/CSS za poetnike #1 - Uvod u HTMLU sledeoj seriji lekcija potrudiu se da apsolutnim poetnicima na najlaki mogui nain opiem izradu jednostavnog web sajta. Za izradu sajta pomou ovih lekcija bie vam potrebna samo dobra volja i jedan program za obradu teksta kao to je Notepad, mada preporuujem naprednije programe kao to jeNotepad++za Windows korisnike iGeanyza korisnike Linux sistema. Naravno bie vam potreban i internet pretraiva da bi mogli da pogledate rezultate vaeg rada. Pretraivai koje ja preporuujem suFirefoxiOpera.Poto izrada svake web stranice kree sa izradom HTML dokumenta i ja u da krenem sa HTML-om.

ta je HTML?

HTML je skraenica od Hyper Text Markup Language, to nam govori da HTML nije programski jezik, ve jezik oznaka (eng. Markup - Oznaka). Da pojasnimo, HTML koristi oznake (tagove) da opie razliite elemente internet stranice. Na primer, HTML oznaka govori da se radi o paragrafu teksta, dok oznaka predstavlja link.

Pisanje HTML tagova (oznaka)

HTML tagovi se piu unutar znakovai postoje otvarajui i zatvarajui tagovi.Otvarajui tagima ulogu da oznai poetak nekog elementa web stranice, dokzatvarajui tagoznaava kraj istog elementa. Otvarajui tag takoe moe da sadri i neke dodatne parametre elementa ali o tome emo kasnije. Sada je najbolje da vidimo jedan primer elementa web stranice. Neka to bude paragraf:

Ovo je paragraf.

predstavlja otvarajui tag paragrafa, dok je zatvarajui tag istog paragrafa. Kao to vidite otvarajui i zatvarajui tagovi se razlikuju po tome to zatvarajui imaju znak / ispred imena taga. Primeri tagova su jo i ..., ..., ... i tako dalje. Postoje i izuzeci koji nemaju zatvarajui tag ali sa njima emo se upoznati kasnije.HTML elementi mogu se usaivati jedan u drugi i pri tome se mora voditi rauna redosledu zatvaranja elemenata. Primer:

Pravilno:Ovo je paragraf unutar div elementa

Nepravilno:Ovo je paragraf unutar div elementa

Kao to vidite kada se jedan element nalazi unutar drugog, treba da bude upisan unutar istog kompletno, zajedno sa zatvarajuim tagom. To znai da se elementi zatvaraju suprotnim redosledom od redosleda otvaranja.Otvarajui i zatvarajui tagovi ne moraju da stoje u istom redu i broj praznih redova izmeu tagova i unutar tagova nema nikakvog efekta na izgled web stranice. Na primer:

Ovo je paragraf.

Je isto to i:

Ovo je paragraf

Da rezimiramo, u ovoj lekciji saznali smo ta je HTML i ta su HTML tagovi (oznake). Takoe smo nauili neka pravila pisanja HTML tagova. Usledeoj lekcijipoeemo sa izradom prvog HTML dokumenta i u hodu emo se upoznavati sa nekim HTML tagovima.

HTML/CSS za poetnike #2 - Struktura HTML dokumentaUprethodnoj lekcijiupoznali smo se sa HTML-om i nauili osnovnu sintaksu pisanja HTML tagova. U ovoj lekciji videemo koji su to elementi koje svaka HTML stranica mora da sadri i poeemo sa izradom prvog HTML dokumenta naeg web sajta.

Struktura HTML dokumenta

Sadraj svakog HTML dokumenta nalazi se izmeu...tagova. Skoro sve to je izvan ovih tagova niti se prikazuje niti ima bilo kakav uticaj na web stranicu. Kaem skoro sve jer postoji jedan izuzetak i to je takozvana doctype deklaracija koja se pie na samom poetku dokumenta i izgleda ovako:

Doctype deklaracija u sutini i nije HTML tag ve instrukcija internet pretraivau koja mu govori o kakvom se dokumentu radi i nema zatvarajui tag. Primer deklaracije koju sam ja naveo govori pretraivau da se ispod nje nalazi HTML5 dokument. Za HTML4 postoje tri tipa deklaracija i jedna od njih izgleda ovako:

o ovome moete proitatiOVDE.Unutar ... tagova svaki HTML dokument sadriglavuitelo. Glava HTML dokumenta se nalazi izmeu...tagova, dok se telo nalazi unutar...tagova. Glava HTML dokumenta se ne prikazuje na samoj web stranici ali sadri neke bitne parametre sa kojima emo se upoznavati u hodu dok je telo sama web stranica koju mi vidimo pomou internet pretraivaa.Da bi vam sve bilo jasnije poeemo sa samom izradom dokumenta.

Poetak izrade web sajta

Za poetak napravite jedan folder na vaem raunaru u kome ete smetati dokumente. Zatim otvorite program za obradu teksta (Notepad++, Notepad, Geany... U daljem tekstu text editor) i krenite sa unosom HTML koda. Na samom poetku unesite doctype deklaraciju za HTML5:

i ispod deklaracije osnovne elemente koje smo ve opisali

Rekli smo da glava HTML dokumenta sadri neke parametre dokumenta. Jedan od tih parametara je naslov stranice. Naslov se pie unutar...tagova. Unesite sledee u head sektor dokumenta:

Moj prvi sajt

Naslov stranice je obavezan u HTML5 dokumentu i definie naziv stranice u internet pretraivaima, a takoe se prikazuje i u Google i slinim pretragama.Uneemo jo jedan red u head sektor dokumenta, ispod naslova, i to je: