Dreamweaver

OSNOVNA [KOLA VUK KARADZI]
KRU[EVAC
IZRADA WEB PREZENTACIJA

DREAMWEAVER
INTERNET - neotkrivene mogu}nosti
KRU[EVAC, novembar 2001.godine
2
WWW World Wide Web
World Wide Web jeste sistem Internet servera koji podràva hipertekst za pristup jednom broju
Internet protokola. World Wide Web ~esto se skra}uje u Web, WWW ili W3.
World Wide Web napravio je 1989. god. Tim Berners-Lee koji radi u Evropskoj laboratoriji za fiziku
(CERN) u Švajcarskoj. Prva namena Weba bila je da omogu}i ~lanovima laboratorije širom sveta da
komuniciraju koriste}i mre`ni hipertekst. Ubrzo je vest procurela izvan CERN-a, pa se pove}avao i broj onih
koji su razvijali Web i koristili ga. Uz hipertekst u Web su polako ulazile slike, te video i zvu ~ni zapisi.
Poslednjih godina upotreba Weba raširena je po celom svetu.
Internet je globalna ra~unarska mreà sastavljena od hiljada mreà po celom svetu. Niko ne zna koliko
je ra~unara povezeno na Internet, iako su procene u toku. Sigurno je, me|utim, da se ovaj milionski broj
pove}ava neverovatnom brzinom.
Niko ne kontroliše Internet. Postoje organizacije koje razvijaju tehni~ke aspekte ove mreè, ali je
nijedna vladaju}a aparutura ne kontroliše. Klju~nu magistralu Interneta (okosnicu, engl. backbone), kroz koju
te~e saobra}aj preko Interneta, poseduju privatna preduze}a.
Svi ra~unari na Internetu me|usobno komuniciraju koriste}i Transmission Control Protokol/Internet
Protocol (protokol za kontrolu prenosa/Internet protokol), skra}eno TCP/IP. Ra~unari na Internetu koriste
klijent/server arhitekturu. To zna~i da udaljena server mašina obezbe|uje datoteke i servise lokalnoj klijent
mašini korisnika. Softver se moè instalirati na klijent ra~unar kako bi se iskoristila najnovija tehnologija
pristupa.
Skoro svaki tip protokola koji je dostupan na Internetu dostupan je i na Webu. Internet protokoli jesu
skupovi pravila koji omogu}uju komunikaciju izme|u ra~unara na Internetu. Sledi lista glavnih protokola na
Webu:
 E-mail (Simple Mail Transport Protocol (SMTP)) - Elektronska pošta ili e-pošta (engl. e-
mail) omogu}uje korisnicima ra~unara širom sveta da razmenjuju poruke. Svaki korisnik
elektronske pošte ima sopstvenu adresu poštanskog sandu~eta na koju se poruke šalju. Poruke i
datoteke poslate preko elektronske pošte mogu sti}i u roku od nekoliko sekundi. Na primer,
dokument koji je napravljen u Microsoft Wordu moè se priloìti uz elektronsku poruku, a drugi
korisnik moè je primiti ako ima odgovaraju}i program za elektronsku poštu. Mnogi takvi
programi, npr Netscape Messenger i Microsoft Outlook Express, omogu}avaju ~itanje datoteka
pisanih u HTML-u koje su, u stvari, MIME tipa.
 Telnet (Telnet Protocol) - Telnet je program koji omogu}uje povezivanje sa ra~unarima na
Internetu i upotrebu mre`nih baza podataka, kataloga, servisa za }askanje itd. Da biste to uradili
morate znati adresu. Ona moè sadràti re~i (npr. Locis.loc.gov) ili brojeve (npr.
140.147.254.3). Neki servisi zahtevaju da se poveète sa odre|enim portom na udaljenom
ra~unaru. U tom slu~aju upišite broj porta nakon Internet adrese.
3
 FTP (File Transfer Protocol) - FTP je skra}enica za File Transfer Protocol. Ovo je i program i
metod kojim se prenose datoteke izme|u ra~unara. Anonimni FTP jeste opcija koja omogu}ava
korisnicima da prenose datoteke sa mnogo hiljada mati~nih ra~unara na Internetu na svoj
ra~unar. FTP lokacije sadrè knjige, ~lanke, programe, igrice, ikone, muziku, multimediju,
kurseve, podatke itd.
 Usenet (Network News Transfer Protocol (NNTP)) - Usenet News je mreà u kojoj milioni
korisnika ra~unara razmenjuju informacije o raznim temama. Glavnu razliku izme|u Usenet
News i e-pošte diskusionih grupa ~ini to što se Usenet poruke nalaze na centralnim ra~unarima
i korisnici se moraju povezati sa tim ra~unarima da bi pro~itali poruke poslate odre|enoj grupi.
To se jasno razlikuje od distribucije e-pošte, gde poruke stiù u elektronsko sandu~e svakog
~lana liste.Usenet je skup mašina koje razmenjuju poruke ili ~lanke iz Usenet diskusionih
foruma koji se nazivaju elektronske konferencije. Administratori Useneta kontrolišu svoje
lokacije i odlu~uju da li }e i koju konferenciju sponzorisati, a kojoj }e dozvoliti pristup sistemu.
 HTTP (HyperText Transfer Protocol) - Protokol za slanje hiperteksta. Šalje hipertekst preko
mreè. Ovo je protokol World Wide Weba.
Na Webu su dostupni i mnogi drugi protokoli. Na primer, Voice over Internet Protocol (VoIP) ili
Net2Phone omogu}uje korisnicima Interneta da preko Weba razgovaraju telefonom.
Pristup svim ovim protokolima World Wide Web omogu}uje preko samo jednog interfejsa - modema.
Više nije nu`no poznati sve ove protokole. Njih Web objedinjuje u jedan sistem. Zbog ovog svojstva, a i zbog
sposobnosti Weba za rad sa multimedijom i naprednim programskim jezicima, World Wide Web predstavlja
komponentu Interneta koja se najbrè razvija.
Instalacija TCP/IP
Povezivanje miliona ra~unarskih mreà na Internet ne bi bilo mogu}e bez standardnog skupa protokola.
TCP/IP je protokol koji se koristi na Internetu. On kombinuje mnoge protokole, što omogu}ava komunikaciju
kroz me|usobno spojene mreè sa razli~itim hardverom i operativnim sistemima.
Za povezivanje na Internet mora da se instalira TCP/IP. Windows 98 automatski povezuje TCP/IP da radi sa
mre`nim adapterom ili sa Microsoft Dial-Up adapterom. TCP/IP moè da se instalira i naknadno, koriš}enjem
opcije Network u Control Panelu.
Da biste instalirali TCP/IP treba da preduzmete slede}e korake:
Instalacija Dial-up adaptera i TCP/IP protokola za Windows 95/97/98
1. U Control Panel-u (Start -> Settings -> Control Panel) izaberite ikonu Network.
2. Ukoliko se u prozoru koji ste otvorili (Network) ne nalaze Dial-up adapter i TCP/IP, moraju se dodatno
instalirati na slede}i na~in:
Instalacija Dial-Up adapter-a

Pritisnite Add, odaberite Adapter duplim klikom na levi taster miša. Nakon toga selektujte Microsoft u
levom meniju, a u desnom Dial-up Adapter. Pritiskom na OK procedura instalacije se završava.
4

Instalacija TCP/IP protokola
Pritisnite Add, izaberite Protocol (dupli klik levim tasterom miša). U levom meniju izaberite Microsoft,
a u levom TCP/IP. Potvrdite instaliranje pritiskom na OK.
Nakon izvršenja gore-pomenutih instalacija, pored drugih komponenti koje se nalaze u Network-u, pojavice se i
Dial-up adapter i TCP/IP protokol. Sasvim je izvesno da }e Windows posle ovog koraka zatraì instalacioni
disk. Ukoliko isti nemate, morate ga nabaviti jer bez instaliranog Dial-up adapter-a i TCP/IP protokola ne
moète pristupiti internet-u.
Ako se vaš racunar ne nalazi u lokalnoj mreì i ne koristi neke druge protokole, ostale komponente Network-a
moète (a ne morate) ukloniti procedurom Remove.
Nakon instalacije, Windows ce zasigurno, zatraìti da re-startujete ra~unar.
Instalacija i podešavanje Dial-up networking-a

1. Otvorite ikonu My computer (sa desktop-a).
2. Otvorite ikonu Dial-up networking. Ako se ikona Dial-up networking ne nalazi u prozoru ili ne
moète da je aktivirate, morate da instalirate Dial-up networking na slede}i na~in:
U Control Panel-u startujte Add/Remove software. Odaberite Windows setup stranicu i selektujte
Communications (ukoliko isti nije vec odabran). Pritisnite Details i ozna~ite Dial-up networking.
Pritiskom na OK tastere privodite instalaciju kraju. I za ovaj korak }e vam biti neophodni
instalacioni disk ili diskete, kao i neizbe`no re-startovanje Windows-a, nakon ~ega moète pristupiti
slede}im fazama podešavanja.
3. Startujte ikonu Make new connection u Dial-Up networking-u. Windows }e vas provesti kroz tri
koraka, gde treba upisati naziv konekcije (npr. neobee.net) i telefonski broj Dial-In servisa kojim se
povezujete na internet (489-1111). Po završetku prethodnog koraka, pojavi}e se ikona neobee.net u
prozoru Dial-up networking-a. Kliknite desnim tasterom miša na nju i izaberite opciju Properties.
Ukoliko zovete iz Novog Sada ili okoline (podrucje 021), isklju~ite opciju Use country code and area
code. Kliknite na Configure i isklju~ite opcije Only connect at this speed i Wait for dial tone before dialing.
Kliknite na Advanced i ako je opcija dostupna, u extra settings napisite ATX3. Pritisnite OK. Ukoliko zovete sa
starijih centrala, spustite brzinu konekcije na 33600 bps (v.34bis). Kontaktirajte svog prodavca modema za
informacije.
Pritiskom na OK vratite se do po~etnih opcija Configure i Server Type. Kliknite na Server Type i
podesite parametre kao na slici:
5
6
Kliknite na TCP/IP Settings i podesite parametre kao na slici:
Kada se instalira Dial-Up Networking ili drugi mre`ni adapter, Windows 98 automatski vezuje TCP/IP
za adaptere, ako je TCP/IP instaliran ranije. Ako na ra~unaru postoji više mre`nih adaptera, kod svakog je unet
TCP/IP. Svaki adapter treba posebno konfigurisati vlastitim TCP/IP parametrima.
Sada je sve podešeno i moète da se konektujete na internet.
HYPERTEXT: Kretanje po Webu

Rad Weba prvenstveno se oslanja na hipertekst kao sredstvo za pretraìvanje informacija. HyperText
je dokument koji sadrì re~i povezane sa drugim dokumentima. Ove re~i se nazivaju linkovi (veze) i korisnik ih
moè izabrati. Hipertekstualni dokument moè sadràti veze sa mnogim dokumentima. Re~i ili slike mogu
posluìti kao veze do drugih dokumenata, slika, video i zvu~nih zapisa. Veze moga, ali ne moraju slediti logi~an
put, jer je svaku vezu programirao autor izvornog dokumenta. Najzad, WWW sadrì kompleks virtuelnih mreà
veza izme|u mnogih dokumenata, slika, video i zvu~nih zapisa.
Hipertekst za Web pravi se pomo}u HyperText Markup Language, tj. HTML?a. U tom jeziku
kontrolnim kodovima postavljenim unutar teksta formatira se dokument, bira se veli~ina i oblik fonta i prave se
hipertekstualne veze. Slike tako|e mogu biti deo HTML dokumenta. HTML je jezik u razvoju i svakoj novoj
verziji dodaju se novi kontrolni kodovi. Standardizovanjem HTML-a upravlja World Wide Web konzorcijum
predvo|en Tim Berners-Leejem.
Web stranice
World Wide Web sastoji se od datoteka koje se nazivaju stranice ili Web stranice, a one sadrè podatke
i veze do izvora na Internetu. Web stranice se mogu praviti aktivnoš}u korisnika. Na primer, ako posetite
softversku mašinu za pretraìvanje Weba (engl. Web search engine) i unesete neku klju~nu re~, napravi}e se
stranica koja sadrì rezultate vašeg upita. U stvari, rastu}i broj informacija dostupnih na Webu dobija se iz baza
podataka stvaranjem privremene Web stranice kao odziva na zahtev korisnika.
7
Web stranicama moète pristupiti na nekoliko na~ina:
1. Unošenjem Internet adrese (direktno stiète na stranicu).

2. Kretanjem po stranicama uz pomo} veza (pomerate se sa jedne na drugu stranicu).
3. Kretanjem po direktorijumu teme koji je povezan sa organizovanom kolekcijom Web stranica.
4. Pomo}u pretraìva~a (ako unesete klju~nu re~).
Pretraìvanje dokumenata na Webu: URL

URL je skra}enica od Uniform Resource Locator (jedinstvena lokacija izvora).
URL odre|uje Internet adresu datoteke koja se nalazi na mati~nom ra~unaru povezanom na Internet.
Svaka datoteka na Internetu, bez obzira na svoj protokol, ima jedinstveni URL. Web programi koriste URL da
bi dobili datoteku od mati~nog ra~unara i direktorijuma u kojem se ona nalazi. Potom se ova datoteka prikazuje
na ekranu korisnika.
Pomo}u Internet Domain Name Systema (DNS) URL-ovi se prevode u numeri~ke adrese.
Numeri~ka adresa je pravi URL. Zbog toga što je korisnicima teško da koriste isklju ~ivo numeri~ke adrese,
koriste se adrese sastavljene iz brojeva i slova. Nakon prevo|enja Web server moè da pošalje zahtevanu stranicu
Web pretraìva~u korisnika.
Anatomija URL-a
Ovo je format URL-a:
protokol://ra~unar/putanja/ime_datoteke
Na primer, URL mati~ne stranice O["Vuk Karadzic" iz Kru{evca glasi:
http://www.geocities.com/skolavuk/index.htm
Struktura ovog URL-a je slede}a:
1. Protokol: http
2. Ime mati~nog ra~unara: www
3. Ime drugog nivoa domena: geocities
4. Ime završnog nivoa domena: com
5. Ime direktorijuma: skolavuk
6. Ime datoteke: index.htm
Sledi spisak uobi~ajenih završnih nivoa domena:
 com - komercijalno preduze}e

 edu - obrazovna institucija
 gov - vladina ustanova
 mil - vojna ustanova
 net - snabdeva~ mre`nim uslugama
 org - naj~eš}e neprofitabilna organizacija
Osim toga, mnoga imena domena dodeljena su kako bi se prepoznale i pronašle datoteke koje se
nalaze na mati~nim ra~unarima u zemljama širom sveta. Ovo se odnosi na Internet kodove zemalja koji sadrè
dva broja i koje je strandardizovala Internacionalna organizacija za standarde, kao što je standard ISO 3166. Na
primer:
 ch - Švajcarska
 de - Nema~ka
 jp - Japan
 uk - Engleska
 yu - Jugoslavija
Predloèno je da se novi završni domeni dodaju postoje}im imenima domena. Ameri~ka vlada
oformila je instituciju za dodelu imena i brojeva na Internetu (Internet Coorporation for Assigned Names and
Numbers (ICANN)) koja se bavi pitanjima vezanim za imena domena.
8
KAKO PRISTUPITI WORLD WIDE WEBU
Web pretraìva~i
Da biste pristupili World Wode Webu morate koristiti Web pretraìva~. Pretraìva~ je program koji
omogu}uje korisnicima da koriste World Wide Web i da se kre}u po njemu. Postoje dve vrste pretraìva~a:
1. Grafi~ki: Tekst, slike, zvu~ni i video zapisi mogu se dobiti pomo}u programa sa grafi~kim
korisni~kim interfejsom, kao što su Netscape Navigator i Internet Explorer. Ovi pretraìva~i
dostupni su i na Windows i na Mac ra~unarima. Kretanje se postiè ukazivanjem i pritiskom
mišem na osvetljene re~i i slike.Grafi~ke pretraìva~e moète besplatno preuzeti sa
odgovaraju}ih Web lokacija, Netscape sa lokacije http://home.netscape.com/, a Microsoft
Internet Explorer sa lokacije: http://www.microsoft.com/. Da biste koristili ove programe za
pristup Webu treba da imate mre`nu vezu ili komutiranu vezu poznatiju kao SLIP ili PPP. Ova
poslednja moè se dobiti od dobavlja~a Internet usluga.
Netscape pretraìva~ Windows pretraìva~
2. Tekstualni: Lynx je pretraìva~ koji omogu}uje pristup Webu samo u tekstualnom obliku.
Kretanje se vrši osvetljavanjem klju~nih re~i na ekranu tasterima sa strelicom nagore ili nadole,
a zatim pritiskom na strelicu za kretanje unapred (ili na taster Enter). Ovaj pretraìva~ dostupan
je na VAX ili UNIX ra~unarima.
Proširivanje pretraìva~a: dopunski moduli (Plug-Ins)

Dopunski moduli mogu se uklju~iti u Web pretraìva~ da bi se pretraìva~u proširile sposobnosti.
Kada pretraìva~ nai|e na sliku, zvu~ni ili video zapis, on podatke šalje drugim programima - dopunskim
modulima, koji }e pokrenuti ili prikazati datoteku. Rade}i u zajednici sa dopunskim modulima pretraìva~i
omogu}uju bogato multimedijalno iskustvo. Mnoge dodatne module moète dobiti besplatno.
Formati datoteke koji zahtevaju dodatne module jesu MIME formati. MIME je skra}enica za
Multimedia Internet Mail Extension (multimedijalni skup kodova za Internet poštu) i pomaè softveru za
elektronsku poštu za rad sa binarnim (non-ASCII) datotekama-prilozima. Upotreba MIME formata proširila se
na Webu. Na primer, osnovni MIME format koji upotrebljavaju Web pretraìva~i jeste text/html sa oznakom
tipa .html.
Uobi~ajeni dodatni modul koji se koristi na Webu jeste Adobe Acrobat Reader. On vam omogu}uje
da vidite dokumente koji su napravljeni u tzv. PDF formatu (Adobe Portable Document Format). Ovi dokumenti
predstavljaju aplikacije u MIME formatu i oznaka tipa im je .pdf. Kada uklju~ite Acrobat Reader u pretraìva~,
on }e se pokrenuti i prikazati èljenu datoteku ako pritisnete mišem na hyperlink sa imenom datoteke sa
sufiksom .pdf. Poslednja verzija Acrobat Readera omogu}uje prikaz dokumenata u okviru pretraìva~a.
Web pretraìva~i ~esto su standardno snabdeveni sa nekoliko dodatnih modula, posebno za prikaz
multimedijalnog sadràja. Više dodatnih modula moète na}i na Web lokacijama proizvo|a~a pretraìva~a, na
specijalnim lokacijama za preuzimanje sadràja sa Weba ili na Web lokacijama kompanija koje su napravile te
dopunske module. Broj dodatnih modula rapidno raste.
Kada ugradite dodatni modul u pretraìva~, on }e se automatski pokrenuti kada ho}ete da pristupite
tipu datoteke koji koristi.
9
10
Više od dodatnih modula:

ActiveX
ActiveX je tehnologija koju je razvio Microsoft. Uz nju su vam dodatni moduli manje potrebni.
ActiveX omogu}uje ugra|ivanje animiranih objekata, podataka i ra~unarskih kodova na Web stranice. Web
pretraìva~ koji podràva ActiveX moè da prikaè ve}inu podataka na Web stranici. Na primer, ActiveX
omogu}uje korisnicima da vide trodimenzionalni VRML svet u Web pretraìva~u bez upotrebe dodatnih
modula za VRML. Ova tehnologija vam tako|e moè omogu}iti prikaz i promenu PowerPoint prezentacija
unutar Web pretraìva~a. ActiveX najbolje radi sa Microsoft Internet Explorerom.
MULTIMEDIJALNI DO@IVLJA WEBA
Današnji World Wide Web predstavlja kombinaciju multimedije, programskih jezika i ìve
komunikacije. Pravi je izazov pratiti njegov razvoj. Sledi mali prikaz stvari na koje treba posebno obratiti
pa`nju.
Multimedija
Web je postao medijum za emitovanje. Moète da slušate zvu~ne i gledate video zapise preko Weba i
uìvo i prethodno snimljene. Na primer, moète da posetite lokaciju neke organizacije za vesti i gledate isti
program koji oni emituju svake ve~eri na televiziji. Nekoliko dodatnih modula vam omogu}uje to.
Na primer, Appleov Quick Time Player snima datoteke sa oznakom tipa .mov i prikazuje ih kao
"filmove" u malom okviru na ekranu. Quick Time datoteke mogu biti veoma velikei treba mnogo vremena da
snimite ceo film pre prikaza.
Problem sporog snimanja je rešen revolucionarnim razvojem sposobnosti multimedije: striming
medija. U ovom slu~aju se zvu~ni i video zapisi prikazuju u toku snimanja ili striminga na vaš ra~unar. Samo
malo morate da sa~ekate pre prikaza datoteke.
RealPlayer dodatni moduli prikazuju striming zvu~ne i video datoteke. Ve}e datoteke kao što su
intervjui i govori se dobro prikazuju sa Real Playerom. On je tako|e idealan za gledanje emisija uìvo,
konferencija, radio i TV emisija, koncerta itd. Tako|e postoji i Windows Media Player. Mnoge lokacije vam
nude da birate koji }ete da koristite.
Shockwave predstavlja još jedno multimedijalno iskustvo. On vam omogu}uje pravljenje i

implementaciju multimedijalnog sadràja kombinovanjem grafike, animacije i zvuka. Zvu~ne datoteke,
uklju~uju}i muziku, tako|e se mogu ~uti na Webu. Uobi~ajeno je da prilikom posete Web lokaciji ~ujete
muziku u pozadini. Zvu~ne datoteke moète i snimiti nezavisno od posete Web lokaciji. Web podràva mnoge
tipove zvu~nih datoteka sa odgovaraju}im dodatnim modulima. Najnovij trend je MP4 format datoteke sa
dodatnim modulima koji ga podràvaju.
Internet kamere (engl. Live cams) su još jedan vid multimedijalnog iskustva koje je dostupno na
Webu. ìve i video kamere koje šalju podatke uìvo na Web server. Ove kamere se mogu na }i na raznim
lokacijama, ozbiljnim i neozbiljnim: kancelarija, vrh zgrade, lokalna scena, specijalni doga|aj itd.
PROGRAMSKI JEZICI I FUNKCIJE

Upotreba postoje}ih i novih programskih jezika proširila je mogu}nosti Weba.Ovo je osnovni vodi~ u
uobi~ajene jezike i funkcije koji se danas koriste na Webu.
CGI (Common Gateway Interface) se odnosi na specifikaciju pomo}u koje programi komuniciraju
sa Web serverom. CGI program ili skripta je program napravljen za prihvatanje i povratak podataka koji
odgovaraju CGI specifikaciji. Program moè biti napisan na bilo kojem jeziku uklju~uju}i C, Perl i Visual Basic
Script. ~esto se upotrebljava za proces interaktivne forme na Web stranici. Na primer, moète da popunite
obrazac za narud`bu knjige putem Interlibrary Loan. Skript šalje informacije na odre|enu e-mail adresu u odseku
Interlibrary Loan-a.
ASP (Active Server Pages) je noviji tip dinami~ne Web stranice koju je napravio Microsoft. ASP su
HTML stranice koje uklju~uju skriptovanje i pravljenje interaktivnih aplikacija Web servera. Skripte se pokre}u
na serveru a ne na Web pretraìva~u da bi se stvarale HTML stranice poslate pretraìva~ima. Visual Basic i
JScript (JavaScript) se ~esto koriste za skritovanje. ASP datoteke imaju oznaku tipa .asp.
11
Java/Java Applets: Java je najverovatnije najpopularniji programski jezik Weba. Java je programski
jezik baziran na objektima poput C++. Napravio ga je Sun Microsystems a cilj Jave je da pravi programe koji }e
biti nezavisni. Javin moto je "napiši ga jednom, pokre}i ga svuda". Savršeni Java program bi trebalo podjednako
dobro da radi na PC-ju, Macintoshu, Unixu itd., bez dodatnog programiranja. Ovaj cilj tek treba da se realizuje.
Java se moè koristiti za pravljenje aplikacija za Web kao i onih koje nisu za Web. Java aplikacije bazirane na
Webu su obi~no u obliku tzv. Java appleta (malih aplikacija). To su mali Java programi pozvani sa HTML
stranice koji se mogu snimiti sa Web servera i pokrenuti Web pretraìva~em koji podràva Javu. Nekoliko
primera: vesti uìvo, pokretne slike sa zvukom, kalkulatori, tabele i interaktivni vizuelni prikazi. Java apleti
imaju tendenciju sporoga o~itavanja ali se radi na ubrzanju.
JavaScript/JScript: JavaScript je programski jezik kojeg je napravio Netscape Communications. Mali

programi napisani ovim jezikom su ugra|eni u HTML stranicu ili se pozivaju izvan stranice da bi pove}ali
funkcionalnost stranice. Primeri JavaScripta su pokretne nalepnice, padaju}i meniji, ìvi kalendari i satovi,
interakcije sa mišem. JScript je sli~an jezik, razvio ga je Microsoft i radi sa pretraìva~em te kompanije, Internet
Explorerom.
XML: XML (eXtensive Markup Language) je jezik za pravljenje Web stranica koji omogu}uje
dizajnerima da prave sopstvene kontrolne kodove da bi obezbedili funkcionalnost koja nije dostupna u HTML-
u. XML je jezik strukture podataka i razmene i omogu}uje onima koji ga razvijaju da razdvoje formu od
sadràja. Ovaj program po~inje sve više da se koristi. U maju 1999., me|utim, W3 konzorcijum je najavio da je
HTML 4.0 promenjen u XML aplikaciju koja se zove XHTML. Ovo je bio zna~ajan pomak i za XML i za
HTML.
KOMUNIKACIJA U@IVO
Unutar Weba postoji tekstuelna, zvu~na i video komunikacija. Ova sposobnost omogu}uje ljudima da
prave konferencije i uìvo sara|uju. Uopšteno, što je brà Internet veza to je uspešnija komunikacija.
Najjednostavniji chat program omogu}uje da više korisnika komunicira uìvo.Internet Relay Chat
(IRC), America Online˘s Instant Messenger i ICQ (I seek you) su primarni primeri ove vrste programa. Razvoj
protokola poruka je u toku. Ovi protokoli bi obezbedili ekspanziju ove sposobnosti Interneta.
Naprednija ìva komunikacija nudi zvu~nu i/ili video komponentu.

Najpopularniji program ove vrste je CU-See Me. Još napredniji su programi koji omogu }uju ìvu
saradnju (engl. real-time collaboration). Neki od primera su Microsoftov NetMeeting i Netscapeov Conference
(deo Communicatora).
Ovi programi sadrè alate koji podràvaju:
 audio: telefonski razgovor na Webu

 video: posmatrate publiku
 prenos datoteka: šalje datoteke od pošiljaoca do pošiljaoca
 chat: tipkanje uìvo
 whiteboard: crta, obeleàva i ~uva slike na deljenom prozoru ili plo~i
 razmena dokumenata/aplikacija: prikazuje i koristi program na tu|em ra~unaru
 saradnja u Web pretraìvanju: zajedno pose}ujete Web stranice
Trenutno ne postoji definisan standard koji bi trebalo da podràvaju programi za konferenciju.
12
KONCEPTI KONSTRUKCIJE WEB STRANICE
Prisustvo na Internetu u vidu prezentacije trebalo bi da pocne sa idejom sta je to sto zelimo da
predstavimo. U zavisnosti od ovog pitanja nadovezuje se sledece: Ko je zainteresovan za to sto zelimo da
predstavimo. Ako su u pitanju deca koja vole igrice i naucnu fantastiku, strategija predstavljanja je jedna, a ako
su u pitanju odrasli koji vole da citaju dnevnu stampu, strategija je druga. Ako se za temu koju predstavljamo
interesuju ljudi koji nemaju puno vremena, informacije moraju kratke i jasne, ili kratak i jasan opis dugackog
teksta na svetloj pozadini, jer takve tekstove posetioci stampaju.
Tekst koji upisujete na web stranicu je isti kao tekst u svim drugim dokumentima. Razlika je u tome
što tekst sadrì kodove koji omogu}uju ~itanje u formatiranom obliku pomo}u vašeg omiljenog pretraìva~a.
Ove kodove morate uklju~iti na vašu stranicu da bi ona radila ali ako koristite HTML programe za ure|ivanje
kao što su PageMill ili HoTMetal ne morate da pamtite kodove. Ako èlite, moète napisati stranicu u programu
za ure|ivanje teksta kao što je "WordPad" pa je sa~uvati kao tekstuelnu datoteku pomo}u komande Save As.
Druga mogu}nost je da napišete obi~nu stranicu u Wordu ili WordPerfectu koji vam omogu}uju da sa~uvate
stranicu kao HTML datoteku. Me|utim, ako razumete šta je „iza prozora” to }e vam pomo}i da razumete
mogu}nosti web dizajna i pomo}i vam da rešite probleme u radu ako stvari ne izgledaju onako kako ste hteli.
Mnogi ljudi ne znaju da mogu videti (i kopirati!) kodove iz drugih web stranica.Da biste videli kodove
za odre|enu stranicu pritisnite mišem na View koji se nalazi na liniji menija pa izaberite stavku Source. Potom
moète se}i i prenositi delove koda koliko god èlite. Tako|e je dobro videti kako su drugi ljudi konstruisali
svoju web stranicu.
OBJAVLJIVANJE NA WEBU KORIŠ]ENJEM

PROGRAMA DREAMWEAVER
Program MACROMEDIA DREMAWIVER moète preuzeti i instalirati na Vaš ra~unar sa internet

adrese http://www.macromedia.com.
Web je komunikacioni medijum sa jedinstvenim svojstvima. Kao i kod ostalih komunikacionih
medijuma, va`no je da se utvrdi cilj:
 koja je namena vaše Internet prezentacije,
 potencijalna publika (ko su oni, šta znaju, šta treba da znaju)
 tematika (koje informacije }e vaša prezentacija obuhvatiti i kako).
Web se razlikuje od drugih medijuma po svojoj interaktivnosti: korisnici mogu da pritiskaju mišem na
tzv. povezani tekst i slike da bi krstarili po prezentaciji po svom naho|enju, usredsre|uju}i se na sadràj koji njih
zanima. Tako|e, Web omogu}ava da dodajete svojim stranicama slike, zvuk, video i animaciju.
Pri objavljivanju Web prezentacije izdvajaju se tri faze:
 Planiranje i dizajniranje sadràja

 Pravljenje Web lokacije
 Prebacivanje datoteka na Web server.
Za ovaj posao od softverskih alata potrebni su vam Dreamweaver i Internet Explorer.
Planiranje i dizajniranje sadràja

Sadràj i dizajn se definišu zajedno, ali sadràj treba da odre|uje dizajn: vi treba da znate šta èlite da
saopštite pre nego što poèlite to da predstavite. U ovoj fazi treba da razmišljate o sadràju prezentacije i da
planirate organizovano i efikasno predstavljanje tog materijala.
Pre no što po~nete da pravite stranicu razmislite o slede}em:
 Zašto pravite stranicu ?
 Šta èlite da kaète ?
 Zašto }e se ljudi zaustaviti na vašoj stranici ?
 Koje grafike èlite da uklju~ite ?
 Koje veze èlite da uklju~ite ?
 Da li imate ìvot mimo ra~unara ?
13
Planiranje sadràja stranice

Slede}a pitanja }e vam pomo}i u odre|ivanju sadràja. Odgovorite na njih i notirajte sve druge
informacije koje mogu biti va`ne.
Koja je namena vaše prezentacije? Ko ~ini vašu publiku? Šta ona zna? Šta ona treba da zna? Koju
vrstu priklju~ka na internet ona poseduje? Šta èlite da publika sazna iz vaše prezentacije? Na koje podoblasti
treba izdeliti sadràj kako bi tok informacija bio jasan, logi~an i koristan za publiku?
1. Dobra ideja je pokretac svega. Strucnaci iz Marketing predvidjaju da ce sledeci vek biti vek
"ideja".
2. Budzet koji prati ostvarivanje ideje. U zavisnosti od kolicine predvidjenih sredstava efekti
promocije dolaze brze ili kasnije.
3. Izrada Web prezentacije. Nadam se da ce se daljim razvojem Interneta kod nas prevazici sistem
prisustva firme na internetu koji pocinje i zavrsava Web prezentacijom.
4. Kreiranje Internet medija plana, ili plana reklamiranja putem razlicitih Internet servisa. Ovaj
deo promocije, ako je postojao, uglavnom se u nasim uslovima zavrsavao na prijavljivanju na
pretrazivace.
5. Pracenje efekata promocije. Razlicitim alatima koji omogucavaju pracenje statistika
posecenosti i korigovanjem svih online aktivnosti prema ovim rezultatima povecavaju se
pozitivni efekti od promocije.
Planiranje izgleda
Što se ti~e efikasnog dizajna, Web prezentacije se mogu ocenjivati prema slede}im kriterijumima:
jedinstvenost, preglednost i upravljivost.
 Jedinstvenost postoji kada su elementi tako uklopljeni da zadovoljavaju opšti komunikacioni

cilj.
 Preglednost postoji kada je sadràj izdeljen na logi~ke, manageable podskupove.
 Upravljivost postoji kada korisnici mogu da predvide gde se nalaze oblasti koje njih interesuju
i kada mogu lako da stignu do njih.
Preporu~ujem da kada pose}ujete druge Web prezentacije da ocenjujete njihov dizajn na osnovu
prethodnih kriterijuma. Pogledajte svaku prezentaciju i kao stvaralac i kao konzument Web informacija.
Jedinstvenost:
Da li je jasno o ~emu }e se komunicirati? Ako nije, kako bi se mogle informacije u~initi jasnijim?
Da li svi elementi prezentacije (tekst, grafika, izgled) podràvaju isti komunikacioni cilj?
Da li su delovi unutar odeljka ili stranice me|usobno dobro uklopljeni? Ako nije tako, gde "škripi" u
dizajnu?
Kako su delovi pojedinih odeljaka uklopljeni u prezentaciju kao celinu? Da li je ista pozadina? Da li je
raspored elemenata sli~an? Da li postoje zajedni~ki grafi~ki elementi na svakoj stranici?
Preglednost:
Da li je podela prezentacije na podoblasti logi~na? Da li su nazivi veza dovoljno jasni tako da znate
gde }e vas odvesti pre nego što mišem pritisnete na njih?
Da li se materijalom unutar svake podoblasti lako upravlja?
Da li moète lako da uo~ite povezani tekst i slike?
Upravljivost:
 Da li moète, pre nego što mišem pritisnete na vezu, da odredite šta }e biti dato na svakoj
povezanoj stranici?
 Kako "krstarite" unutar stranice?
 Kako "krstarite" izme|u stranica prezentacije?
 Da li imate izbor kada je u pitanju navigacija? Da li moète da trasirate svoju putanju kroz
materijal ili morate da sledite postavljenu putanju?
 Da li postoji neki oblik neposredne pomo}i u slu~aju da ne moète da na|ete ono što èlite?
Razmišljajte o svemu ovome kada budete pravili svoju Web prezentaciju.
14
PRAVLJENJE WEB PREZENTACIJE
Kada osmislite sta bi trebalo da ima od sadzaja na jednom sajtu, obzirom da je konkretan sadrzaj to sto
najvise privlaci ili odbija posetioce Web prezentacije, sledeci korak u formiranju kvalitetne prezentacije
predstavlja odabir navigacije koja ce se protezati kroz sajt. Navigacija na sajtu sluzi posetiocu kao vodic do
sadrzaja koji ga zanima. Sto je navigacija kvalitetnija posetilac ce lakse nalaziti trazene sadrzaje i cesce ce
dolaziti na sajt.
Objavljivanje na Webu je evoluiralo na isti na~in kao što je evoluirala obrada teksta. Nekada su
korisnici u programima za obradu teksta morali da koriste specijalne kodove kada su èleli neka specijalna
formatizovanja teksta. Naprimer, da bi imali tekst ispisan kurzivom, korisnici su morali da obezbede kôd koji je
saopštavao štampa~u kada da po~ne da štampa, a kada da prestane sa tom vrstom ispisa. Zatim su programi za
obradu teksta postali prefinjeniji, tako da korisnici danas ne moraju da znaju specijalne kodove da bi
formatizovali tekst, ve} samo na koje dugme treba da pritisnu mišem.
Ve}ina Web stvaralaca koristi kodove prilikom pravljenja Web stranica, ali postoje programi koji
omogu}uju da pravite Web stranice bez poznavanja tih kodova ili kontrolnih oznaka (engl. tags).
Sa aspekta pretrazivaca, META tagovi pruzaju mogucnost odredjivanja opisa Web stranice kada se
ona nadje u rezultatu pretrazivanja i mogucnost definisanja kljucnih reci i fraza koje opisuju sadrzaj stranice.
META tagovi pruzaju mogucnost definisanja kljucnih reci i opisa kod Web stranica cija struktura je
takva da ne postoji drugi nacin da neki program pronadje sta je sadrzaj stranice. U pitanju su stranice sa
ramovima (frames), stranice bez teksta, stranice sa malo teksta, stranice koje u svom pocetku imaju skriptove,
applete ili veliki broj definisanih tabela. . .
Mnoge stranice koje vidite na Internetu napravljene su pomo}u nizova kodova napisanih koriš}enjem
hipertekstualnog markerskog jezika (engl. HyperText Markup Language - HTML). Potom Web pretraìva~i,
kao što su Internet Explorer ili Netscape Navigator, interpretiraju i prikazuju te kontrolne oznake. Pretraìva~
interpretira tekst, slike i formatizovanje. Potrebno je nekoliko datoteka da bi se prikazao sadràj jedne stranice.
Napravljena HTML datoteka sadrì samo kôd, a potrebne su posebne datoteke za slike, video ili animacije koje
}e biti prikazane na stranici.
Pošto pravite prezentaciju u Dreamweaveru, svoj rad preliminarno moète da pregledate u Internet
Exploreru ili Netscape Navigatoru.
POKRETANJE DREAMWEAVERA
Prvi korak je da prona|ete i pokrenete Dreamweaver.

Kada pokrenete Dramweaver po prvi put vide}ete glavni prozor, koji se zove prozor Document, i
nekoliko plutaju}ih (pomerljivih) panela, odnosno, paleta.
Dremweaverovo radno okruènje zajedno sa plutaju}im prozorima.

15
Prozor Document je centar aktivnosti u Dreamweaveru. On prikazuje teku}i dokument dok ga pravite i
ure|ujete.
Koristi}ete prozor Document i njegovu vernu flotu panela za sve, od tipografije do animacije.
Dreamweaver vam moè olakšati rad, bez obzira na to da li kreirate jednostavnu mati~nu stranicu ili veliku i
kompleksnu prezentaciju. Ako ste koristili Dremweaver i ranije, prva razlika koju }ete primetiti jeste nova
paleta alatki koja ima opcije za brzo poigravanje sa kodom i za upravljanje datotekama.
Glavne komponente koje }u ovom prilikom predstaviti jesu:
16
 Launcher,  Styles,
 prozor Site,  panel Objects i
 paleta HTML  panel Property
LAUNCHER
Launcher vam pruà lak na~in, jednim pritiskom mišem, da otvorite neke dodatne alatke u
Dreamweaveru. Pritisnite dugme Launcher i prozor ili panel }e se otvoriti. Pritisnite na isto dugme i prozor }e se
zatvoriti. U radu sa Launcherom bitno je da znate i ovo:
 Pritisnite dugme Direction da biste promenili

orijentaciju Launchera.
 Ako zatvorite Launcher pa poèlite ponovo da ga
otvorite, odaberite Window > Launcher iz linije
menija prozora Document. ~ak i kada je prozor
Launcher zatvoren, njegova mini verzija }e biti
vidljiva u donjem desnom uglu prozora Document, kao
što se vidi na slici.
 Kada je prozor Dreamweaver otvoren, njegovo dugme
Launcher izgleda kao da je "pritisnuto".
 Na traci Launcher, na statusnoj liniji prozora
Document, sve njegove aktivne karakteristike }e biti
"osvetljene".
 Ako iz nekog razloga ne èlite da se Launcher pojavi na statusnoj liniji, moète ga ukoniti s nje. Iz linije
menija prozora Document odaberite Edit > Preferences. Pojavi}e se okvir za dijalog Preferences. Iz liste Category
odaberite Status Bar. U panelu Status Bar okvira za dijalog, uklonite potvrdu iz polja Show Mini-Launcher in
Status Bar. Kasnije ga uvek moète ponovo odabrati.
SITE
Prozor Site je alatka koju koristite da biste organizovali svoje datoteke na lokalnoj prezentaciji, na disku,
kao i da biste te datoteke postavili na udaljenoj Web prezentaciji. U njemu radite standardne operacije odràvanja
datoteka, kao što su pravljenje novih HTML dokumenata, otvaranje, pregledanje i premeštanje datoteka, pravljenje
direktorijuma i brisanje stavki. Tako|e, moète ga koristiti za prenos datoteka izme|u lokalne i udaljene Web
lokacije, kao i za postavljanje navigacije prema mapi lokacije.Inicijalno, udaljena lokacija ili mapa lokacije
pojavljuje se u levom oknu prozora, a lokalna lokacija u desnom oknu. Ovo moète promeniti podešavanjem
parametara izborom u meniju Edit stavke Preferences.
17
PALETA HTML STYLES
Paleta HTML Styles vam omogu}ava da pravite stilove za tekst u obi~nom HTML
kodu, koji su sli~ni stilovima za tekst u programima Word ili QuarkExpress. HTML stil
je definisan sa jednom ili više kontrolnih oznaka koje se primenjuju na formatizovanje
teksta. Verziju HTML 4.0 definisao je još 1998. godine W3 konzorcijum, koji sada
preporu~uje koriš}enje kaskadnih listova stilova (engl. CSS style sheets). Me|utim, u
praksi, HTML kodiranje podràva ve}i broj pretraìva~a nego kaskadne listove stilova i
prili~no je rašireno me|u programerima.
PANEL OBJECTS
Panel Objects nudi dugmad koja su pre~ice za umetanje uobi~ajenih elemenata stranica.
Za komforman rad sa ovim panelom potrebno je da znate slede}e:

 Da biste prikazali ili sakrili panel Objects:
1. Iz linije menija prozora Document odaberite Window > Objects ili pritisnite Ctrl+F2 (Command+F2).
Panel Objects }e se pojaviti.Panel Objects sadrì sedam kategorija: Characters, Common, Forms,
Frames, Head, Invisibles i Special.
 Da biste promenili kategorije panela Objects:

1. Pritisnite na strelicu za meni na vrhu panela Objects. Pojavi}e se priru~ni meni.
2. Odaberite kategoriju iz priru~nog menija. Panel Objects }e prikazati skup koji ste odabrali.
 Da biste umetnuli objekat:

1. Dok su prikazani i panel Objects i aktuelna stranica, pritisnite na ikonu za objekat koji èlite da
umetnete.Ako je Dreamweaveru potrebno više informacija da bi umetnuo objekat, pojavi}e se okvir
za dijalog.
2. Popunite okvir za dijalog ako je potrebno i pritisnite OK. Objekat }e se pojaviti u prozoru Document.
18
 Da biste izabrali i prepravili objekat:

1. Ve}inu objekata moète da izaberete tako što }ete ih ista}i ili pritisnuti na njih mišem. Kada je
objekat izabran, pregled Property }e prikazati njegova svojstva.
Da biste umetnuli odre|eni objekat pritisnite na dugme u panelu Objects. Dok u panelu Objects prelazite
preko dugmi}a, za svaku alatku pojavljiva}e se savet da vas podseti šta koje dugme radi.
Pritisnite na strelicu za meni da biste dobili priru~ni meni kategorija panela Objects.
PANEL PROPERTY
Ovaj panel vam omogu}ava da utvrdite i podesite svojstva za trenutno izabrani element stranice. (Element
stranice je neki objekat ili tekst.) Elemente stranice moète izabrati ili u prozoru Document ili prozoru Code
Inspector.
Da biste ovaj panel prikazali na ekranu ili ga sklonili sa ekrana, izaberite u meniju Window stavku
Properties.
Ve}ina izmena koje napravite na svojstvima neposredno se primenjuje u prozoru Document. (Za neka
svojstva izmene se ne primenjuju sve dok mišem ne pritisnete izvan polja za prepravljanje tog svojstva, dok ne
pritisnete taster Enter ili pritiskom na tabulator ne pre|ete na drugo svojstvo.)
Sadràj panela se menja u zavisnosti od izabranog elementa. Da biste dobili informacije o odre|enim
svojstvima, izaberite element u prozoru Document, a zatim pritisnite mišem na ikonu Help u gornjem desnom uglu
panela.
Panel inicijalno prikazuje naj~eš}e koriš}ena svojstva izabranog elementa. Pritisnite mišem na strelicu za
proširenje u donjem desnom uglu panela da biste videli preostala svojstva elementa. (U retkim slu~ajevima moè se
desiti da se neka re|e koriš}enja svojstva ne pojave ~ak ni u ovom proširenom prikazu; u tim slu~ajevima koristite
prozore Code Inspector ili Code da biste "ru~no" videli kôd tih svojstava.)
19
PRAVLJENJE LOKALNE PREZENTACIJE
Da biste napravili na svom disku lokaciju za Web prezentaciju potrebno je da uradite slede}e:
1. Pokrenite Windows Explorer i u njegovom meniju File izaberite stavku New/Folder; napravite
novi direktorijum za smeštaj prezentacije. Tom direktorijumu dodelite naziv www, a zatim
zatvorite Explorer.
2. Pokrenite Dreamweaver i u meniju Site izaberite stavku New Site.
3. U okviru za dijalog Site Definitions izaberite u listi Category stavlu Local Info.
4. U polje Site Name upišite Moj kurs.
5. Izaberite direktorijum napravljen u koraku 1 za Local Root Folder.
6. Uklju~ite opciju Cache ukoliko èlite da ubrzare vezu ka lokaciji u cilju efikasnijeg rada. Me|utim,
kada se radi o malim prezentacijama sa nekoliko stranica, veza i slika, keširanje nije neophodno.
7. Na kraju, pritisnite dugme OK.
Na ekranu se pojavljuje prozor Site vaše lokacije, koji je prikazan na slede}oj slici.
DODELJIVANJE NASLOVA WEB STRANICI
Dok je još prozor Document otvoren treba da dodelimo naslov web stranici na ~ijem oblikovanju }emo
raditi tokom ovog kursa.
Na liniji alatki mišem pritisnimo u polje Title i upišimo naslov stranice za naš kurs. Naslov koji smo
upisali ne}e se pojaviti na web stranici, ali }e se pojaviti na naslovnoj liniji prozora pretraìva~a.
20
SNIMANJE WEB STRANICE U DATOTEKU
U meniju File izaberimo stavku Save i na ekranu }e se pojaviti okvir za dijalog Save As.
Prona|imo direktorijum WWW na lokalnom disku pošto }emo u njemu ~uvati web stranicu. Potrebno je
da dodelimo naziv datoteci sa kojom radimo. Taj naziv treba da je druga~iji od naslova same stranice; on se ne}e
pojaviti na web stranici, ali }emo ga mi videti kada budemo organizovali i povezivali web datoteke.
Dodelimo datoteci naziv index.html. Glavna stranica web lokacije se ~esto naziva index.html ili
default.html. Ovaj princip dodeljivanja naziva olakšava posetiocima da prona|u stranicu na lokaciji.
Pritisnimo dugme Save.
NAPOMENA: Na~in na koji ste dodelili naziv web stranicama moè da uti~e na njihovo ponašanje pošto
ih postavite na web lokaciju. Naime, mnogi web serveri prave razliku izme|u malih i velikih slova i ne prihvataju
nazive ispisane velikim slovima, zato preporu~ujem da uvek koristite samo mala slova.
FORMATIZOVANJE TEKSTA
Sada ste spremni da upišete tekst na svoju web stranicu. Prva stvar koju treba da uradite je da upišete
osnovne informacije o kursu, a zatim da ih formatizujete, tj. da definišete njihov izgled na ekranu. Za tu svrhu
koristi}emo paletu Property Inspector, koja omogu}uje da menjamo font i formatizovanje. Ukoliko paleta nije
prikazana na ekranu, u meniju Window izaberite stavku Properties.
U prozoru Document, mišem ozna~imo naziv dokumenta.

Na paleti Property Inspector mišem otvorimo padaju}u listu Format i izaberimo stavku Heading 1. Na
webu se koriste naslovi razli~ite veli~ine. Heading 1 je najve}i, a Heading 6 je najmanji.
Pritisnimo mišem negde ispod naslova, kako više ne bi bio ozna~en.
Pritisnimo taster Enter i upišimo drugi red teksta, recimo, kratak opis našeg kursa.
Ozna~imo mišem drugi red teksta i u listi Format izaberimo stavku Heading 3.
Pritisnimo mišem na kraj našeg podnaslova (drugog reda teksta), kako više ne bi bio ozna~en. Pritisnimo
taster Enter i proverimo da li je na listi Format postavljena stavka Paragraph, ukoliko nije, izaberimo je. Sada smo
spremni za upisivanje nekog uvodnog teksta o web lokaciji.
Upišimo sada tekst.
21
NAPOMENA: Kada stavljate materijal kursa na web, preporu~uje se da date kratak uvod u kurs. On
treba da informiše posetioce lokacije o sadràju kursa, potrebnom predznanju i prate}im resursima. Tako|e, pri vrhu
stranice moète da stavite svoje ime, elektronsku adresu itd.
MENJANJE IZGLEDA TEKSTA POMO]U PROPERTY INSPECTORA
Ozna~imo mišem bilo koju re~ na stranici i pritisnimo mišem na ikonu na kojoj je ispisano slovo B, koja
se nalazi paleti Property Inspector. Ozna~ena re~ }e sada biti ispisana podebljanim (tzv. masnim) slovima.
Da bi izgled ozna~ene re~i vratili u prethodno stanje, pritisnimo mišem ponovo na istu ikonu ili u meniju
Edit izaberimo stavku Undo.
Da bi promenili veli~inu slova, ozna~imo mišem neki tekst i sa padaju}e lista Size izaberimo neku od
ponu|enih veli~ina. Ovog puta veli~ine su u opsegu od 1 do 7. Najmanjoj veli~ini odgovara 1, a najve}oj 7.
Veli~ina 3 je standardna veli~ina slova, ili podrazumevana veli~ina.
Da bi promenili boju teksta, ozna~imo mišem tekst i pritisnimo mišem na sivi kvadrat koji se nalazi desno
od liste Size na paleti Property Inspector. Na ekranu se pojavljuje paleta boja, a pokaziva ~ miša menja oblik u
kanticu sa bojom.
Izaberimo mišem èljenu boju. Polje koje se nalazi desno od palete boja prikazuje kôd boje koji je
potreban pretraìva~u da bi verno prikazao boju koju smo izabrali.
Pritisnimo pokaziva~em miša na stranicu, van teksta, kako ne bi bio više ozna~en. Prethodno ozna~en
tekst se sada pojavljuje u novoj boji.
NAPOMENA: Sve prethodno navedene komande za formatizovanje teksta mogu se izabrati i iz menija
Text.
22
RASPORE\IVANJE TEKSTA
Liste i poravnavanja mogu da pomognu posetiocima web lokacije da brzo prona|u informacije koje èle.
U ovom odeljku }e biti opisano kako se prave liste i poravnava tekst.
Pritisnimo mišem ispod podnaslova i upišimo slede}e:
 Osnovne informacije:
 Plan kursa
 Predava~
 Materijal za kurs
 Resursi
Posle upisivanja svake stavke pritisnite taster Enter, kako bi slede}a stavka bila u novom redu.
Ozna~imo mišem stavku Osnovne informacije: i na paleti Property Inspector sa liste Format izaberimo
stavku Heading 3.
Ozna~imo mišem sve ~etiri upisane stavke i na paleti Property Inspector pritisnimo dugme Unordered
List. Stavke su sada prikazane kao nenumerisana lista.
Pre|imo u novi pasus i pritiskom mišem na dugme Unordered List, isklju~imo dodeljivanje grafi~kog
ornamenta stavkama liste.
Upišimo sada slede}i tekst:
 Ve`be:
 Laboratorija
 Projekti
 Prezentacija
Ozna~imo mišem re~ Ve`be: i na paleti Property Inspector izaberimo Heading 3. Ozna~imo mišem sve
~etiri upisane stavke i na paleti Property Inspector pritisnimo dugme Ordered List. Stavke su sada prikazane kao
numerisana lista.
Tekst moèmo rasporediti i poravnavanjem. Ozna~imo mišem prva dva reda teksta (naslov i podnaslov), a
zatim na paleti Property Inspector pritisnimo dugme Align Center. Naslov i podnaslov su sada centrirani.
Za kraj, u meniju File izaberite stavku Save i snimite svoj rad u datoteku.
DODAVANJE SLIKE
Kada oblikujete kurs na Web lokaciji, slike se mogu koristiti za vizuelno predstavljanje informacija. Slike
mogu da "ilustruju" obrazovni sadràj, koji pomaè u razumevanju i prihvatanju sadràja.
Slike i grafika na Web stranici mogu da:
 Privuku pa`nju;
 Poboljšaju razumevanje;
 Poboljšaju usvajanje sadràja i
 Pripreme okruènje za koncept povezivanja.
Da biste dodali sliku Web dokumentu, potrebno je da nazna~ite gde se slika nalazi. Doda}emo sliku koja
se nalazi u direktorijumu slike na lokalnom disku.
1. Pritisnite mišem iznad liste i pritisnite taster Enter. Tako|e, pritisnite mišem na dugme Ordered
List da biste isklju~ili numeraciju stavki.
2. 2.U meniju Insert izaberite stavku Image. Na ekranu }e se pojaviti okvir za dijalog Select Image
Source.
3. Koriste}i okvir za dijalog prona|ite sliku Oblnas.gif u direktorijumu kurs_slike i pritisnite dugme
Select.
23
NAPOMENA: Dreamweaver }e nas upozoriti da se slika ne nalazi unutar direktorijuma za kurs i

predloìti da je iskopira u njega.
Slika se pojavljuje na Web stranici. Ova slika verovatno ne}e odgovarati sadràju vašeg kursa, ali ona
ovde sluì samo da demonstriramo proceduru smeštanja slike na Web stranu.
BROJ I VELIÎNA SLIKA NA STRANICI

Pravilo je jednostavno - sto je vise slika, stranica se sporije ucitava. Mnoge firme i eksperti iz ove oblasti
preporucuju razlicita resenja, a mi cemo se zadrzati na najjednostavnijim i najefektnijim:
Pokusajte da ne koristite sliku kao pozadinu. Ako to hocete, koristite sliku koja nije velika ( 1 - 3 kB), ili
nije suvise mala (nekoliko Byte-ova). Ovo drugo mozda deluje cudno, ali sto je manja slika treba vise vremena da
se popuni ekran.
Na mestu gde u HTML kodu stoji informacija o slici (<img src. . .>) trebalo bi da stoji informacija o sirini
i visini slike (width, height) u pikselima, npr.
<img src="imeslike.gif" height="100" width="100">.
U Dreamwiver-u ovu informaciju korisnik sam odredjuje kada se pri postavljanju slike odredi format
slike i Dreamwiver odmah prihvata format slike koji ste upisali.
Ovo je bitno zbog toga sto ako ne postoji ova informacija, browser (MSIE, Netscape), mora sam da
odredi koja je velicina u pitanju, i vreme se gubi.
Ako imate veliku sliku ili bilo koji drugi multimedijalni sadrzaj (animacija, film, zvuk) koji zelite da
pokazete, dobro je prvo dati informaciju o tome na stranici, sa linkom do sadrzaja (i velicinom, po mogucnosti). U
slucaju slika, moze se dati umanjena slika (komanda LowSrc) ili jednostavan link od umanjene slike do slike u
pravoj velicini.
Puno malih slika se sporo ucitavaju, jer se ucitava jedna po jedna slika, naizmenicno, dok se sve ne
ucitaju. Ovo pravilo je narocito korisno za slike u kojima se nalazi samo tekst.
UKLANJANJE SLIKE
U ovom odeljku }ete nau~iti kako da koristite tabele da biste postavili slike i tekst jedne pored drugih. Da
bismo to uradili potrebno je da se malo više pozabavimo radom sa tabelama. Me|utim, prvo }emo obrisati
prethodno dodatu sliku da nam ne bi smetala u postavljanju tabele.
1. U prozoru Document ozna~imo mišem sliku.

2. Pritisnimo taster Delete na tastaturi. Slika nestaje sa Web stranice.
24
3. Da bismo poništili prethodnu operaciju, tj. povratili prvobitno stanje potrebno je da u meniju Edit
izaberemo stavku Undo. Slika se ponovo pojavljuje na Web stranici.
4. Snimite svoj dosadašnji rad u datoteku.
PRELIMINARNI PREGLED STRANICE
Dok pravite stranicu u Dreamweaveru, ona ne}e uvek imati izgled na ekranu kao što }e biti kada se
postavi na Web server. Potrebno je da povremeno preliminarno pregledate stranicu u svom pretraìva~u (Explorer
ili Netscape).
Da biste preliminarno pregledali stranicu u meniju File izaberite stavku Preview in Browser, a zatim u
podmeniju izaberite pretraìva~. Pokre}e se izabrani pretraìva~ i u~itava stranicu.
Napomena: Ukoliko u listi pretraìva~a nema definisanog ni jednog pretraìva~a, tada }ete morati da
konfigurišete Dreamweaver da uklju~i vaš omiljeni pretraìva~. U meniju Edit izaberite stavku
Preferences/Preview in Browser i definišite pretraìva~.
Sada se vratite u Dreamweaver. (Na dnu ekrana je paleta Taskbar koja prikazuje trenutno aktivne
programe. Pritisnite dugme na kome piše Dreamweaver ... .)
UPOTREBA PALETE HISTORY
Paleta History u Dreamweaveru vam omogu}ava da se vratite na neko od prethodnih stanja u procesu
pravljenja Web stranice; u suštini, ona omogu}uje "neograni~en povratak u prošlost". Ovo svojstvo je veoma
pogodno ukoliko ste poprili~no odmakli u pravljenju Web stranice a onda odlu~ili da znatno izmenite dizajn, što za
sobom povla~i niz promena.
1. Ukoliko na vašem ekranu nije prikazana ova paleta, tada je potrebno da u meniju Window
izaberete stavku History.
2. Pro|ite kroz stavke palete History. Sve akcije koje ste preduzeli tokom pravljenja Web stranice su
tu zabeleène.
3. Na dnu liste, na levoj strani, nalazi se mali kliza~ koji sada moète da pomerite naviše na
prethodnu stavku. Time ste poništili umetanje slike na Web stranicu.
4. Prevucite kliza~ do stavke Insert Image i slika }e se ponovo pojaviti na stranici.
5. Kada završite pregled istorijata rada na stranici, pritisnite mišem na dugme Close da zatvorite
paletu History.
25
Kako se pomerite na stavku iz prošlosti, ona dobija sivu boju a stranica se vra}a na izgled koji je imala
pre nego što je ta stavka (akcija) primenjena.
NAPOMENA: Ukoliko se vratite jedan ili više koraka unazad, zatim primenite druge akcije, izgubi}ete
kompletan istorijat ispod te ta~ke i ne}ete više mo}i da rekonstruišete te akcije.
PRAVLJENJE TABELE
Jedan od na~ina da rasporedite tekst i slike je da koristite tabele, tj. mreù redova i kolona. Tabela moè
da se koristi da se tekst i slika smeste jedno pored drugog. U ovom odeljku napravi }emo tabelu koja }e prikazivati
datume i nastavne jedinice koje }e se tada predavati u okviru kursa.
1. Pritisnite mišem na dno stranice. Pritisnite taster Enter i upišite: "Nastavni program". Tako|e,
moète dodati semestar i kalendarsku godinu: "letnji semestar 2002. godine".
2. Ozna~ite "Nastavni program" i definišite da je stil formatiranja Heading 2. Pritisnite mišem u
prozor Document da deaktivirate izbor teksta.Pritisnite taster Enter. Sada }emo ubaciti tabelu
koju sa~injavaju dva reda i dve kolone.
3. U meniju Insert izaberite stavku Table. Na ekranu se pojavljuje okvir za dijalog Insert Table.
4. U polje Rows: upišite 2.
5. U polje Columns: upišite 2. Ostale parametre tabele ovog puta ne}emo menjati, tj. podešavati.
6. Pritisnite dugme Ok. Na ekranu se pojavljuje tabela sa zadatim brojem redova i kolona. Svaki
pravougaonik u tabeli se ozna~ava kao }elija.
7. Pritisnite mišem u gornju levu }eliju tabele. Upišite "Datum predavanja". Pritisnite taster Tab da
biste se prebacili u slede}u }eliju u tabeli.
8. U }eliji gde se sada nalazi kursor upišite "Tema", a potom pritisnite taster Tab da se prebacite u
slede}i red.
9. U teku}oj }eliji upišite datum. Prebacite se u slede}u }eliju i upišite naziv nastavne jedinice
kursa. Ukoliko je naziv duga~ak, prelom reda }e se obaviti unutar }elije.
10. Pritisnite taster Tab i tabeli }e biti dodat novi red. Upišite datum i naziv druge nastavne jedinice u
tre}i red tabele.
Tabela na vašoj stranici treba da ima izgled kao što je prikazano na slede}oj slici.
26
27
UMETANJE SLIKE U TABELU
U tabelu moète staviti i sliku. To se radi tako što pritisnete mišem u }eliju u koju èlite da stavite sliku, a
zatim prona|ete sliku koju èlite da stavite.
1. Pritisnite taster Tab da biste dodali tabeli novi red. Pritisnite mišem u desnu }eliju.
2. Ukoliko paleta Objects nije prikazana na ekranu, u meniju Window izaberite stavku Objects.
3. Pritisnite mišem na ikonu Insert Image koja se nalazi u gornjem levom uglu palete. Na ekranu se
pojavljuje okvir za dijalog Select Source Image.
4. Prona|ite i ozna~ite sliku u direktorijumu kurs_slike, a zatim pritisnite dugme Select. Slika
Oblnas.gif se pojavljuje u }eliji tabele.
DODAVANJE NOVOG REDA
Pošto ste napravili tabelu, mo`da }e biti potrebno da dodate neke informacije u sredinu tabele. Mogu}e je
dodavati redove i kolone kako bi se tabela proširila.
Pritisnite mišem u drugi red tabele. U meniju Modify izaberite stavku Table, a zatim Insert Row. U tabeli
se pojavljuje novi red.
Pritisnite mišem u drugu kolonu novododatog reda i ubacite sliku skola_logo.gif, koja se nalazi u
direktorijumu kurs_slike. Slika se pojavljuje u }eliji.
]elija koja se nalazi uz sliku je prazna. Pritisnite mišem u tu }eliju i upišite naziv predavanja.
BRISANJE REDA
Tabela se, tako|e, moè podešavati uklanjanjem nepotrebnih redova i kolona.
1.Pritisnite mišem u drugi red tabele. U meniju Modify izaberite stavku Table, a zatim Delete Row. Red i
njegov sadràj nestaju iz tabele.
Da vas podsetim, uvek moète da poništite akciju koriš}enjem komande Undo.
28
MENJANJE VELIÎNE KOLONE
]elija koja sadrì sliku ima širinu ve}u nego što je potrebno. Moèmo promeniti širinu kolone tako da
odgovara dimenzijama slike, tj. da nema belina oko slike.
1. Postavimo pokaziva~ miša na grani~nu liniju izme|u kolona. Pokaziva~ dobija oblik dvostrano
orijentisane strelice.
2. Pritisnimo miša i povucimo ga ka desnoj ivici tabele i otpustimo taster na mišu. Širine kolona su
promenjene.
3. Postavimo pokaziva~ miša na desnu ivicu tabele. Pritisnimo miša i povucimo ga ulevo kako bi
ponovo promenili veli~inu tabele.
4. Snimite svoj rad u tabelu, a potom u pretraìva~u obavite preliminarni pregled.
5. Sada se iz pretraìva~a vratite u Dreamweaver.
NAPOMENA: Verovatno }ete prilikom preliminarnog pregleda uo~iti da kako menjate veli~inu
prozora pretraìva~a da se menja i veli~ina tabele, tako da se opet mogu pojaviti beline oko slike u }eliji tabele.
Zašto se to dešava? Razlog za to je u ~injenici da se širina tabele izraàva u procentima ukupne širine prozora
pretraìva~a, u ovom slu~aju je to 75%. Ukoliko èlite da fiksirate tabelu na odre|enu veli~inu, morate dimenzije
tabele da izrazite druga~ije.
DEFINISANJE FIKSNE VELIÎNE TABELE
Dimenzije tabele mogu biti izraène kao fiksne koriš}enjem piksela. Piksel je ta~ka grafi~ke slike. Ekrani
se sastoje od hiljada (ili miliona) piksela koji su ure|eni u redove i kolone. Kod Web stranica preporu~uje se da
širina tabele ne bude ve}a od 550 piksela. (Podrazumeva se da se radi o rezoluciji ekrana dimenzija 640x480
piksela.)
1. Pritisnite mišem na tabelu. Zatim, u donjem levom uglu prozora stranice pritisnite mišem na
kontrolnu oznaku <table> (vidi sliku) da biste izabrali celu tabelu.
<TABLE> je HTML kontrolna oznaka koja iscrtava tabelu na ekranu, a Dreamweaver ga ovde koristi
kao simbol da predstavi tabelu u celini.
NAPOMENA: Verovatno ste primetili polje W koje je prikazano u Property Inspectoru. Ono
ozna~ava širinu tabele koja je izraèna u procentima. Ukoliko èlite da fiksirate veli~inu tabele, potrebno je da
zadate veli~inu u pikselima.
2. U Property Inspectoru pritisnite mišem na strelicu pored polja sa znakom % i izaberite pixels. U
polje W upišite 550. Ovime ste definisali širinu tabele na 550 piksela.
3. Pritisnite mišem bilo gde u prozoru Document da deaktivirate izbor tabele.Koliko prostora je
potrebno za svaku kolonu? Dvokolonska tabela treba da ima uù levu a širu desnu kolonu.Na
primer, leva kolona bi mogla biti širine 150 piksela. Tada }e desna kolona biti širine 550 - 150 =
400 piksela. Sada }emo zadati ove širine kolona.
4. Da biste izabrali desnu kolonu tabele potrebno je da postavite pokaziva~ miša iznad te kolone,
kada pokaziva~ promeni oblik u zatamnjenu strelicu usmerenu naniè pritisnite taster na mišu.
Kolona je sada izabrana (aktivna) i svaka }elija kolone je zatamnjena.
5. Proširite Property Inspector pritiskom miša na trougao u donjem desnom uglu kako biste videli
širinu }elije tabele.
6. Paleta bi trebala da ima izgled prikazan na slede}oj slici.
29
7. Širina kolone tabele moè se promeniti u Property Inspectoru.

8. Pritisnite mišem na polje W na dnu palete. Upišite veli~inu od 400 piksela.
9. Izaberite levu kolonu tabele i promenite njenu širinu na 150 piksela.
10. Snimite svoj rad u datoteku i preliminarno pregledajte stranicu u pretraìva~u. Promenite veli~inu
prozora pretraìva~a da biste se uverilida se sada veli~ina tabele ne menja.
11. Vratite se iz pretraìva~a u Dreamweaver.
FORMATIRANJE TABELE
1. Kompletirajmo tabelu formatiranjem teksta. Izaberite prvi red tabele tako što }ete postaviti
pokaziva~ miša na po~etak reda, pritisnuti taster na mišu i prevu}i pokaziva~ preko svih }elija u
redu.
2. Sadràj reda formatirajte kao Heading 3. Zadrìte aktivnim izabrani red da biste promenili boju
pozadine }elija.
3. Da biste definisali boju pozadine reda, potrebno je da mišem pritisnete na kvadrati } (u okviru
koga se nalazi paleta boja) pored oznake Bg na paleti Property Inspector.
4. Sa palete boja izaberite èljenu boju.

5. Pritisnite mišem izvan tabele da deaktivirate izbor reda. Red je sada obojen izabranom bojom.
6. Isprobajte razne opcije formatiraju}i ostatak tabele koriste}i alatke Property Inspectora.
Promenite veli~inu fonta teksta, boju i stil teksta, kao i poravnavanje.
7. Snimite svoj rad u datoteku i obavite preliminarni pregled u pretraìva~u, a potom se vratite u
Dreamweaver.
Dreamweaver ima ~ak i ugra|ene neke formate koje moète koristiti za brzo podešavanje izgleda tabele.
1. Izaberite tabelu.
2. U meniju Commands izaberite stavku Format Table.
3. Na ekranu se pojavljuje okvir za dijalog Format Table sa nizom opcija. Lista opcija se pojavljuje
u gornjem levom uglu okvira za dijalog. Pritisnite mišem na neku od ponu|enih stavki i u okviru
koji se nalazi desno vide}ete uticaj tog stila formatiranja na izgled tabele.
30
4. Izaberite èljeno formatiranje i pritisnite dugme Apply. Izabrano formatiranje se primenjuje na

tabelu.
5. Kada završite sa formatiranjem pritisnite dugme OK.
6. Snimite svoj rad u datoteku.
Pravljenje druge Web stranice

Sada }emo napraviti drugu stranicu za Web lokaciju. Ova stranica }e biti stranica sa resursima potrebnim za kurs,
kao što su ud`benici, priru~nici, uputstva za laboratorijske ve`be itd. Još jednom }u vas podsetiti na planiranje
stranice.
Planiranje stranice:
Kada planirate Web lokaciju kursa bi}e potrebno da odlu~ite kako }ete da organizujete svaku Web stranicu. Šta }e
biti postavljeno na svaku stranicu? (Na primer, nastavni program, veze ka resursima na Webu, prate}a literatura,
ve`be, on-line diskusija itd.) Izdelite lokaciju na stranice kako bi pristup bio što jednostavniji. Ukoliko vaši studenti
èle da ~itaju ili štampaju samo kalendar kursa, tada oni ne}e èleti da štampaju kompletan sadràj Web lokacije da
bi videli samo kalendar. Tako|e, u fazi planiranja treba da razmotrite kako }e stranice me|usobno biti povezane.
Vratimo se sada na pravljenje druge stranice.

1. U meniju File izaberite stavku New. Svakako }ete èleti da novom dokumentu date nov i opisan naslov
tako da vaši posetioci mogu da ga prona|u traè}i relevantne informacije.
2. Dodelite naslov novoj stranici. U meniju Modify izaberite stavku Page Properties i upišite naslov (tj.
"Resursi za kurs" ... ). Po upisivanju pritisnite mišem na dugme OK.
3. Upišite na vrhu stranice identifikacioni broj i naziv kursa. U drugom redu stranice upišite "Resursi za
kurs".
4. Sada upišite neke od resursa.
5. Formatirajte sadràj stranice koriste}i opcije palete Property Inspector.
6. Snimite svoj rad u datoteku. Dodelite dokumentu naziv resursi.html i snimite ga u direktorijum www .
31
Pravljenje veze
Pre nego što pristupimo pravljenju veza, potrebno je da ih dobro isplanirate
Planiranje veza:
Kako }e stranice me|usobno biti povezane? Kada planirate Web lokaciju kursa bi}e potrebno da odlu~ite kako da
organizujete veze izme|u svih stranica.
Prakti~no je da veze ka drugim stranicama postavite na vrhu i dnu svake stranice. Tako|e, svaka stranica treba da
bude povezana sa vašom mati~nom stranicom (index.html).
Pošto imamo dve Web stranice moèmo da ih poveèmo. Poveza}emo stranicu resursi.html sa glavnom stranicom
index.html.
U Dreamweaveru pre|imo na stranicu index.html (za to koristimo meni Window). Na toj stranici ozna~imo
nenumerisani tekst: Resursi da bi ga koristili kao vezu /engl. link).Koristi}emo Property Inspector da pravimo vezu.
Ukoliko ne vidite na ekranu pomenutu paletu, u meniju Window izaberite stavku Properties i paleta }e se pojaviti u
prednjem planu. Na paleti Property Inspector pritisnite mišem na ikonu Browse for File (vidi slede}u sliku).
Na ekranu se pojavljuje okvir za dijalog Select HTML File. Koriste}i ovaj okvir za dijalog prona|ite i izaberite
datoteku resursi.html. Pritisnite mišem na dugme Select. Prethodno izabrani tekst je podvu~en i obojen je bojom
koju ste izabrali. Na paleti Property Inspector polje Link o~itava "resursi.html".
Pritisnite mišem na prozor Document da deaktivirate vezu.
Pravljenje veze ka stranici koja se nalazi negde na Webu
Napravi}emo sada vezu ka mati~noj (engl. home) stranici CET-ove Web lokacije kako bi posetioci mogli lako da
pristupe resursima. Pošto se CET-ova mati~na strana nalazi na Webu, mora}emo da damo punu ili apsolutnu
adresu da bi napravili vezu (tj. da}emo tzv. URL - Uniform Resource Locator). Tako|e, moèmo na isti na~in
dodati veze ka drugim stranicama na Webu.
1. Postavimo pokaziva~ miša na dno Web stranice, pritisnimo taster Enter i upišimo tekst koji }emo koristiti
kao vezu: "Posetite školu ra~unara CET".
2. Ozna~ite mišem taj tekst. Da biste definisali vezu ka CET-ovoj mati~noj stranici, potrebno je da znate
njenu adresu: http://www.cet.co.yu/.
3. Na paleti Property Inspector upišite u polje Link adresu http://www.cet.co.yu/ i pritisnite taster Enter. Tekst
" Posetite školu ra~unara CET" postaje veza. (Ista tehnika se koristi ukoliko èlite da dodate vezu ka bilo
kojoj stranici na Webu.)
Napomena: Kada dodajete vezu, mo`da }ete poèleti da uklju~ite kratak opis veze, tj. napomenu zašto je bitna i
ukaète na odgovaraju}e odeljke lokacije.
32
Da biste proverili da li veza radi kako treba, morate da pogledate stranicu u pretraìva~u.
4. Snimite svoj rad u datoteku i pregledajte ga u pretraìva~u.

5. Dok ste u pretraìva~u proverite vezu. Pritisnite mišem na vezu ka resursima. Veza se brzo pojavljuje u
aktivnoj boji, a zatim se pojavljuje stranica resursi.html.
6. Pritisnite mišem na dugme Back. Veza ka resursima pojavljuje se u boji koju smo izabrali da ozna~ava
pose}ene stranice.
7. Testirajte preostale veze. Ukoliko veza ne radi, ponovite postupak iz ovog odeljka.
8. Vratite se u Dreamweaver da biste dodali još neke stvari svojim stranicama.
Pravljenje veze unutar stranice
Veze se mogu koristiti za navigaciju u okviru stranice. Pravljenjem liste sa sadràjem na vrhu stranice, a zatim
povezuju}i je sa drugim odeljcima na stranici omogu}ujete direktnu navigaciju u okviru stranice. Na prvoj stranici
koju smo ranije napravili nenumerisana lista je dodata na vrh te stranice. Sada }emo napraviti vezu od stavke "Plan
kursa" u nenumerisanoj listi ka odeljku "Nastavni program predmeta" koji se nalazi niè na stranici.
Pre nego što moè veza da bude napravljena u okviru stranice, ciljni deo veze treba da bude napravljen. To se
naziva sidro. Na ovoj stranici, sidro }e biti odeljak "Nastavni program predmeta" koji se nalazi u donjem delu
stranice.
Niè na stranici koristi}emo Nastavni program predmeta kao "sidro".
Za po~etak, napravi}emo prvo sidro.
1. Pre|imo na deo stranice koji sadrì tabelu nastavnog programa. Pritisnite mišem na kraj reda "Nastavni
program predmeta".
2. U meniju Insert izaberite stavku Invisible Tags, a iz podmenija stavku Named Anchor.
3. U okviru za dijalog upišite naziv za sidro, tj. Nast i pritisnite dugme OK.
Ukoliko se ne pojavi ùti simbol sidra u meniju View izaberite stavku Visual Aids, a iz podmenija stavku Invisible
Elements.
4. Sada }emo napraviti vezu od vrha stranice ka odeljku Nastavni program predmeta.
5. Na vrhu stranice ozna~imo u nenumerisanoj listi tekst "Plan kursa" da bi ga koristili kao vezu.
6. Na paleti Property Inspector pritisnimo mišem na ikonu Point-to-File (koja se nalazi levo od polja Link) i
prevucimo je na simbol sidra nastavnog programa.
33
7. Kada otpustimo taster na mišu, oznaka #Nast pojavljuje se u polju veze. Stavka "Plan kursa" je sada veza i
podvu~ena je i obojena drugom bojom.
Oblik koji ovaj tip veze koristi je druga~iji od standardne veze. U polju veze pojavljuje se znak # pored naziva
sidra. Znak # ozna~ava da je to veza ka sidru na Web stranici.
Veza ka vrhu stranice
Kada dodate mnoštvo informacija na stranicu, ona postaje prili~no duga~ka i komplikovano je kreatati se kroz njen
sadràj. Da bi se to prevazišlo mogu se dodati navigacione veze kako bi se korisniku omogu}io direktan povratak
na vrh stranice. U ovom primeru napravi}emo koriste}i jednu klju~nu re~ HTML-a (top) koja }e prebacivati
korisnika na vrh postoje}e stranice. Sidro ne mora da se koristi pošto koristimo ugra|eno sidro.
Pritisnimo mišem na dno stranice, upišimo tekst "Vrh stranice" i ozna~imo ga.
Na paleti Property Inspector pritisnimo mišem u polje Link i upišimo kao vezu oznaku #top.
Snimimo rad u datoteku i preliminarno pregledajmo u pretraìva~u. Testirajmo veze.
Pravljenje podno`ja stranice
Na ve}ini Web lokacija informacije za kontakt su stavljene u podno`je (engl. footer; u klasi~nom štamparstvu to se
zove donja ìva kolona) stranice. Podno`je posetiocima pruà informacije o izvoru stranice, uklju~uju}i informaciju
o dizajneru lokacije. Ovo daje dodatnu verodostojnost informacijama koje su stavljene na Web stranice.Tako|e,
nalazi se i informacija o li~nosti koju posetioci lokacije mogu kontaktirati ukoliko ne mogu da prona|u na lokaciji
ono što su traìli. Podno`je, tako|e, sadrì datum poslednjeg aùriranja stranice, što omogu}uje posetiocu da zaklju~i
koliko su informacije aktuelne.
U ovom primeru napravi}emo podno`je za stranicu index.html koje }e imati oblik prikazan na slede}oj slici.
Prva stvar koju }emo dodati bi}e horizontalna linija da bi razdvojili podno`je od ostatka stranice.
34
1. U Dreamweaveru spustimo se do dna stranice index.html i pritisnimo mišem, a zatim pritisnimo taster
Enter da bi napravili novi prazan red.
2. U meniju Insert izaberimo stavku Horizontal Rule. Ozna~ena horizontalna linija se pojavljuje na stranici.
3. Pritisnimo mišem na kraj horizontalne linije, a potom pritisnimo taster Enter. Pokaziva~ miša se sada
pojavljuje u prvom redu podno`ja.
4. Sada }emo dodati odre|ene informacije da bi kompletirali stranicu. Upišite prvo svoje ime.
5. Da biste redove teksta u podno`ju razdvojili za po jedan prazan red drìte pritisnut taster Shift i pritisnite
taster Enter. Drè}i pritisnut taster Shift ubacuje se kontrolni znak za prekid linije umesto znaka za
završetak pasusa.
6. Upišite elektronsku adresu i telefonski broj, a razdvojite ih sa znakom ; ili nekim drugim znakom
interpunkcije. Po upisivanju pritisnite istovremeno tastere Shift i Enter.
7. Upišite naziv odseka i škole, a potom pritisnite istovremeno tastere Shift i Enter.
8. Upišite tekst "Datum poslednje izmene:" i teku}i datum.
Dodavanje veze za elektronsku adresu
Napravi}emo vezu za sopstvenu elektronsku adresu, tako da posetioci mogu da pritisnu mišem na nju i pošalju vam
poštu. Ovo je zgodno svojstvo, ali mo`da ne}e funkcionisati kod svakog pretraìva~a.
Uklju~uji}i vezu za poštu na svojoj stranici pruàte mogu}nost svojim u~enicima i posetiocima lokacije da vas
kontaktiraju ili pošalju povratnu informaciju.
Pre|imo na posao.
1. Ozna~ite mišem svoju elektronsku adresu.
2. Na paleti Property Inspector u polje Link upišite slede}e: mailto: ppecelj@cet.co.yu, odnosno, adresu svoje
e-pošte.
3. Pritisnite taster Enter i vaša adresa }e se pojaviti kao veza.

4. Snimite svoj rad u datoteku i u pretraìva~u testirajte vezu ka svojoj elektronskoj adresi.
Ukoliko veza ka elektronskoj adresi ne radi, ponovite prethodno izloènu proceduru. Proverite informaciju koju ste
upisali u polje Link. Ukoliko i posle ovoga veza ne radi, mo`da vaš Web pretraìva~ nije konfigurisan da šalje e-
poštu.
Kopiranje podno`ja na drugu stranicu
Da biste obezbedili konzistentnost Web lokacije i kontrolu posetiocima treba da uklju~ite podno`je na svaku
stranicu lokacije. Umesto da pravite podno`je na svakoj stranici ponaosob, moète ga kopirati sa prve stranice na
ostale.
1. Vratite se u Dreamweaver.
2. Ozna~ite mišem horizontalnu liniju i celo podno`je.
3. U meniju Edit izaberite stavku Copy.
4. Pre|ite na stranicu resursi.html i pritisnite mišem na dno stranice. U meniju Edit izaberite stavku Paste.
Podno`je se pojavljuje na stranici resursi.html.
35
Napomena: Svrha upisivanja informacije o poslednjem aùriranju stanja na stranici je da se posetiocima
omogu}i uvid koliko su informacije na stranici aktuelne. Taj datum }e varirati od stranice do stranice, u
zavisnosti od prirode sadràja tih stranica.
Veza ka mati~noj stranici Web lokacije
Da biste posetiocima obezbedili ve}u kontrolu, potrebno je da navigaciju izme|u stranica u~inite što prostijom i
direktnijom. Jedan od na~ina da to ostvarite je da poveète svaku od podrànih stranica sa mati~nom stranicom.
36
U ovom odeljku poveza}emo stranicu resursi.html sa stranicom index.html.
1. U prozoru Document u kome se nalazi stranica resursi.html, ozna~ite u podno`ju stavku Odsek.
2. Na paleti Property Inspector, u polju Link upišite index.html i pritisnite taster Enter. Naziv odseka se sada
pojavljuje kao veza.
3. Snimite svoj rad u datoteku i testirajte vezu u pretraìva~u.
Promena boje teksta i pozadine
U ovom odeljku pokaza}u kako da podesite standardnu boju za tekst, kao i za pozadinu i veze. Ovo se radi
koriš}enjem opcija okvira za dijalog Page Properties, koji smo ranije ve} koristili kod dodeljivanja naslova stranici.
1. Prebacite se iz pretraìva~a u Dreamweaver i to na stranicu index.html.
2. U meniju Modify izaberite stavku Page Properties. Na ekranu se pojavljuje okvir za dijalog Page
Properties.
3. Da biste promenili boju teksta pritisnite mišem na kvadrati} pored polja Text (vidi sliku). Pojavljuje se
paleta boja, a pokaziva~ miša menja oblik u pipetu (engl. Eye dropper).
4. Pipetom izaberite èljenu boju za tekst.

5. Da biste promenili boju pozadine, pritisnite mišem na kvadrati} pored polja Background
6. Pipetom izaberite èljenu boju pozadine. Tako|e, moète promeniti boju veza, aktivnih veza i pose}enih
veza. Veza na koju korisnik pritisne mišem postaje u tom trenutku aktivna veza. Promena boje omogu}uje
korisniku vizuelni pokazatelj da je pretraìva~ prihvatio komandu. Pose}ena veza je veza koju je korisnik
ve} koristio. Promena boje obezbe|uje posetiocu (korisniku) vizuelni podsetnik da je ve} posetio te
povezane stranice.
Napomena: Obojen ili podvu~en tekst moè biti problemati~an za veze. Izaberite svoju šemu boja tako da se
veze razlikuju od ostatka teksta. Tako|e, tekst i veze treba da se razlikuju od pozadine zbog ~itljivosti.
7. Upotrebite procedure iz koraka 3 i 4 da promenite boju veza, aktivnih veza i pose}enih veza.
8. Kada ste izabrali èljeni tekst i boju veze, pritisnite mišem na dugme Apply da biste videli promene. Tekst i
pozadina stranice }e se pojaviti u bojama koje ste izabrali.
9. Zadrìte otvorenim okvir za dijalog na ekranu da biste napravili potrebne izmene boja ili pritisnite na
dugme OK da prihvatite boje koje ste izabrali. Ukoliko ste promenili boju nekog teksta koriste}i paletu
Property Inspector, te promene }e nadvladati opšte postavke boja za stranicu.
37
Definisanje šeme boja za stranicu
Ukoliko nemate poverenja u izbor sopstvene kombinacije boja za Web stranice, oslonite se na Dreamweaverov
skup unapred definisanih šema boja koje koriste tzv. Web-sigurne boje, tj. boje koje }e mo}i da se pojavi u istom
tonalitetu na svim tipovima ra~unarskih platformi i pretraìva~ima.
Napomena: Boje pozadine ostavljaju najbolji utisak kada se opaàju kao nešto što stvara kontrast. Hladnije boje,
kao što su tamno plava i zelena, imaju isti efekat. Toplije boje, kao što su crvena i ùta bolje se opaàju kada su
naspram neke hladnije, zato je pogodno koristiti ih za informacije koje se postavljaju preko pozadine. Kada birate
boje, vodite ra~una o jednostavnosti. Suviše boja moè dovesti do konfuzije i izazvati iritaciju.
1. U meniju Commands izaberite stavku Set Color Scheme ... . Na ekranu }e se pojaviti okvir za dijalog Set
Color Scheme Command.
2. Sa liste Background izaberite boju pozadine, a zatim izaberite kombinaciju boja za tekst i veze sa liste Text
and Links.
3. Uzorak šeme boja pojavi}e se u oknu koje se nalazi na desnoj strani okvira za dijalog. Kada izaberete
èljenu šemu boja, pritisnite mišem na dugme OK da biste je primenili na stranicu.
Dodavanje Dreamweaveru objekata tipa Flash
Lako moète posti}i specijalne efekte koriste}i Flashovu dugmad i animacije. Pošto je Flashova grafika vektorska,
ona je veoma mala po veli~ini. Usled toga, ta grafika se brzo u~itava u korisnikov pretraìva~.
Dodavanje Flashove dugmadi
Flashova dugmad imaju nekoliko stanja u zavisnosti od poloàja pokaziva~a miša u odnosu na njih i od toga da li je
pritisnut taster na mišu. Prvo stanje je izgled koji ima dugme kada pokaziva~ miša nije na njemu. Drugo stanje se
pojavljuje kada je pokaziva~ miša na dugmetu ali nije pritisnut taster na mišu. Tre}e stanje se pojavljuje kada je
pokaziva~ miša na dugmetu i istovremeno pritisnut taster na mišu. U Dreamweaveru moète napraviti i odràvati
Flashovu dugmad koriste}i raspoloìvi skup stilova za dugmad. Ve}ina atributa dugmeta su izmenljivi. Prvo }emo
napraviti dugme, a zatim }emo ga modifikovati.
Da bismo napravili Flashovo dugme potrebno je da uradite slede}e:
38
U datoteci koju u ovoj ve`bi koristimo, index.htm, postavimo ta~ku umetanja ispod slike u centru prozora
Document.
Na panelu Objects/Common izaberimo mišem ikonu Flash Button.
Na ekranu se pojavljuje okvir za dijalog Insert Flash Button.

Uradite sada slede}e promene:
 U pomo}nom meniju Style izaberite stavku Beveled Rect-Blue.
 U polju za tekst Button Text upišite Povratak nazad.
 U pomo}nom meniju Font izaberite font Verdana.
 U polju za tekst Size upišite 12.
Pritisnite mišem na kvadrati} pored polja Bg Color. Na ekranu se pojavljuje paleta boja. Koriste}i alatku u obliku
pipete izaberite osnovnu boju dugmeta. U zavisnosti od boje koju ste izabrali, u polju Bg Color pojavi}e se znak # i
do njega numeri~ki kôd izabrane boje.
U polje za tekst Save As upišite Povratak.swf i pritisnite dugme OK. Okvir za dijalog Insert Flash Button se
zatvara.
Na paleti Property Inspector pritisnite mišem na dugme Play. Dugme se sada nalazi u prvom stanju.
U prozoru Document pre|ite pokaziva~em miša preko dugmeta. Dugme u trenutku prelaska pokaziva~a preko njega
menja boju, tj. menja svoje stanje.
39
Dok je pokaziva~ miša na dugmetu , pritisnite taster na mišu. Dugme opet menja boju i sada je u tre}em stanju.
Snimite svoj rad u datoteku i pregledajte stranicu u pretraìva~u. Pomeranjem pokaziva~a preko dugmeta i
pritiskom na taster na mišu, dugme menja stanja kao što je menjalo stanja u Dreamweaveru.
Da biste izmenili Flashovo dugme potrebno je da uradite slede}e:

1. U prozoru Document dva puta pritisnite mišem na Flashovo dugme. Na ekranu }e se pojaviti okvir za
dijalog Insert Flash Button.
2. Ukoliko se okvir za dijalog ne pojavi, pritisnite mišem na Stop na paleti Property Inspector, a zatim dva
puta mišem pritisnite na Flashovo dugme ponovo.
3. Podesite èljene opcije. Na primer, promenite font u Arial.
4. Pritisnite mišem na dugme Apply da biste videli promene.
5. Pritisnite mišem na dugme OK kada završite.
Dodavanje Flashovih animacija
Svom dokumentu moète lako dodati Flash animacije, skoro kao što dodajete sliku. Naravno, animacije treba da su
ve} pripremljene. Moète prevla~enjem ru~ica promeniti veli~inu animacije da odgovara vašem raspoloìvom
prostoru. Za razliku od Flash dugmadi, u Dreamweaveru ne moète direktno praviti animacije.
Da biste dodali Flash animaciju potrebno je da uradite slede}e:

1. Postavite ta~ku umetanja ispod Flash dugmeta. Ukoliko ta~ka umetanja nije centrirana, pritisnite mišem na
dugme Center na paleti Property Inspector. Ta~ka umetanja je sada centrirana na stranici. Slede}i objekat
koji dodate stranici bi}e centriran.
2. Na panelu Assets pritisnite Flash.
40
3. Izaberite svoju animaciju, a zatim pritisnite Insert. Flash animacija je smeštena na stranicu.
4. Na paleti Property Inspector izaberite Loop i Autoplay. Pritisnite Play da biste videli animaciju u
Dreamweaveru.
5. Snimite rad u datoteku i pregledajte u pretraìva~u.
Autoplay izaziva da Flash animacija po~inje da se izvršava ~im se stranica u~ita u pretraìva~. Animacija se
ponavlja, tj. vrti u petlji, zato što je definisano svojstvo Loop u Dreamweaveru.
Napomena: Uvek proverite da li ste izabrali datoteku tipa SWF kada ubacujete Flash animaciju. Nemojte da
ubacujete datoteke tipa FLA ili SWT, zato što se one ne}e pojaviti u pretraìva~u.
Koriš}enje zvuka u Dreamweaveru
Zvuk moète da uklju~ite na stranicu u Dreamweaveru koriš}enjem objekta Plugin, koji se nalazi na paleti Objects.
Potom }e posredstvom pripadaju}eg okvira za dijalog od vas biti zatraèno da saopštite o kojoj zvu~noj datoteci se
radi.
Simbol Plug-In }e biti umetnut u dokument. Ovaj simbol se ne}e prikazivati kada budete puštali datoteku u
pretraìva~u. Simbol moète postaviti bilo gde unutar dokumenta, slišno kao što radite kada je u pitanju slika. Plug-
inovi su softverski moduli koje pretraìva~i koriste da bi mogli da opsluùju razli~ite vrste datoteka.
Testirajte stranicu i uo~ite da }e se niz varijanti audio kontrolera pojaviti na stranici. U ovom primeru, koristi se
skra}ena verzija kontrolera. Levo dugme kontroliše ja~inu zvuka, a desno dugme je dugme za reprodukciju i
pauzu.
41
Koriš}enje parametara: eliminisanje kontrolera sa ekrana
Na mnogim stranicama ne èlite da kontroler bude vidljiv. Na primer, sigurno u pri~i ne èlite da kontroler bude
vidljiv, èlite samo da po~ne reprodukovanje melodije kada se pristupi stranici. Da biste upravljali pojavljivanjem
kontrolera i drugim stvarima koje se ti~u zvuka, softverski moduli koriste parametre. Da biste koristili parametre u
Dreamweaveru, izaberite softverski modul i pogledajte okvir za dijalog Parameters.
Upišite svaki parametar u pripadaju}e polje. Koristite dugmad sa simbolima + i – da pre|ete na slede}i parametar,
odnosno, da se vratite na prethodni parametar.
Na prethodnoj slici, parametar Controller je postavljen na vrednost False. Za ve}inu korisnika to je jedini parametar
koji treba da podese. Ova vrednost parametra definiše da je kontroler nevidljiv.
Budite obazrivi prilikom upisivanja parametara i njihovih vrednosti. Ukoliko nešto pogrešno upišete, moè se desiti
da se zvuk uopšte ne reprodukuje. Vodite ra~una da ne napravite slovne greške kod naziva parametara i njihovih
vrednosti.
Za one koji su radoznali dajemo tabelu sa vrednostima i opisom nekoliko parametara.
Parameta Vrednost
r Opis
controller true/false Postavite vrednost True da biste isklju~ili softverski modul za
QuickTime. Koristite ovo da biste izbegli prikazivanje kontrolera.
hidden true/false Odre|uje da li }e komande kontrolera biti vidljive kada se bude
prikazivala stranica.
42
autoplay true/false Odre|uje da li }e po~eti reprodukcija zvuka ~im se u~ita.
Podrazumevana vrednost je True, tako da u mnogim slu~ajevima
ne morate da definišete ovaj parametar.
volume 0 - 100 Procentualna vrednost ja~ine zvuka koju sistem koristi.
loop true/false/ Odre|uje da li }e se reprodukcija zvu~nog zapisa kontinualno
broj ponavljati, tj. „vrteti” u petlji.
height and Broj piksela Definiše veli~inu oblasti koju zahvata kontroler kada je vidljiv.
width
controls Console/ Definiše tip kontrolera, kao i da li je vidljiv ili ne.
Smallconsole/
true/false
Parametri i html
Ponekad je lakše direktno u html-u podešavati parametre. U Dreamweaveru, pritisnite taster F10 da bi se prozor sa
html-om pojavio u prvom planu ili prepravite kontrolnu oznaku <embed>, pritisnite mišem na Plug-In i u meniju
Modify izaberite stavku Quick Tag Edit. Na ekranu }e se sada pojaviti samo kontrolna oznaka u prozoru, tako da
moète da je prepravite.
U primeru prikazanom na slede}oj slici radi se o zvu~noj datoteci demo.mp3, a kontroler je nevidljiv.
Pravljenje Web stranice od Wordovog dokumenta
Prilikom pripreme Web prezentacije, autori ~esto kao osnovu koriste postoje}e dokumente. Moète u Wordu
dokument koji je u njegovom izvornom formatu snimiti kao HTML datoteku, a zatim u~itati u Dreamweaver i
doraditi za potrebe Web prezentacije.
1. Pokrenite Microsoft Word.

2. U meniju File izaberite stavku Open. Prona|ite èljeni dokument i pritisnite mišem na dugme Open.
3. Kada je dokument u~itan u Word, u meniju File izaberite stavku Save As Web Page da biste ga snimili kao
HTML datoteku. Dodelite datoteci naziv i pritisnite mišem na dugme Save.
4. Napustite Word i pokrenite Dreamweaver. U meniju File izaberite stavku Open. Pomo}u Okvira za dijalog
Open prona|ite dokument koji ste malopre snimili u HTML formatu. Pritisnite mišem na dugme OK.
43
Wordov dokument se u Dreamweaveru pojavljuje na novoj stranici. Stranica se sada moè ure|ivati i formatirati kao
Web stranica. Me|utim, moè se desiti da do|e do gubitka nekih atributa formatiranja prilikom konverzije iz Word
formata u Dreamweaverov format. Na primer, svaki tabulator u vašem dokumentu bi}e ignorisan.
Savet: Ukoliko volite da koristite tabulatore u Wordu, pretvorite tabulatore u tabele dok ste u Wordu, pre nego što
dokument snimite u HTML formatu.
Prema tome, dok ste u Wordu uradite slede}e:
1. Ozna~ite pasuse koriste}i tabulator.
2. U meniju Table izaberite stavku Convert Text to Table ... .
3. Pojavljuje se okvir za dijalog Conert Text to Table. Ukoliko je broj kolona ta~an, pritisnite mišem na OK.
Potom moète u Dreamweaveru nastaviti dalju doradu dokumenta za potrebe sajta.
Snimite svoj rad u datoteku i u pretraìva~u pregledajte stranice

Prebacivanje datoteka na Web server
Završili smo drugu fazu u publikovanju Web sadràja i sada smo spremni za tre}u fazu: prebacivanje datoteka na
Web server. U prethodnoj fazi smo pregledali stranice na lokalnom disku koriste}i pretraìva~ da bi proverili kako
one izgledaju na Webu. U ovoj fazi prebaci}emo kopije Web datoteka na Web server, tj. ra~unar koji skladišti Web
datoteke, tako da i drugi mogu da vide naše stranice na Webu.
Da bi smestili datoteke na Web, potrebno je da imamo obezbe|en "magacinski prostor", tj. nalog na Web serveru.
Taj server moè biti na fakultetu, školi ili nekoj organizaciji. Ovde }emo koristiti fiktivni Web server NASTAVA
koji je "fizi~ki" smešten u CET-u.
Prvi korak kod prebacivanja datoteka je da saopštite Dreamweaveru gde se one nalaze. U prvoj lekciji ovog kursa
definisali smo mesto lokalne prezentacije kursa, tj. direktorijum www, kao i niz nekih opcija. Sada }e biti potrebno
da definišemo još neke parametre koji su bitni za prebacivanje datoteka.
1. Pokrenimo Dreamweaver.
2. U meniju Site izaberimo stavku Define Sites. Na ekranu se pojavljuje okvir za dijalog Define Sites.
3. Ozna~imo u listi stavku Moj kurs i pritisnimo dugme Edit. Na ekranu se pojavljuje okvir za dijalog Site
Definition for Moj kurs.
4. U listi Category izaberimo stavku Remote Info. Ova stavka se odnosi na nalog na Web serveru. To je
mesto gde }emo kopiranjem prebaciti datoteke.
5. U padaju}em meniju Access izaberimo stavku FTP. FTP je skra}enica od File Transfer Protocol;
posmatrajte to kao jezik kojim se dva ra~unara sporazumevaju da bi mogli da obave prebacivanje datoteka.
Napomena: Ovde }e biti navedeni fiktivni FTP i Web server, nalog i lozinka.
6. U polje FTP Host upišite adresu servera: nastava.cet.co.yu.
7. U polje Host Directory upišite: /www/nastava/kursevi/Obliknastave/netid/. Ovde je "netid" deo vaše
identifikacije na sistemu kome pristupate.
8. U polje Login upišite korisni~ko ime koje ste dogovorili sa administratorom servera.
9. U polje Password upišite lozinku koju ste dogovorili sa administratorom servera.
10. Na kraju, pritisnite dugme OK.
44
11. Dreamweaver analizira sadràj lokalne prezentacije i otvara se prozor Site - Moj kurs. Lokalne datoteke se
nalaze na desnoj strani a datoteke na serveru bi}e na levoj strani kada se poveèmo sa serverom.
12. Pritisnimo dugme Connect na paleti alatki prozora Site.
13. Na ekranu se pojavljuje okvir za dijalog i u polje Password upišite pristupnu lozinku, a zatim pritisnite OK.
Desna strana prozora Site prikazuje datoteke iz direktorijuma www na lokalnom disku. Leva strana prozora
prikazuje datoteke na Web serveru, trenutno tamo nema ništa, ali }e se to ubrzo promeniti.
Tokom rada mi smo sve datoteke smestili u direktorijum www na lokalnom disku, a Dreamweaver je slike
koje smo ubacivali povezao sa HTML dokumentima na osnovu relativnog poloàja tih datoteka. Da bi
stranice funkcionisale kako treba, potrebno je da odrìmo istu strukturu prezentacije kada datoteke
smestimo na server. Sada }emo prebaciti sve datoteke iz direktorijuma www u direktorijum na serveru
NASTAVA.
14. U prozoru Site ozna~imo sve datoteke u direktorijumu www. Da bi ozna~ili više datoteka potrebno je da
drìmo pritisnut taster Ctrl i mišem ozna~avamo èljene datoteke.
15. Na paleti alatki prozora Site pritisnimo dugme Put Files.
16. Na ekranu se pojavljuje okvir za dijalog Dependent Files pomo}u koga definišete da li }e se u prenos
uklju~iti i zavisne datoteke.
17. Pritisnite dugme No.
Dreamweaver prenosi kopije obeleènih datoteka na naš direktorijum na serveru.
Ukoliko prebacujete datoteke i uklju~ite prebacivanje zavisnih datoteka, Dreamweaver }e prebaciti sve lokalne
datoteke koje izabrana datoteka adresira. Na primer, ukoliko prebacujemo datoteku index.html i izaberemo prenos
zavisnih datoteka, Dreamweaver }e automatski prebaciti slike koje smo uklju~ili u tu datoteku, kao i datoteku
resursi.html. U ovom slu~aju, ovaj izbor moè da uspori proces prebacivanja datoteka zbog ponovnog prebacivanja
datoteka koje ve} postoje na serveru. Tako|e, moè se desiti da nehotice zamenite datoteke koje su na serveru.
45
Odlu~ite se za prebacivanje zavisnih datoteka samo onda kada ste sigurni da èlite da Dreamweaver isporu~i sve
datoteke koje su u nekom odnosu sa izabranom stranicom ili stranicama.
U ovom slu~aju mi smo izabrali sve zavisne datoteke na lokaciji, tako da }e rezultat biti isti bez obzira da li smo
izabrali Yes ili No.
Mada posle prebacivanja imate primerke datoteka i na lokalnom disku i na serveru, mo`da }e u budu}nosti biti
potrebno da dopremite datoteke sa Web servera da bi ih aùrirali.
Da biste preuzeli datoteke sa servera, pritisnite mišem na dugme Get Files na paleti alatki prozora Site.
Pregledanje datoteka koje su na Web serveru
Sve do sada u pretraìva~u smo pregledali samo lokalne datoteke. Sada, pošto su preba~ene na Web server,
moèmo da ih u pretraìva~u pregledamo sa te lokacije.
1. Pokrenimo pretraìva~ (Netscape ili Internet Explorer).

2. U polju Location upišite adresu Web lokacije kursa. U našem slu~aju
http://nastava.cet.co.yu/kursevi/Obliknastave/netid/, gde je netid identifikacija na serveru. Pritisnite taster
Enter i pojavi}e se naša Web stranica.
Gornjom adresom saopštili smo pretraìva~u da ide na nastava.cet.co.yu i traì direktorijum

/www/kursevi/Obliknastave/netid/. Verovatno ste uo~ili da nije navedeno koji HTML dokument ta~no èlimo da
vidimo. Pošto naziv datoteke nije eksplicitno naveden, pretraìva~ }e u direktorijumu potraìti datoteku index.html.
Server NASTAVA zna koji je dokument u direktorijumu inicijalno predvi|en za prikazivanje i ako nije navedena
datoteka. Sada vam je jasno zašto smo svojevremeno datoteku prve stranice kursa nazvali index.html. Me|utim,
naziv dokumenta za inicijalno prikazivanje zavisi od tipa servera, zato proverite kod administratora servera koji
naziv treba da koristite.
Izlazak iz Dreamweavera i pretraìva~a
Dok ste u pretraìva~u, u meniju File izaberite stavku Exit, a zatim se vratite u Dreamweaver, sninite svoj rad u
datoteku i u meniju File izaberite stavku Exit
46
FRAME-OVI
Ovo pitanje je jos osetljivije, s obzirom da postoji citava AntiFrame kampanja, koja ima neke osnove, ali
savet je NE KORISTITI FRAME-OVE.
Razloga za ovo ima dosta, ali spomenucu samo najbitnije:
1. Jedina pozitivna osobina frame-ova jeste da stede prostor na serveru gde vam se nalazi prezentacija i
omogucava vam da eventualno ostanu na raspolaganju korisniku kada ode sa vase prezentacije (ako
neko zna jos neku, neka mi slobodno javi).
Da li ste na site-u Yahoo!, ZDNet, ili C|Net videli neki frame? Mozda, ali tek u nekom 4 ili 5 nivou
prezentacije. U pitanju su site-ovi koji su najposeceniji (Yahoo!), ili medju najposecenijim site-
ovima na Web-u. Koristite njihove ideje i daleko cete dogurati ("ako se vec kopira, treba kopirati
najbolje").
2. Glavni problem kod frame-ova jeste da se u zavisnosti od njihovog broja ucitava toliki broj file-ova
istovremeno, koji se ucitavaju u frame-ove (znaci, najmanje 2 file-a). Ljudi koji ih koriste kazu da to
nema veze, jer navigaciona oblast (bar), koja je obicno razlog za upotrebu frame-a, zauzima malo
prostora zajedno sa slikama koje se tu eventualno nalaze. Ovo je u redu do sledeceg momenta:
Hocete da se prijavite na pretrazivace, i tu nastaju problemi.
47
PRAVLJENJE TASTERA ZA WEB STRANICU

* PHOTOSHOP *
Photoshop je program za obradu slika koji Web dizajneri veoma mnogo koriste. Ovde }emo demonstrirati
jednu veoma prostu tehniku pravljenja dugmadi za web stranice.
Pokrenimo Photoshop i u meniju File izaberimo stavku New. Na ekranu se pojavljuje okvir za dijalog
New u kome definišemo radni prostor za svoju sliku. Za web stranice veli~inu slike treba definisati u pikselima.
Reìmom boje definišemo koji }emo model boja koristiti za sliku. Za slike za web stranice koristi se RGB model (u
tom modelu se svaki piksel komponuje od crvene, zelene i plave boje u odre|enoj, procentualno izraènom
srazmeri).
Napravi}emo oblast dimenzija 200x100 piksela. Za pozadinu }emo izabrati belu boju. Na ekranu se
pojavljuje mala bela oblast spremna za rad.
SLOJEVI
U Photoshopu se moè napraviti više slojeva na slici, što omogu}ava da pravimo razli~ite slike na
posebnim radnim ravnima (tzv. slojevima) koje ne uti~u na podatke na drugim ravnima. Ovo je veoma zgodno pri
pravljenju tzv. kontekstno osetljivih dugmadi (engl. rollover buttons), tj. dugmadi koja se vizuelno menjaju kada
preko njih pre|e pokaziva~ miša.
Svojstva slojeva podešavaju se pomo}u palete Layers. Ukoliko ta paleta nije prikazana na ekranu, u
meniju Window izaberite stavku Show Layers i ona }e biti prikazana.
Sve palete u Photoshopu imaju sopstveni meni kome se moè pristupiti ako se mišem pritisne na strelicu u
gornjem desnom uglu palete. Aktivirajte mišem meni palete i izaberite stavku New Layer, a zatim dodelite novom
sloju ime Dugme. Pojavi}e se novi sloj. Uo~ite da se ikona u obliku ~etkice premestila sa sloja Background na sloj
Dugme. Ikona u obliku ~etkice pokazuje koji je sloj trenutno aktivan.
48
BOJENJE DUGMETA
Napravimo sada prosto pravougaono dugme. Prvo }emo napraviti pravougaonu konturu dugmeta. Me|
utim, Photoshop nema alatku za crtanje pravougaonika. Taj nedostatak prevazi}i }emo tako što }emo alatkom
Rectangular Marquee ozna~iti pravougaonu oblast, a zatim tu oblast popuniti bojom.
Sa palete alatki izaberite alatku Rectangular Marquee, koja se nalazi u gornjem levom delu palete alatki.
(Ako paleta alatki nije prikazana na ekranu, u meniju Window izaberite stavku Show Tools i paleta }e se pojaviti
na ekranu.) Ako na paleti alatki u gornjem levom delu ne vidimo alatku Rectangular Marquee, pritisnite levi taster
na mišu dok je pokaziva~ miša na trenutno prikazanoj ikoni i drìte ga pritisnutim da bi se pojavila pomo}na paleta
na kojoj se nalaze dodatni alati, me|u kojima je i alatka Rectangular Marquee. Mišem izaberite tu alatku sa
pomo}ne palete.
"Nacrtajmo" sada pravougaonu oblast. Nju }emo popuniti bojom koriste}i alatku Paint Bucket.
Izaberimo alatku Paint Bucket sa palete alatki. Da bismo videli njene opcije, dva puta mišem pritisnimo
na tu alatku i pojavi}e se paleta Paint Bucket Options. Proverimo da li opcija Contents ima vrednost Foreground i
da li je reìm bojenja postavljen na Normal. Ovi parametri odre|uju da alatka bojenje obavlja trenutno izabranom
bojom prednjeg plana.
Boja prednjeg plana bira se tako što mišem izaberemo levi kvadrat od dva preklopljena kvadrata koji se
nalaze na donjoj polovini palete alatki. Ovi kvadrati sluè za postavljanje boje prednjeg plana i pozadine, a izabrana
boja se primenjuje na trenutno aktivnu alatku.
Boja se moè izabrati i sa palete uzoraka boja (engl. Color Swatch). Paleta Color Swatch bi}e prikazana
na ekranu ako u meniju Window izaberemo stavku Show Swatch.
49
Kada smo izabrali boju, postavljamo pokaziva~ miša unutar pravougaone crti~aste konture i pritisnemo
levi taster na mišu. Pošto je trenutno aktivna alatka Paint Bucket, pravougaona kontura se popunjava izabranom
bojom.
Sada u meniju Select izaberimo stavku Deselect da bi sa ekrana nestala pravougaona crti~asta kontura. Na
ekranu imamo pravougaonik obojen zelenom bojom na sopstvenom sloju.
UOBLIÂVANJE DUGMETA
Photoshop raspolaè nizom filtera pomo}u kojih moète da podešavate slike na pojedinim slojevima. Od
verzije 5 postoje specijalni filteri koji obuhvataju neke operacije koje su se ranije obavljale ru ~no. Jedan od tih
filtera je filter Bevel and Emboss koji pravi iluziju trodimenzionalnog konusnog dugmeta. U meniju Layer
izaberimo stavku Effects/Bevel and Emboss. U okviru za dijalog Effects izaberimo stil Inner Bevel. Ostale
parametre podešavajte po èlji, sve dok ne dobijete odgovaraju}i izgled dugmeta.
Sada }emo dodati tekst dugmetu, kako bi korisnici znali koju funkciju dugme obavlja. Sa palete alatki
izaberimo alatku Type, a zatim postavimo pokaziva~ miša na crte` i pritisnimo levi taster na mišu. Na ekranu se
pojavljuje okvir za dijalog Type Tool u koji upisujemo èljeni tekst.
Ovaj okvir za dijalog ima dve korisne opcije koje treba aktivirati, Auto Kern i Anti-Aliased. Opcija Auto
Kern kontroliše razmak izme|u slova, a Anti-Aliased "umekšava" ivice slova tako da ne izgledaju nazubljeno. Po
završenom podešavanju pritiskom na dugme OK zatvaramo ovaj okvir za dijalog. Tekst je sada na dugmetu.
50
Ukoliko èlimo da korigujemo poloàj teksta, potrebno je da sa palete alatki izaberemo alatku Move i
pomerimo tekst na èljeno mesto.
Slede}i korak je obrezivanje (engl. crop) radne oblasti na veli~inu dugmeta.Svaki sloj sadrì informacije o
oblastima prozirnosti (engl. transparency) koje omogu}avaju da izaberete samo oblasti sloja sa konkretnom
informacijom. Sa palete slojeva izaberimo sloj Dugme, a zatim u meniju Select izaberimo stavku Load Selection i u
okviru za dijalog Load Selection pritisnimo dugme OK. Oko dugmeta se pojavljuje crti~asti pravougaonik.
U meniju Image izaberimo stavku Crop da bismo uklonili suvišne delove radne oblasti. Dugme sada ima
oblik prikazan na slede}oj slici.
SNIMANJE U DATOTEKU
Poèljno je da povremeno snimite svoj rad, zato }emo u meniju File izabrati stavku Save. Ovim
postupkom snimi}emo rad u datoteku koja je izvorni Photoshopov grafi~ki format (tip .psd).
51
Me|utim, taj format nije predvi|en za upotrebu na web stranicama zbog svoje veli~ine, pošto sadrì
dodatne informacije o slojevima, što ne zna~i da kasnije ne moèmo u~itati ovu datoteku i sadràj prilagoditi
potrebama weba. Pošto pravimo dugme za web stranicu, mora}emo da spojimo slojeve pre nego što obavimo
snimanje u odgovaraju}em formatu. U meniju Layer izaberimo stavku Flatten Image da bismo to ostvarili. Ina~e,
ova opcija je na raspolaganju i na pomo}nom meniju palete Layers.
SNIMANJE U DATOTEKU FORMATA GIF
Naše dugme je relativno malo, sa malo boje, pa }emo ga snimiti u formatu GIF. GIF memoriše sliku
koriste}i maksimalno 256 boja, a naša slika trenutno ima 24-bitnu paletu (16,7 miliona boja). Da bismo redukovali
paletu na 256 boja, u meniju Image izaberimo stavku Mode i u pomo}nom meniju opciju Indexed Color. Na ekranu
se pojavljuje okvir za dijalog Indexed Color.
Parametar Palette definiše kako }e se boje koristiti na završenoj slici. Izaberimo za ovaj parametar
vrednost Adaptive, kako bi se za prikaz izabrale najoptimalnije boje iz raspoloìvog skupa boja. Kada se koristi ta
vrednost, mogu}e je dodatno smanjiti broj boja, kao i izabrati manju vrednost za parametar Color Depth, da bi se
dobila što manja veli~ina datoteke. Za parametar Dither izaberimo vrednost Diffusion, da bismo postigli simulaciju
ve}e palete boja kombinacijom boja. Veoma je va`no da korektno obavimo ova podešavanja, tako da uprkos
koriš}enju malog broja boja dobijemo zadovoljavaju}i kvalitet slike.
Što se ti~e parametra Palette, u igri je još jedna vrednost - Web. Naime, Netscape je razvio paletu boja za
web, zato što ve}ina operativnih sistema ima sopstvenu paletu boja, pa koriš}enjem Netscapeove palete obezbe|
52
ujemo paletu koja je prisutna na svim operativnim sistemima. Ova paleta ima 216 boja koje je definisao Netscape, a
ostatak su boje koje zavise od operativnog sistema. Biranjem ove palete sigurni smo da }e prikaz slike na ekranima
korisnika biti korektan i da ga pretraìva~ ne}e razmrljati.
Kada smo podesili parametre, pritisnimo dugme OK, a zatim u meniju File izaberimo stavku Save As i
snimimo sliku u datoteku Dugme.gif.
Ovime smo završili pravljenje prvog dugmeta.
PRAVLJENJE KONTEKSTNO OSETLJIVOG DUGMETA
Ova dugmad su uobi~ajena na web stranicama. To je u stvari niz slika koji se menja kada pomerimo
pokaziva~ miša preko njih. Ona su pogodna za dodavanje dodatnih informacija vezanih za funkciju dugmadi itd.
Mi }emo napraviti takvo dugme koje samo menja boju kada se mišem pre|e preko njega. Mada se ~ini da
je ovakva funkcija prosta i mo`da nepotrebna, promena boje dugmeta obezbe|uje povratnu informaciju korisniku da
je ta slika u stvari dugme, a ne deo podloge i doprinosi jasno}i web stranice.
Veoma je lako napraviti ovo dugme u Photoshopu. Prvo, u~itajmo naše originalno dugme, tj. uslojenu
Photoshopovu datoteku.
PRAVLJENJE NOVOG STANJA DUGMETA
Aktivirajmo sloj Dugme i u meniju Layer izaberimo opciju Duplicate Layer.
Novi sloj }emo nazvati "Dugme_nad". Sada imamo dva sloja dugmeta koja su identi~na. Jasnoje da treba
promeniti novi sloj tako da se naše dugme menja kada korisnik pre|e mišem preko njega.
53
Izaberimo novu boju i popunimo sliku na novom sloju. Efekat Bevel }e biti za novu boju.
54
To je sve. Sada imamo kontekstno osetljivo dugme sa dva stanja. Da bismo videli kako }e dugme
izgledati, pritisnimo mišem na ikonu oka pored sloja Dugme_nad. Prvo }emo ga snimit u izvornu Photoshopovu
datoteku Dugme_nad.psd da bismo imali osnovu za kasnije izmene, ako to bude potrebno. Sada moèmo da ga
snimimo u datoteku formata GIF. Ovoj datoteci }emo dati ime Dugme_nad.gif.
Dugmad su spremna za uklju~ivanje u web stranice.
10 NACINA KAKO DA NE PROMOVISETE VAS SAJT
Kada zavrsite izradu vaseg sajta, sledeci korak je da ga predstavite svetu. Slanje adrese vaseg Web sajta
na masine za pretragu Interneta , direktorijume i slicne sajtove je u nekim slucajevima dobar izbor. Medjutim, u
nekim slucajevima nacin na koji se pristupa ovom poslu moze da ima kontra efekat. Za razliku od drugih tekstova
koji vas upucuju sta treba da radite, ovaj tekst vas upucuje sta ne treba da radite prilikom promocije vaseg sajta na
pomenutim adresama.
Na zalost, Internet je pun losih preporuka, laznih saveta, a cak i prevara u vezi posla promocije vaseg sajta.U
slucaju da vrsite promociju vaseg sajta na pogredan nacin, mozete vise naskoditi vasem sajtu, nego mu pomoci.
1 - Nemojte Spamovati!
Ovo je osnovno pravilo. SPAM je slanje velikog broja nekontrolisanih poruka preko e-maila ili preko
NEWS grupa, CHATova i sl. Spamovanje ce vam proizvesti vise neprijatelja, nego koristi koje cete imati. Postoji
mogucnost da velik broj ljudi postavi filtere na vase poruke, pa ih ubuduce nece primati, bez obzira na sadrzaj koji
se nalazi u njima. Takode, neki provajderi isto tako postavljaju filtere na poruke koje stizu na njihove konferencije,
ili oglasne table, a nije redak slucaj da zbog SPAMa postave i filtere na svu elektronsku postu koja dolazi od vas.
2 - Ne placajte za registraciju na pretrazivacima.

Posaljite podatke o vasem sajtu na 500 masina za pretrazivanje za samo 250 dinara! Los posao. Ne postoji
500 ili cak ni 100 masina na koje vredi poslati podatke. Oni koji vam nude ovakve usluge, ne idu od pretrazivaca
do pretrazivaca i registruju vas sajt, vec koriste automatsko slanje preko besplatnih servisa (poput
http://www.zr.co.yu/search/submit.htm, ili slicnih).
3 - Ne gubite vreme na prevelik broj pretrazivaca WEB-a.

Posaljite podatke o vasem sajtu na nekoliko glavnih masina za pretrazivanje i direktorijuma pretrazivaca,
koristeci servise za registraciju, a za ostale to uradite individualno. Obicno vredi poslati podatke za oko 30
pretrazivaca. Potom potrazite specijalizovane direktorijume koji odgovaraju sadrzaju vaseg sajta (putovanja,
investicije, kupovina, turizam, itd.). Ne gubite vreme na nebitne masine za pretrazivanje ili decije link strane. Bolje
da vase vreme provedete u pazljivom slanju podataka na Yahoo.
4 - Ne protrcavajte kroz slanje podataka na Yahoo.

Yahoo je verovatno najvazniji direktorijum pretrazivaca, i takode jedan od onih na koje je najteze uci.
Ono sto posaljete ce biti pregledano od strane stvarnih urednika, pa zato pratite uputstva sa sajta, i stvarno se trudite
da ih ispostujete i ubedite urednike da je vas sajt vredan pomena. Sta vam vredi ako vas sajt postave na 1257. mesto
od 1700 sajtova koji se bave odredeno temom?
5 - Nikad ne saljite podatke na pretrazivace pre nego sto je sajt spreman za posetioce.
55
Testirajte vas sajt pazljivo, i uverite se da je svaki deo sajta spreman za posetioce pre slanja podataka na
pretrazivace. Mnogi sureferi se nikad nece vratiti na vas sajt ako na njemu zateknu poruku tipa "under
construction" ili mrtve (nevazece) linkove.
6 - Ne zaboravite da integrisete vas URL u posao.

Zapanjujuce je koliko neke kompanije novca potrose na pravljenje WEB sajta, a potom zaborave da
prilikom stampe novih vizit karti i reklamnih materijala postave u zaglavlje URL sajta. URL vaseg sajta treba da
bude odstampan na svako mesto gde bi ste postavili i broj telefona vase kompanije.
7 - Ne mesajte se sa crnom magijom.

Postoji mnogo raznih trikova koji se pominju na raznim NEWS grupama i mailing listama, koji obecavaju
da ce popravti vase rangiranje na pretrazivacima. Ucitavanje vasih stranica sa nevidljivim kljucnim recima,
kreiranje posebnih ulaznih stranica sa specijalnim sadrzajem i tajni programi (za samo $19.95) koji guraju vase
strane na pretrazivacima predstavljaju obmanu. Nemojte se njima zavaravati. Pretrazivaci i direktorijumi sajtova
vode bitku protiv onih koji zele da pobede sistem, i izbacice vas ukoliko posumnjaju da zelite da ih SPAMujete.
Koristite META tagove, kljucne reci u nazivu i telu stranica, isl., ali ne idite dalje, i uvek pratite uputstva za slanje
podataka.
8 - Ne stavljajte svasta na vas Web sajt, pogotovo ono sto ne zelite da javnost vidi.
Vecina vas ima test stranice, ili stranice sa licnim materijalom, koje cuvate na vasem Web serveru, ali ne
zelite da budu javno objavljevne. Vecina pretrazivaca, poput Excite ili Altavista, automatski ce pretraziti i
indeksirati sve strane na vasem sajtu, ukoliko im ne kazete da to ne rade. Kreirajte tekst fajl pod imenom
"robots.txt," i postavite ga u root direktorijum na vasem sajtu (obicno u "htdocs" direktorijum). Taj fajl treba da
sadrzi listu strana ili direktorijuma za koje ne zelite da se indeksraju od stane pretrazivaca. Fajl izgleda poput
sledeceg teksta:
User-agent: *
Disallow: /test
Disallow: /temporary
Disallow: /templates
Ovaj fajl govori svim spiderima (programima za pretragu sajtova) da ne indeksiraju pomenute direktorijume.
9 - Ne ustrucavajte se da merite vas saobracaj.

Jedan od nacina da bolje promovisete vas sajt je da koristite neki od softvera koji ce vam davati podatke o
posecenosti pojedinacnih stranica, sa kojih pretrazivaca dolaze posete i koje su kljucne reci koje ljudi koriste da bi
dosli do vaseg sajta. Ovi podaci ce vam biti dragoceni da bi ste znali kako dalje da razvijate sadrzaj vaseg sajta.
10 - Kad zavrsite, nemojte stati!

Promocija sajta je stalan posao. Kada jednom posaljete podatke za koje zelite da se pojave na internet
pretrazivacima i direktorijumima, navratite posle mesec dana na te masine da proverite postojanje poslatih
podataka. Ponekad se desi da ih nema, pa je potrebno da ponovite slanje. Ukoliko postoje. nemojte ih ponovo slati.
Uvek trazite nove sajtove koji su voljni da postave kod sebe vas link ili vam nude nove i po mogucstvu besplatne
oblike promocije. Prezentacija na servisu World Wide Web (www)
KAKO IZABRATI FIRMU KOJA NUDI PROSTOR NA WEB-U (WEB SPACE PROVIDER)?
Mnoge firme kod nas i u svetu prodaju prostor na Web-u, a vrlo cesto i izradjuju prezentacije. Da bi
izabrali firmu od koje cete kupiti prostor trebalo bi da se informisete o sledecim podacima:
1. Cena prostora (cene znaju da budu vrlo razlicite, u zavisnosti od dodatnih usluga koje se
podrazumevaju u osnovnoj ceni)
2. Brzina pristupa prostoru od strane posetilaca prezentacije (nekim mestima na Net-u se pristupa
brze ili sporije u zavisnosti od opreme koju poseduje firma, kao i od brzine pristupa Internet-u koju
firma ostvaruje (link))
3. Koje se firme vec nalaze kod te firme (sto su firme ozbiljnije, verovatno postoji razlog za to)
4. Koje su sve usluge koje se nude za tu cenu (broj E-mail adresa, ftp server, inicijalno (ili stalno)
reklamiranje. . .)
56
5. Firma kod koje kupite prostor ne mora da bude firma koja ce vam napraviti prezentaciju
(pogledajte prezentacije koje vam se dopadaju pa odaberite firmu u odnosu na kvalitet prezentacija
koje je firma napravila - sve takve firme imaju spisak prezentacija koje su napravile)
57

Dreamweaver

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Dreamweaver

Uploaded by

Copyright:

Available Formats

OSNOVNA [KOLA VUK KARADZI]

IZRADA WEB PREZENTACIJA

KRU[EVAC, novembar 2001.godine

Instalacija Dial-up adaptera i TCP/IP protokola za Windows 95/97/98

Instalacija Dial-Up adapter-a

Instalacija i podešavanje Dial-up networking-a

Kliknite na TCP/IP Settings i podesite parametre kao na slici:

HYPERTEXT: Kretanje po Webu

Web stranicama mo`ete pristupiti na nekoliko na~ina:

1. Unošenjem Internet adrese (direktno sti`ete na stranicu).

Pretra`ivanje dokumenata na Webu: URL

Sledi spisak uobi~ajenih završnih nivoa domena:

 com - komercijalno preduze}e

KAKO PRISTUPITI WORLD WIDE WEBU

Netscape pretra`iva~ Windows pretra`iva~

Proširivanje pretra`iva~a: dopunski moduli (Plug-Ins)

Više od dodatnih modula:

MULTIMEDIJALNI DO@IVLJA WEBA

Shockwave predstavlja još jedno multimedijalno iskustvo. On vam omogu}uje pravljenje i

PROGRAMSKI JEZICI I FUNKCIJE

JavaScript/JScript: JavaScript je programski jezik kojeg je napravio Netscape Communications. Mali

Naprednija `iva komunikacija nudi zvu~nu i/ili video komponentu.

Ovi programi sadr`e alate koji podr`avaju:

 audio: telefonski razgovor na Webu

Trenutno ne postoji definisan standard koji bi trebalo da podr`avaju programi za konferenciju.

KONCEPTI KONSTRUKCIJE WEB STRANICE

OBJAVLJIVANJE NA WEBU KORIŠ]ENJEM

Program MACROMEDIA DREMAWIVER mo`ete preuzeti i instalirati na Vaš ra~unar sa internet

Pri objavljivanju Web prezentacije izdvajaju se tri faze:

 Planiranje i dizajniranje sadr`aja

Za ovaj posao od softverskih alata potrebni su vam Dreamweaver i Internet Explorer.

Planiranje i dizajniranje sadr`aja

Planiranje sadr`aja stranice

 Jedinstvenost postoji kada su elementi tako uklopljeni da zadovoljavaju opšti komunikacioni

Razmišljajte o svemu ovome kada budete pravili svoju Web prezentaciju.

PRAVLJENJE WEB PREZENTACIJE

Prvi korak je da prona|ete i pokrenete Dreamweaver.

Dremweaverovo radno okru`enje zajedno sa plutaju}im prozorima.

Glavne komponente koje }u ovom prilikom predstaviti jesu:

 Pritisnite dugme Direction da biste promenili

PALETA HTML STYLES

Za komforman rad sa ovim panelom potrebno je da znate slede}e:

 Da biste promenili kategorije panela Objects:

 Da biste umetnuli objekat:

 Da biste izabrali i prepravili objekat:

PRAVLJENJE LOKALNE PREZENTACIJE

DODELJIVANJE NASLOVA WEB STRANICI

SNIMANJE WEB STRANICE U DATOTEKU

Pritisnimo dugme Save.

U prozoru Document, mišem ozna~imo naziv dokumenta.

MENJANJE IZGLEDA TEKSTA POMO]U PROPERTY INSPECTORA

Slike i grafika na Web stranici mogu da:

NAPOMENA: Dreamweaver }e nas upozoriti da se slika ne nalazi unutar direktorijuma za kurs i

BROJ I VELI^INA SLIKA NA STRANICI

1. U prozoru Document ozna~imo mišem sliku.

PRELIMINARNI PREGLED STRANICE

UPOTREBA PALETE HISTORY

UMETANJE SLIKE U TABELU

DODAVANJE NOVOG REDA

Tabela se, tako|e, mo`e podešavati uklanjanjem nepotrebnih redova i kolona.

Da vas podsetim, uvek mo`ete da poništite akciju koriš}enjem komande Undo.

MENJANJE VELI^INE KOLONE

DEFINISANJE FIKSNE VELI^INE TABELE

6. Paleta bi trebala da ima izgled prikazan na slede}oj slici.