MEF, Beograd
Predmet:
SEMINARSKI RAD
Adobe Dreamweaver
Mentor:
Dr. Jasmina Lozanović Šajić
Student:
Radović Dušan
Br.indeksa:1004-17/2017
Beograd, 2018. godine
MEF - Dreamweaver
__________________________________________________________________________
___________________________________________________________________________
1
UVOD
U ovom seminarskom radu pokušaću da izložim način kreiranja osnovnog web sajt-a koristeći
Dreamweaver CS3. Pre toga treba dobro osmisliti izgled svog sajta i pripremiti ga koristeći neki editor za
slike (Adobe Fireworks, Adobe Photoshop, Corel PhotoPaint...). Slike koje koristimo obično treba da
kopiramo u jedan ili nekoliko poddirektorijuma našeg veb sajta (na primer layout ili images). Tek kada
imamo potreban dizajn, onda možemo da počnemo da radimo na izradi sajta.
Kreiranje novog sajta
Prvi korak je da kreiramo direktorijum na računaru u kome ćemo čuvati fajlove našeg veb sajta, što
će nam biti ponuđeno kada pokrenemo Dreamweaver. U dijalogu je potrebno upisati ime sajta koji ćemo
kreirati i URL adresu, ukoliko ćemo odmah postaviti sajt preko nekog FTP klijenta. Kliknuti na Next.
Drugi dijalog koji će se pojaviti nudi korisniku mogućnost korišćenja serverskih tehnologija (ColdFusion,
ASP.NET, ASP, JSP ili PHP) u izradi veb sajta. Mi nećemo izabrati takve tehnologije, jer nam za sada
nije potreban rad sa bazom podataka, već ćemo praviti veb sajt baziran na tehnologijama HTML, CSS i
JavaScript. Nakon toga, kliknuti na Next. U trećem dijalogu potrebno je upisati direktorijum gde će biti
sačuvan projekat, potom kliknuti na Next, a u četvrtom dijalogu način povezivanja sa serverom (u ovom
slučaju nećemo pokazivati).
MEF - Dreamweaver
__________________________________________________________________________
___________________________________________________________________________
3
U
File
meniju, postoji opcija
Preview in Browser
, gde korisnik može da odabere jedan od
ponuđenih veb pregledača i vidi kako trenutna stranica/sajt izgleda u tom veb pregledaču. Opcijom
Edit
Browser List
moguće je dopuniti tu listu sa drugim instaliranim veb pregledačima. U praksi je najbolje, da
kada pravimo sajt, taj sajt testiramo u svim veb pregledačima koje koriste budući korisnici tog sajta.
Danas se najviše koriste (
Mozilla Firefox
,
Google Chrome
,
Internet Explorer
,
Opera
,
Safari
, i drugi).
Opcijom
File => New
, moguće je kreirati novu stranicu ili novi šablon (eng.
template
), što će biti
pokazano u sledećem poglavlju. U
File
meniju, moguće su još i standardne opcije za rad sa fajlovima:
otvaranje nove stranice, otvaranje najskorije korišćenih stranica, snimanje stranica i štampanje koda.
U
Edit
meniju, postoje standardne opcije, kao i u tekstualnim editorima:
Undo/Redo
,
Cut/Copy/Paste/Paste Special
,
Select All
,
Find and Replace/Find Next
i mnoge druge. Jedna od
interesantnih opcija je
Tag Libraries...
koja predstavlja biblioteku svih
HTML
tagova, ali i drugih tagova
(XSLT, PHP, ASP, JSP,...). To je ono što ne postoji u običnim tekstualnim editorima, kao što je
Notepad
.
Izborom taga a i atributa href, dobićemo objašnjenje kako da koristimo taj tag, kao što je prikazano na
slici.
MEF - Dreamweaver
__________________________________________________________________________
___________________________________________________________________________
4
Meni
View
odnosi se na način prikazivanja prozora i panela u Dreamweaveru. Već je objašnjena
razlika između
Code/Design/Code and Design
. Treba napomenuti još i prikaz
Split Code
, kojim možemo
pratiti editovanje dve stranice u dva različita prozora istovremeno.
Meni
Insert
odnosi se na dodavanje novih tagova na stranici ili div elemenata, slika ili drugih
multimedijalnih elemenata (SWF flash animacija, apleta, video fajlova,...), ubacivanje tabela ili formi,
hyperlink-ova, e-mail linkova ili anchor linkova, i mnoge druge opcije.
Meni
Format
služi za sređivanje
HTML
ili
CSS
stilova, paragrafa, poravnanja, sređivanje listi, itd.
Kreiranje „template“ stranice - šablona
Stvaranje
template
stranice, pomoći će nam da takvu stranicu, tzv. šablon, koristimo i u pravljenju
drugih stranica. To će dati konzistentan izgled i olakšati upravljanje vašim sajtom (lakše je menjati samo
šablonsku stranicu, nego u svim stranicama menjati izgled).
U meniju izabrati
File => New
, i izabrati
Blank Template
=>
HTML Template
=>
Layout <none>
MEF - Dreamweaver
__________________________________________________________________________
___________________________________________________________________________
6
Iz padajućeg menija za
Rule Definition
odabraćemo
New Style Sheet File
kako bi napravili novi fajl
sa stilovima.
Fajl ćemo nazvati styles.css i snimiti ga.
Ukoliko smo već jednom kreirali fajl sa stilovima, u padajućem meniju za
Rule Definition
videćemo ime
fajla, pa je ubuduće potrebno izabrati tu stavku. Nakon što kliknemo OK otvoriće se prozor za rad sa
stilovima koji će biti objašnjen dalje u dokumentu.
Dodaćemo i ostale DIV-ove u šablon.
Sledeća stvar koju je potrebno da uradimo je da definišemo
editable regions
tj. regione u kojima će se
nalaziti naš sadržaj i koji mogu da se menjaju na svakoj strani nezavisno.
Odaberite iz menija
Insert
=>
Template Objects
=>
Editable Region
.
