SVEUILITE/UNIVERZITET VITEZ TRAVNIK

FAKULTET POSLOVNE INFORMATIKE

STUDIJ I CIKLUSA; GODINA STUDIJA: II CIKLUS: I GODINA
SMIJER: INFORMACIONE TEHNOLOGIJE

ADOBE DREAMWEAVER

SEMINARSKI RAD

Travnik, April.2013. godine

 SVEUILITE/UNIVERZITET VITEZ TRAVNIK
FAKULTET POSLOVNE INFORMATIKE
STUDIJ I CIKLUSA; GODINA STUDIJA: II CIKLUS: I GODINA
SMIJER: INFORMACIONE TEHNOLOGIJE

ADOBE DREAMWEAVER

SEMINARSKI RAD

IZJAVA: Ja, Davor Damjanovi, student Sveuilita/Univerziteta Vitez Travnik,

Indeks broj: 0137-12/DIT odgovorno i uz moralnu i akademsku odgovornost
izjavljujem da sam ovaj rad izradio potpuno samostalno uz koritenje citirane
literature i pomo profesora odnosno asistenata.

Potpis studenta:

STUDENT: Davor Damjanovi

PREDMET: Poslovne aplikacije
PROFESOR: Doc. Dr. Jasmin Azemovi
ASISTENT: Dipl.Ing.It. Mahir Zajmovi
1. UVOD...................................................................................................................2
1.1. PREDMET ISTRAIVANJA.....................................................................2
1.2. SVRHA I CILJEVI ISTRAIVANJA.......................................................2
1.3. RADNA (GLAVNA) HIPOTEZA...............................................................2
1.4. ZNANSTVENE METODE..........................................................................2
1.5. STRUKTURA RADA..................................................................................3
2. DREAMWEAVER...............................................................................................4
2.1. O DREAMWEAVERU................................................................................4
2.2. KRATKA HRONOLOGIJA.......................................................................5
3. ADOBE DREAMWEAVER...............................................................................6
3.1. O ADOBE PROIZVODIMA.......................................................................6
3.2. ULOGA ADOBE DREAMWEAVERA......................................................8
4. RAD U ADOBE DREAMWEAVERU.............................................................11
5. KREIRANJE WEB STRANICE......................................................................13
6. ZAKLJUAK....................................................................................................16
7. LITERATURA....................................................................................................18

1
 1. UVOD

1.1. PREDMET ISTRAIVANJA

Internet moemo okarakterisati kao fenomen modernog svijeta, koji je, slobodno
moemo rei svojom pojavom stvorio jednu vrstu kulture, odnosno subkulture koja je
zatresla cijeli svijet. Internet predstavlja medij koji iznimno brzo napreduje i svakim
danom nudi sve vie mogunosti, razliitih servisa i namijena. Prisustvo na webu danas
nije luksuz nego potreba, bilo da je rije o kompaniji ili pojedincima. Iz toga proizlazi
potreba za kreiranjem web stranica. Korisnik se moe odluiti na samostalnu izradu
web stranica ili cjelokupni posao izrade web stranice prepustiti osobi ili kompaniji koja
je adekvatna za struno i profesionalno obavljanje istoga. Bilo kako bilo, radili
samostalno, ili taj posao prepustili profesionalcima, prilikom izrade web stranica
koristie se gotova programska rjeenja koja slue za tu svrhu. Jedan od programa koji
se koriste u svrhu izrade web stranica je Dreamweaver, program firme Adobe, koji je
danas najomiljeniji i najzastupljeniji program koji se koristi za ovu svrhu.

1.2. SVRHA I CILJEVI ISTRAIVANJA

Osnovna svrha ovog rada bi bila opisati pomenuti alat Adobe Dreamweaver, te nain
funcionisanja i rada sa ovim programom. Cilj nam je dokazati korisnost ovakvog
programa u obavljanju poslova ovog tipa.

Ali i cilj nam je dokazati da uopte koritenje jednog ovakog alata znatno utie na
krajnji rezultat, odnosno na kvalitet web prezentacije koju emo napraviti.

1.3. RADNA (GLAVNA) HIPOTEZA

Na temelju problema i predmeta istraivanja postavlja se glavna hipoteza:
- Ukoliko koristite program kao to je Dreamweaver prilikom kreiranja web
prezentacije, osim to ete uveliko pojednostaviti i olakati posao izrade web
stranica, kao krajnji rezultat dobiete i kvalitetniju prezentaciju .

1.4. ZNANSTVENE METODE

U ovom seminarskom radu koriste se naune (strune) metode, induktivna i deduktvna
metoda, kao i metoda deskripcije, a prikupljeni podaci su prikazani putem:

2
 - Teksta,
- Tabelarnih prikaza,
- Screenshot prikaza

Uz seminarski pismeni rad vezana je i PowerPoint prezentacija u kojoj je obraena

ista tematika, kao i Case Study, tj. video rad takoe vezan za istu tematiku koja nosi
radni naslov Adobe Dreamweaver.

1.5. STRUKTURA RADA

Struktura seminarskog rada je usklaena sa Uputstvom za pisanje seminarskog rada
na prvom ciklusu studija kao i temi seminarskog rada. On sadri est poglavlja.
Prvo poglavlje, Uvod, sadri pet podpoglavlja, koje smo u tekstu iznad ve obradili:
- Predmet istraivanja Adobe Dreamweaver,
- Svrha i ciljevi istraivanja,
- Radna (glavna) hipoteza,
- Znanstvene metode,
- Struktura rada.
Drugo poglavlje, g o v o r i o Dreamwever programu uopte, te je opisana kratka
istorijska hronologija programa.
Tree poglavlje, g o v o r i o Adobe Dreamweaveru, programu koga je od
Macromedie preuzeo Adobe, o tome kakav je danas, o svim proizvodima iz porodice
Adobe, te o ulozi ovog alata u procesu izrade jedne web prezentacije.
etvrto poglavlje, je dio u kom je detaljno obraen nain rada u Adobe
Dreamweaveru.
Peto poglavlje, je poglavlje u kom je kroz jednostavan primjer opisan nain izrade
jedne web prezentacije sa Adobe Dreamweaver programom.
esto poglavlje, Zakljuak, daje generalnu ocjenu o programu, kao i odgovor na
prihvatanje odnosno neprihvatanje radne i pomone hipoteze.
Sedmo poglavlje, Literatura, je lista svih knjiga i internet sadraja koji je koriten za
izradu ovog rada.

3
 2. DREAMWEAVER

Fotografija 1 Adobe Dreamweaver, Izvor: http://hr.wikipedia.org/wiki/Adobe_Dreamweaver

Adobe Dreamweaver, prije poznat kao Macromedia Dreamweaver, je profesionalni

softver za izmjenu ili kreiranje web stranica, koga je u prvoj verziji razvila kompanija
Macromedia, Inc. Tu je kompaniju poslije otkupio Adobe Systems, Inc. te je danas
jedan od najpopularnijih alata za ureivanje i kreiranje web stranica. 1

2.1. O DREAMWEAVERU
Dreamweaver je programski alat koji ima sve to je potrebno za kreiranje profesionalnih
web stranica, pojednostavljuje dizajn stranica, bez obzira koristite li njegov tekstualni ili
grafiki nain rada. Mnotvom naprednih funkcija, nezaobilazan je alat web dizajnera,
kako kod profesionalaca tako i kod hobista. Dreamweaver je program koji moe dati
gotovo savren vizualni identitet web stranicama, to ga u dananje vrijeme marketinke

1
Wikipedia, http://hr.wikipedia.org/wiki/Adobe_Dreamweaver, 19.04.2013.

4
eksplozije i vanosti prisutnosti na internetu ini znaajnim faktorom u njihovoj izradi.
Dreamweaver je definitivno najpopularniji alat za kreiranje web stranica sa jedinom
manom, ukoliko bi to mogli definisati kao manu ovog programa, a to je tei rad za
poetnike koji se prvi put susreu sa izradom web stranica. Meutim, sloiemo se da to
i nije mana, iz razloga to je ovaj program komercijalna verzija alata iz Adobe porodice,
namijenjena prvenstveno profesionalnom radu.

2.2. KRATKA HRONOLOGIJA

Kompanija Verzija Alternativna Datum objave Biljeke
verzija
Macromedija 1.0 1.0 Decembar Prva verzija. Mac OS
1997
1.2 Mart Prva verzija OS Windows
1998
2,0 2,0 Decembar
1998
3.0 3.0 Decembar
1999
Ultradev 1.0 Juni
1999
4,0 4,0 Decembar
2000
Ultradev 4,0 Decembar
2000
6,0 MX 29. Maj
2002
7.0 MX 2004 10.Septembar
2003
8,0 8,0 13.Septembar Zadnja Macromedia verzija
2005
Adobe 9.0 CS3 16. April Zamjenjuje Adobe
Systems 2007 GoLive u Creative Suite .
10,0 CS4 23.Septembar
2008
11.0 CS5 12. April
2010
11.5 CS5.5 12.April 2011 Podrava HTML5.
12.0 CS6 21.April 2012
Tabela 2 Kratka hronologija, Izvor: http://en.wikipedia.org/wiki/Adobe_Dreamweaver

Adobe Systems Incorporated je amerika softverska kompanija sa sjeditem u San

Joseu, (Kalifornija, Sjedinjene Amerike Drave).

Kompanija Adobe osnovana je 1982. od strane John Warnocka i Charlesa Geschkea,

5
koji su osnovali vlastitu firmu nakon naputanja Xerox PARC-a sa prvenstvenim ciljem
da razviju i prodaju svoj raunarski jezik za opis stranice PostScript.

Ve 1985., kompanija Apple Computer licencirala je njihov programski jezik PostScript

za upotrebu u svojim izvedbama laserskih pisaa, to je pomoglo pravoj revoluciji
raunarskog izdavatva i nevjerojatno brzom rastu kompanije Adobe.

Nakon kupovine Macromedia, Adobe je nastavio da razvija alate koje je dobio ovom
kupovinom. Tako je 16.04.2007. izala prva verzija Adobe Dreamweaver Creative Suite
3, a danas je na sceni verzija Adobe Dreamweaver Creative Suite 6.

3. ADOBE DREAMWEAVER

3.1. O ADOBE PROIZVODIMA

Adobe Dreamweaver je vrlo moan HTML i grafiki editor (WYSIWYG - "What You
See Is What You Get") za dizajniranje i izradu web stranica u najpoznatijim web
tehnologijama kao to su (X)HTML, CSS, JavaScript, PHP ili ASP.

Slika 3 Neki od Adobe proizvoda, Izvor: http://www.adobe.com

6
Danas postoji mnogo programa za izradu web stranica, mada je Dreamweaver i pored
brojne konkurencije postao de-facto standard u web produkciji, a jedan od razloga
njegovog uspjeha je to to je dio najvee i najpoznatije porodice programa za print i
web, te programa za video produkciju, dakle dio kompanije Adobe koja u svojoj lepezi
proizvoda ima najpoznatije alate i programe.

Danas iz Adobe produkcije moemo odabrati jedan od sljedeih alata: Acrobat.com,

Acrobat 3D, Acrobat Capture/Capture Cluster, Acrobat Elements, Acrobat Elements
Server, Acrobat Messenger, Acrobat Standard/Pro, Adobe Connect, Adobe AIR, Adobe
Captivate, Adobe Digital Editions, Adobe Digital Enterprise Platform, Adobe Drive,
Adobe License Manager, Adobe Media Player, Adobe Reader, Adobe Revel, After
Effects, Audition Authorware, Bridge BrowserLab, Central, Central Pro Output Server,
ColdFusion, Contribute, Contribute Publishing Server, CourseBuilder Extension Crer
des fichiers PDF en ligne, Creative Suite, CS Live, CS Review, Device Central, Digital
Publishing Suite, Dimensions, Director, Distiller Server, Document Center, Download
Manager, Dreamweaver, Dreamweaver UltraDev, DV Rack, Encore, Fireworks, Flash,
Flash Catalyst, Flash Lite, Flash Media Encoder, Flash Media Server, Flash Player,
Flash Remoting, FlashPaper, Flex Font Folio et polices de caractres, FrameMaker,
FreeHand, GoLive, HomeSite, Illustrator, InCopy, InDesign, InterAKT, Jrun, LiveCycle
7, LiveCycle Collaboration Service, LiveCycle Data Services ES, LiveCycle ES,
Omniture ClientCare Portal, OnLocation, Ovation, PageMaker, PhotoDeluxe,
Photoshop, Photoshop Express, Photoshop Elements, Photoshop Extended, Photoshop
Lightroom, Pilotes d'imprimantes, PostScript, Premiere Elements, Premiere Pro,
Presenter, Production Studio, RoboDemo, RoboHelp, RoboHelp pour FrameMaker,
RoboInfo, RoboPDF, Shockwave Player, Soundbooth, Stock Photos, Streamline,
Technical Communication Suite, Type Reunion, Type Set, Ultra, Version Cue, Visual
Communicator, Vlog It!, Wild Type2.

Svaki od ovih alata radi ono to mu je namjena, a direktno ili indirektno veina
pobrojanih alata moe posluiti izradi jedne web stranice. Svi pobrojani programi se
razvijaju u labaratorijama kompanije Adobe, a meusobno su kompatibilni i
nadograuju i nadopunjuju se, a novije verzije se pojavljuju pod kodnim imenom

2
Adobe, http://www.adobe.com, 20.04.2013.

7
Creative Suite ili skraeno CS. Tako da do danas imamo verzije CS3, CS4, CS5,
CS5,5 te najnoviju verziju alata CS6.
Funkcionalnosti Adobe Dreamweaver-a
CS3 CS4 CS5 CS5.5 CS6
Fluid Grid Izgled
Poboljana jQuery Mobile podrka
Integracija Adobe PhoneGap
CSS3 prelazi
Integracija sa A. Business Catalyst
PhoneGap integraciju
FTPS i FTPES podrka
W3C valjanosti
Multiscreen pregleda ploi
CSS3 poboljanja
Jednostavnije postavljanje stranica
Multiscreen suelja s CSS3
PHP custom klase kod aludirati
Subverzija podrka
Inteligentni broj ulaznica
Inegrisana CMS podrka
Live View renderiranje
CSS starter stranice
Podrka vodeim tehnologijama
Integrisana FLV podrka
Proirena Dreamweaver zajednica
Sveobuhvatna CSS podrka
Adobe Creative Suite integracije
Tabela 4 Usporedba svih Dreamweaver Adobe verzija,
Izvor:http://www.adobe.com/products/dreamweaver/buying-guide-version-comparison.html?
PID=2159997

3.2. ULOGA ADOBE DREAMWEAVERA

Rekli smo da nam Adobe Dreamweaver program moe uveliko olakati posao izrade
jedne web prezentacije, odnosno jednog web site-a, ali nismo objasnili na koji nain, to
emo uraditi u narednom tekstu. Da bi smo razumjeli ono to radi ovaj program
moramo donekle poznavati web dizajn, web tehnologije kao i nain na koji internet kao
tehniki medij funkcionie.

Internet je mrea svih mrea, a funkcionie na nain da nam nudi mnotva servisa i
usluga. Svaki servis ima svoje programe za koritenje kao i posebne protokole. Servisi
interneta funkcioniu po principu tzv. klijent/server arhitekture, tako to negdje na mrei
postoje serveri u kojima su smjeteni podaci, a na domicilnom raunaru se izvrava
klijent program koji tim podacima pristupa preko mree.

8
Konkretno nas sada interesuje jedan od internet servisa koji se zove World Wide Web, a
koji omoguava prenos slika, teksta, zvuka, animacija, video signala i sl.
Dakle, WWW je servis baziran na hipertekstu. Jednostavnim klikom mia na hiperlink
moemo u istraivanju neke teme dospjeti do nesluene koliine informacija. Kretanje
servisom pomou hiperteksta nazivamo navigacija. Hipertekstovi su dokumenti pisani
u HTML (eng. Hyper Text Markup Language) koji je napravljen ba za izradu web
stranica. Protokol za WWW je HTTP (eng. Hyper Text Transfer Protocol) te sve Web
adrese u svijetu zapoinju sa http://. HTTP radi u dvije faze:
1. FAZA ZAHTJEVA u kojoj klijent alje naredbu za prikazom neke Web
stranice (HTML dokumenta) serveru.
2. FAZA ODGOVORA server odgovara klijentu na zahtjev i zatvara vezu.
Na raunaru korisnika koji preko WWW servisa pristupa nekom sadraju na internetu je
instaliran softver koji mu omoguava ovaj vid komunikacije. To su internetski
preglednici (web preglednik, web browser, internet browser). Dakle internetski
preglednik je softver instalran na radnu stanicu korisnika, koji korisniku omoguuje
pregled web stranica i multimedijalnih sadraja vezanih uz njih, fiziki smjetenih na
web serverima na nekoj lokaciji.

Slika 5 Internet preglednici, Izvor: http://royal.pingdom.com/2013/01/16/internet-2012-in-numbers

9
Najpopularniji internet preglednici danas su:
Firefox - besplatan preglednik otvorenog koda
Mozilla - imenom Mozilla danas nazivamo spoj Firefoxa i Thunderbirda
Opera - besplatan preglednik zatvorenog koda firme Opera
Internet Explorer - besplatan preglednik zatvorenog koda firme Microsoft
Safari - besplatan preglednik firme Apple
Google Chrome - besplatan preglednik firme Google

Spomenuli smo HTML, meutim i sirovi HTML polako odlazi u zaborav i mijenjaju
ga drugi web-programski jezici, kao to su recimo PHP, ASP, ASPX itd. Doslovno,
PHP (eng. Hypertext Preprocessor) je server-side HTML-embedded skriptni jezik. To
u stvari znai da se svi PHP programi izvode na serveru, a klijentu se potom alje samo
rezultat izvoenja, odnosno odgovarajui HTML kd. Na strani klijenta se vidi samo
HTML kd, dok je sam program sakriven od klijenta. PHP kod moe biti ugraen u
HTML ili u odvojenoj datoteci. Veina sintakse je preuzeta iz C, Jave i Perla s
nekolicinom jedinstvenih specifinosti. Svi ovi programski jezici, ukljuujui
nezaobilaznu JAVU, kao i FLASH, daju krajnjem korisniku ljepi vizuelni doivljaj
dok pregleda sadraj preko svog preglednika, koristei WWW servis. Moemo sigurno
rei da je WWW najvie koriten internet servis, pa ga iz tog razloga poistovjeuju sa
internetom.

Dakle, mi uz pomo Adobe Dreamweavera kreiramo datoteke koje e imati jednu od

pomenutih ekstenzija (recimo .html), koje emo po zavretku postaviti na web-server da
bi krajnjim korisnicima preko njihovih browser klijenata bili dostupni za pregled na
internetu. Dreamveaver je tu da nam olaka posao pisanja kda, te vizuelnog ureivanja
web stranica, jer u radnoj povrini Dreamweavera vidimo dvije odvojene (splitovane)
cjeline koje nam prikazuju stranicu koju ureujemo. Jedna pokazuje stranicu onakvu
kakva e biti prikazana krajnjem korisniku u browseru, a druga pokazuje izvorni kod te
stranice.

10
 4. RAD U ADOBE DREAMWEAVERU
U ovom poglavlju emo opisati osnovne funkcije programa Adobe Dreamweaver CS 4.
Dakle, kada pokrenemo Adobe Dreamweaver CS 4 za poetak emo dobiti prozor u
kom je potrebno odabrati tip dokumenta koji elimo kreirati, ili moemo otvoriti ve
postojei dokument.

Slika 6Poetni izgled programa Adobe Dreamweaver CS4

Ako kliknemo na HTML odabrali smo da elimo kreirati datoteku tipa HTML, a
dobiemo editor u kom moemo kreirati datoteke koje imaju ekstenziju .html (Slika 7).

Slika 7Izgled programa Adobe Dreamweaver CS4

11
Dakle na slici iznad vidimo izgled programa Adobe Dreamweaver CS 4, nakon to smo
prilikom pokretanja odabrali HTML. Na slici su brojevima obiljeeni dijelovi prozora
koje emo pobrojati i ukratko objasniti njihovu funkciju.
1. Naziv aktuelnog dokumenta - je naziv dokumenta na kom trenutno radimo.
Program dokumentu na poetku postavlja po defaultu ime Untitled-1 koje
emo mi kada ga budemo htjeli sauvati svakako preimenovati. Svaka poetna
stranica bi trebala imati ime index, u naem sluaju je index.html jer svaki
klijent browser prilikom konektovanja na web-server prvo trai i otvara datoteku
koja nosi ime index. To je u stvari datoteka koju emo smjestiti na web-server,
a koja predstavlja poetnu stranicu nae web prezentacije.
2. Odabir izgleda radnog prozora - nam omoguava da odabirom jedne od tri
ponuene stavke (Code, Split, Design) dobijemo razliitu radnu povrinu,
zavisno od toga ta nam trenutno treba. Ako odaberemo Code, na radnoj
povrini emo imati samo kd. Ako odaberemo Design na radnoj povrini
emo dobiti radnu povrinu sa prikazom onakvim kako e izgledati u browseru
prezentovan krajnjem korisniku. Ako odaberemo Split dobiemo podijeljenu
radnu povrinu gdje dobijemo oba pomenuta tipa za ureivanje.
3. Izbornici (Menu bar) preko kog moemo pristupiti svim stavkama koje su
nam dostupne u ovom programu.
4. Radna povrina Design ovdje vidimo web stranicu kako e izgledati u
browseru. I ovaj dio je editabilan, to znai da sve to promjenimo u ovom dijelu
bie prikazano u dijelu radne povrine gdje je ispisan kd.
5. Radna povrina Code ovdje vidimo kd web stranice koji ureujemo.
Ukoliko izvrimo neku promjenu u ovom dijelu radne povrine to e se
primjeniti i prikatati u dijelu radne povrine Design.
6. DESIGNER je trenutni profil izgleda prozora programa. Klikom na ovaj
gumb moemo promjeniti izgled svog prozora programa u izgled koji nam
odgovra.
7. Insert je dio prozora programa gdje moemo odabrati neto to elimo dodati
u dokument koji ureujemo
8. Coding toolbar overview nam slui da pregledamo kd koji smo unijeli. U
mnogo situacija moe kd uiniti itljivim i olakati pronalazak eljenog dijela
koda.

12
 9. Inspektor svojstava koga dobijemo kada kliknemo na dio radne povrine
Designer. Prikazuje nam osnovne informacije o objektu koga smo selektovali u
tom dijelu radne povrine, te na njemu moemo primjeniti neka osnovna
formatiranja koja su nam dostupna preko inspektora svojstava.
10. Status bar nam omoguava uvijek prisutne informacije za onaj dio programa
koji ureujemo, odnosno koga smo selektovali na radnoj povrini.
11. Files panel je dio prozora programa preko kog imamo pregled svih fajlova
koje smo zavrili i podigli na web-server ili u lokalu.

5. KREIRANJE WEB STRANICE

Vidjeli smo da pokretanjem programa i odabirom HTML-a dobijemo veoma
jednostavnu i intuitivnu radnu povrinu koju smo opisali u prethodnom tekstu, a vidjeli
smo i da je na radnoj povrini programa odmah na poetku, sam program dodao dio
kda.

Tako, da ukoliko bi eljeli napisati jednostavni tekst na stranici bilo je dovoljno da

kliknemo na radnu povrinu Design i upiemo Hello World! i datoteku spasimo. Kada
je pokrenemo u browseru emo dobiti stranicu u kojoj pie ovaj tekst.

Slika 8Hello World!

Ovo govori u prilog jednostavnosti korienja ovog programa, jer smo jednostavnim
upisom teksta i spaavanjem datoteke dobili tekst u browseru sa natpisom: Hello
World!.

Kako vidimo (Slika 8) kada smo na radnoj povrini Design upisali pomenuti tekst, taj

13
isti tekst se ispisao i u dijelu radne povrine gdje se nalazi kd i to izmeu body
tagova. Dakle, sav sadraj stranice se smjeta izmeu body tagova, a sadraj koji se
nalazi izmeu head tagova je sadraj koji nije vidljiv u browseru ve predstavlja
podatke koje e koristiti za drugu svrhu, kao to su to informacije o stranici, naslov
stranice, opis stranice, kljune rijei, autor stranice, vlasnik sajta, itd. Ovi podaci slue
za predstavljanje stranice prema npr. trailicama.

<head>INFORMACIJE O STRANICI</head>
<body>SADRAJ STRANICE</body>

Primjer 9Mjesto sadraja unutar kda

Spasiemo ovu datoteku i daemo joj ime index.html. U nastavku emo dodati jo
atributa, kao to jedodatni tekst, fotografija i hiperlink. Objasniemo kako se to radi.

Slika 10Upis naslova stranice i dodatnog teksta u novom redu

Dakle, mi emo vezano za informaciju o stranici dodati naziv stranice Poetna

stranica, a to radimo tako to unutar radne povrine Code, izmeu tagova title
upiemo eljeni tekst, u ovom sluaju je to Poetna stranica.
U narednom koraku postavimo kursor mia unutar Design radne povrine i stisnemo
ENTER te upiemo tekst Idi na Google. Dobiemo situaciju (Slika 10) u kojoj se
unutar Code radne povrine pojavljuje novi dio kda koji predstavlja ono to smo
uradili unutar Design radne povrine.
U narednom koraku emo dodati sliku odmah ispod teksta.

14
Slika 11Dodavanje slike

1. Postavimo kursor mia odmah iza teksta Idi na Google unutar Design radne
povrine i stisnemo ENTER
2. U dijelu prozora programa Insert kliknemo na Image da bi dobili prozor
Select Image Source preko koga se dodaju slike. Do ovog prozora moemo
doi i preko menija i kartice Insert.
3. Ovdje izaberemo eljenu sliku i kliknemo na OK.

Slika 12Dodavanje hiperlinka na sliku i tekst

Nakon ovoga slika e se pojaviti unutar datoteke i bie prikazana odmah ispod teksta u
dijelu radne povrine Design, a u dijelu radne povrine Code bie prikazan njoj
pripadajui kd (Slika 12).

15
 1. Unutar Design radne povrine selektujemo sliku i dio teksta Idi na Google
2. Unutar Inspektora svojstava u polju Link upiemo eljeni URL, u ovom sluaju
je to http://google.ba i stisnemo ENTER.
Ostalo je jo samo da spasimo stranicu preko File > Save As > index.html. Kada
pokrenemo ovu stranicu ona e da se otvori u browseru. U njoj e postojati dio teksta
koji nije linkovan, te dio teksta i slika koja je linkovana. Klikom na ove linkove
otvorie nam se Google koji se nalazi na URL-ovima koje smo unijeli (Slika 13).

Slika 13Izgled web stranice koju smo kreirali

6. ZAKLJUAK

Na kraju, kada smo upoznali program Adobe Dreamweaver, te ono to mu je svrha

shvatamo njegovu veliinu i bitnost u jednom procesu kakav je web dizajn. Ovim
radom smo obradili samo osnovnu funkciju ovog programa, da bi prikazali emu
program slui i koja je razlika pisati kd u jednom tekst editoru kao to je recimo
Notepad i programu kakav je Dreamweaver.

Da bi kao krajnji proizvod dobili profesionalno uraenu web prezentaciju moraemo

koristiti vie alata za obradu grafike, fotografija, flash animacija, bannera, ali za upis
kda i slaganje svih tih elemenata unutar jedne web stranice Dreamweaver e Vam biti

16
program broj jedan.

Zakljuujemo da je sa razlogom omiljeni odabir svakog profesionalca koji radi web

stranice, te da bi ne koritenje jednog ovakvog alata umnogome usporilo rad, ali i
kreativnost dizajnera jer bi njegova panja bila vie usmjerena na pisanje kda, a manje
na osmiljavanje i onaj kreativni dio pa bi time i kvalitet krajnjeg rezultata bio upitan.

Na taj nain smo potvrdili postavljenu glavnu hipotezu, kojom smo istakli da ukoliko
koristite program kao to je Dreamweaver prilikom kreiranja web prezentacije, osim to
ete uveliko pojednostaviti i olakati posao izrade web stranica, kao kranji rezultat
dobiete i kvalitetniju prezentaciju.

17
 7. LITERATURA
Knjige :

1.) D. Short, G. Grean: Dreamweaver 8 prakticni prirucnik,

2.) Janine Warner: Dreamweaver CS4 For Dummies PDF Book, Januar 2010.

Tekstovi s interneta :
1.) Wikipedia, http://hr.wikipedia.org/wiki/Adobe_Dreamweaver, 19.04.2013.
2.) Adobe Help, http://helpx.adobe.com/dreamweaver/archive.html, 19.04.2013.
3.) Pingdom.com, http://royal.pingdom.com/2013/01/16/internet-2012-in-
numbers,19.04.2013.
4.) Web-upotrebljivost, http://www.web-upotrebljivost.com, 19.04.2013.
5.) Vidipedia,http://www.vidipedija.com/~vidipedi/index.php?
title=Dreamweaver_8_prakti%C4%8Dni_priru%C4%8Dnik, 19.04.2013.

18