Japan, rs za Srbiju, me za Crnu Goru itd) ili generički najviši internet domeni (na primer com za komercijalne
organizacije, edu obrazovanje, gov državna uprava...)
Internet kao globalna mreža pruža najrazličitije informacije u obimu koji se praktično ne može odrediti.
Pronalaženje tačno određenog dokumenta na Internetu predstavlja izuzetan problem obzirom na more raspoloživih
informacija. U cilju bržeg pronalaženja i jednostavnijeg pristupa željenim informacijama ustanovljeno je nekoliko
osnovnih servisa. Korisnik doživljava Internet kao
skup mrežnih usluga
. Usluge i servisi Internet-a su uvek
organizovani po klijent-server principu. Server je specijalni softver na nekom mrežnom računaru, koji opslužuje
zahteve korisnika. Klijent je aplikacija koja zahteva neku uslugu, obraća se serveru slanjem poruke sa opisom
zahtevanog zadatka. Server opslužuje zahtev i odgovara klijentu svojim porukama. Skup važećih poruka definisan je
protokolom. Server može usluživati više klijenata odjednom. Jedna od najstarijih i najkorišćenijih servisa na internetu
je
E-mail
- elektronska pošta. Jednostavnom tekstualnom sadržaju poruke mogu biti pridodati najrazličitiji prateći
sadržaji kao što su slike, tonski i video zapisi. Neki drugi servisi na internetu bili bi
: internet forumi
ili
diskusione
grupe,
mogućnost direktnog praćenja
radio i TV programa
putem Interneta,
kanali
(eng. channels) koji
omogućavaju da se željeni sadržaj automatski prenese do korisnikovog računara, a kasnije omogući njegov pregled
(
RSS
),
internet telefonija
(
VOIP
) itd.
Word Wide Web
ili skraćeno WWW korisnicima je internet usluga koja pruža informacije u najatraktivnijem
multimedijalnom obliku. Ovaj servis na Internetu je veoma brzo postao najpopularniji, jer obezbeđuje lako, brzo i
jednostavno pronalaženje željenog sadržaja na globalnoj računarskoj mreži. Za korišćenje Web-a razvijene su posebne
korisničke aplikacije – pregledači, čitači, brouzeri (eng. Browsers). Brouzerima se mogu jednostavno posećivati razne
web lokacije - sajtovi, koje sadrže tražene informacije u vidu tekstova, slika i drugih multimedijalnih sadržaja. Web
sajt je skup web stranica koje mogu sadržati tekst slike video i druge multimedijalne sadržaje, a koji su povezani
hipervezama - linkovima. Mogu biti statički – oni koji se ne menjaju duže vreme - i dinamički – oni koji se često
osvežavaju. Pretragu weba olakšavaju web pretraživači (eng.
Search engine
) – aplikacije koje na osnovu ključnih reči
prikazuju skup stranica na kojima su one pronađene.
HTML
HTML označava englesku skraćenicu od Hyper Text Markup Language i predstavlja jezik web stranica -
„hipertekstualni jezik za označavanje“. To je jezik za označavanje koji postavlja uputstva ili oznake (eng. tags) oko
teksta koji čitaču govore kako da na ekranu prikaže određeni sadržaj. HTML zapravo predstavlja skup instrukcija za
Web čitač.
Web stranica se sastoji od niza HTML naredaba koje se unose u tekst datoteku korišćenjem programa za
obradu teksta. Sadržaj Web stranice čine tekst, slike, video, zvuk i sve ostalo što se pomoću HTML-a na nju postavi.
Web čitači (eng. web browsers) prevode HTML iz dokumenta web stranica i prikazuju tekst, slike, animacije na
ekranu računara posetioca. Od verzije Web čitača (različiti proizvođači) donekle zavisi šta će posetilac videti na
ekranu. Web server na kome se nalazi Web strana i Web čitač za komunikaciju koriste protokol za prenos hiperteksta
HTTP (eng. Hyper Text Transfer Protocol). Pošto se izvršava pomoću web čitača HTML je platformski neutralan.
World Wide Web Consortium (
http://www.w3.org
) je internacionalna organizacija za standardizaciju HTML-a.
ALATI ZA KREIRANJE WEB STRANA
Postoje brojni besplatni, ali i komercijalni alati pomoću kojih se mogu kreirati web strane, a koji su u skladu
sa HTML standardima. Neki alati su toliko usavršeni da znanje HTML-a skoro nije ni potrebno, kao npr. Adobe
Dreamweaver. Međutim, kada je potrebno da se kreira nešto van šablona, prilagodi strana ili uradi nešto izvan skupa
komandi iz menija, neophodno je poznavanje HTML-a. Sve što je potrebno jeste najjednostavniji program za
uređivanje teksta (Notepad, Wordpad ili sl.), pretraživač Web-a (Mozilla Firefox, Internet Explorer, Opera,...) i
poznavanje HTML jezika. Osim toga potrebno je i poznavanje CSS-a (eng. Cascading Style Sheet) za raspoređivanje
elemenata na stranu odnosno vizuelno oblikovanje strane.
Ne treba mešati editore teksta sa softverskim programom za obradu teksta. Između njih postoje značajne
razlike. Mnogi moderni programi za obradu teksta mogu da iz teksta izrade HTML dokument, ali takođe u njega
uključuju brojne skrivene kodove koji mogu praviti probleme za neke pretraživače. U vežbama će se koristiti editor
teksta Notepad++, koji predstavlja poboljšani, besplatni softver za uređivanje teksta i može se preuzeti sa adrese
http://notepad-plus-plus.org
.
Svaki računar je podešen tako da otvara HTML dokumenta pomoću podrazumevanog web brouzera. Dovoljno
je samo da se dvaput klikne na bilo koji fajl sa ekstenzijom .html ili .htm i fajl će se otvoriti u web brouzeru koji je
određen kao standardni.
4
OSNOVNI HTML ELEMENTI
Osnovni element HTML-a je oznaka ili tag. Znakom za manje “<” obeležava se početak uparene oznake. Iza
početnog znaka sledi naziv oznake i atributi. Kraj oznake, obeležava se znakom za veće “>”. Uobičajeno je da oznake
u HTML-u imaju početnu i završnu oznaku. Takve oznake se nazivaju uparene oznake (engl. container tags). Naredba
iz oznake se odnosi na sadržaj stranice od početne do završne oznake. Svaka početna oznaku ima odgovarajuću
uparenu završnu oznaku i pravi se tako što se ispred naziva oznake stavi kosa crta (/). Početne oznake imaju oblik:
<naziv oznake [atributi]> , a završne </naziv oznake>
Naziv oznake čitaču definiše njenu namenu, a atributi (koji su opcioni) iza naziva oznake daju čitaču dodatne
informacije za izvršavanje te naredbe. Na primer oznake za početak i kraj pasusa (<p> odnosno </p>) primenjuju se
na deo teksta. U ovom primeru oznaka <p> nalaže čitaču da prikaže sav tekst do oznake </p>, a nakon toga kreira
jedan prazan red, primenjujući podrazumevana pravila formatiranja:
<p> Tekst između početnih i krajnjih oznaka. </p>
HTML tagovi su
"case insensitive"
tj. svejedno je da li se pišu malim ili velikim slovima, pa je isto značenje
prethodnog taga <html>, kao i sledećeg <HTML>
Osnovna struktura HTML dokumenta je univerzalna, i ista je za sve web strane, bez obzira na to da li se na
ekranu pojavljuju u jednostavnom ili složenom obliku. Neki osnovni elementi zajednički za sve HTML dokumente
kreiraju tu strukturu. U osnovne HTML elemente spadaju definicija tipa dokumenta, zaglavlje i telo elementa.
Prva linija svakog HTML dokumenta, bez obzira na to šta je još uključeno u dokument, mora biti definicija
tipa dokumenta (eng. Document Type Declaration), odnosno DOCTYPE Declaration ili DTD. DTD saopštava
pretraživaču da očekuje HTML element, a ne neki drugi markerski jezik ili drugi tip dokumenta. Zbog ove funkcije
DTD-a, pre DTD-a ne sme da postoji prazan prostor odnosno prazne linije. Ovo je jako bitno, jer ukoliko pretraživač
prepozna prazne linije ispred DTDa, on će se ponašati kao da DTD-a nema i rezultati mogu biti nepredvidiljivi.
Ispravne definicije tipa dokumenta:
<!doctype html public "naziv verzije" "url">
•
html
Označava kod kao i verziju HTML-a.
•
public
Označava dozvoljen javni pristup jeziku.
•
naziv verzije
Označava potpuno ime određene verzije HTML-a.
•
url
Označava adresu na Webu gde se nalazi javna definicija HTML koda.
Primer za verziju HTML 4.01 Frameset – sa podrškom za fontove i frejmove:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Primer za HTML 5: <!DOCTYPE html>
Da bi ste proverili da li ste pravilno napisali vaš HTML/XHTML dokument možete koristiti deo sajta
konzorcijuma W3 za proveru ispravnosti koda, na adresi http://validator.w3.org
.
Osnovna struktura html dokumenta obuhvata sledeće oznake:
<html>... </html>
Oznake koje definišu početak i kraj html
dokumenta
<head> ... </head>
Oznake za početak i kraj zaglavlja. Zaglavlje ili
glavni element se koristi za informacije o naslovu stranice, imenu
autora i datuma postavljanja stranice, upućuje čitač gde da nađe stilove
za učitanu stranicu, pruža meta-informacije i slede neposredno iza
početnih <html> oznaka. U sekciju zaglavlja se mogu dodati oznake:
<title>, <style>, <link>, <meta>, <script>, <noscript> i <base>
<title>...</title>
Oznake početka i kraja naslova. Naslov stranice
se prikazuje na korisnikovom ekranu, i treba ga upisati između gore
navedenih oznaka.
<body>...</body>
Početna i završna oznaka tela stranice postavljaju
se odmah iza zaglavlja web stranice. Tekst u telu oznake definiše
čitaču šta i na koji način da prikaže na ekranu posetioca web stranice.
Primer 1
: Da bi ste kreirali vašu prvu web
stranu otvorite Netepad++ editor i upišite
sledeći sadržaj:
<!DOCTYPE html>
<html>
<head>
<title>
Primer 1
</title>
</head>
<body>
Ovo je telo stranice
To će biti prikazano u web browser-u
</body>
</html>
5
odnosno za kraj reda (CR i LF) koje programi za obradu teksta umeću u HTML kod. Zato je za prelazak u novi red
neophodno koristiti oznaku za prelom reda <br>.
<br>
je oznaka za prelom reda, koja nalaže čitaču da pređe u naredni red, pa tek onda da prikaže ostatak
stranice. Za razliku od uparenih oznaka prazne oznake ne zahtevaju završnu oznaku.
Bez obzira koliko blanko znaka postavite unutar HTML koda, unutar web čitača će se on videti kao jedan
blanko znak. Zato, ukoliko želite više od jednog blanko znaka (space na tastaturi) morate da koristite znak za nelomivi
razmak
 
; na mestu gde želite da čitač prikaže veći razmak.
Primer 4 – Novi red, razmak i komentar
<html>
<head>
<title>Ovo je moja druga HTML strana</title>
<meta charset="utf-8" /></head>
<body>
<p>Ovo je prvi paragraf.</p>
<p>Ovo je drugi paragraf.</p>
<p>Ovo je
treci
paragraf.</p>
<p>Prethodni tag odvaja tekst sa razmakom između redova.
Beline i
znak za novi red
se ignorišu.</p>
<br>Nov red obezbeđuje tag br.
<br>Ovo je prost tag, ne postoji kraj taga.
<br>Između redova ne postoji razmak.
<!--Završavamo drugi primer. Ovo je komentar i nece se
videti u browser-u-->
</body>
</html>
<p>...</p>
je oznaka za pasus. Najopštije grupisanje teksta vrši se u pasusima. Element za pasus zahteva
početnu oznaku, dok je krajnja oznaka neobavezna. Međutim, u cilju doslednosti, bolje je okružiti ceo tekst pasusa.
<center> i </center> -
Ako se drugačije ne naglasi tekst unutar HTML stranice je poravnat uz levu ivicu.
Centriranje teksta ili bilo kog drugog elementa stranice se dobija pomoću tagova <center>. Poravnanje teksta se može
izvršiti i pomoću atributa ALIGN, na sledeći način:
<p
align="left"
>
<p
align="center"
>
<p
align="right"
>
<blockquote>...</ blockquote> -
HTML pasusi nemaju uvučeni prvi red i podrazumevano su poravnati
ulevo. HTML oznaka blockquote formatira tekst uvlačenjem ili povećavanjem margina na levoj i desnoj strani teksta.
<div>...</div>
su oznake za grupisanje sadržaja.
Primer 5 – Formatiranje pasusa
<html>
<head>
<title>Formatiranje pasusa</title>
<meta charset="utf-8" /></head>
<body>
<p>Ovo je paragraf.</p>
<p align=right> Ovaj paragraf će biti spušten dva reda
i poravnat sa desne strane.</p>
<p align=center> Ovaj paragraf će biti spušten dva
reda i centriran.</p>
<p align=justify> Ovaj paragraf će biti spušten dva
reda i poravnat sa obe strane.</p>
<p> Ovaj paragraf će biti spušten dva reda i poravnat
sa leve strane.</p>
<div>Ovo je odeljak.</div>
<div align=right> Ovaj odeljak će biti spušten jedan
red i poravnat sa desne strane.</div>
<div align=center> Ovaj odeljak će biti spušten jedan
red i centriran.</div>
<div align=justify> Ovaj odeljak će biti spušten jedan
red i poravnat sa obe strane.</div>
<div> Ovaj odeljak će biti spušten jedan red i poravnat
sa leve strane.</div>
<blockquote>Ovaj tekst će biti uvučen u odnosu na
ostatak teksta.
<br>I svi naredni će biti uvučeni sve do kraja
taga.</blockquote>
<pre>
Ovaj text
će izgledati
kao što je
napisan
</pre>
</body>
</html>
Formatiranje teksta može se obaviti unošenjem početne oznake formata na sam početak teksta. Najčešće
korišćene oznake formata su:
<b>...</b>
za prikazivanje teksta podebljanim fontom.
7
