Modul Dreamweaver @ayaayako

8/8/2019 Modul Dreamweaver @ayaayako

1/30


2/30


3/30


4/30


5/30


6/30


7/30


8/30


9/30


10/30

updat ed : Monda y 15 th Fe ruar y 2010

Supaya tombol yang dibuat itumengarah ke suatu file / web page / situs lain, Hotspot itu haruspunya link. Caramembuat linknya adalah denganmenge-drag ikon target ke arah file / web pageyang diinginkan yang sudah ditampilkan pada panel.*anak panah hitam yg digambar itu bukan bagian dri keterangankalimat,tpi efek drimenge-drag ikon yg tadi

Kalau sudah punya link, Hotspot itu harus punya target. Target itumaksudnya, tempat dimana webpage / file / situs lain yang dilink tersebut ditampilkan. Jenis-jenis target, nih:

y _parent : muncul full di window tempat link itu beraday _blank :muncul di window baruy _self :muncul di frame / window tempat link itu berada*soal frame,nanti ada penjelasannya lagi y _top : muncul full di window tempat link itu berada danmenutup semua frame

5th Save it! KlikFile > Save All. Versiq, web page ini aq save pake nama index.

PENTING!!!Klo nge-save file yang baru dibuat, selalu klik Save All. Kenapa? Karena inimemperkecil kemungkinan human error dalam manajemen web.

G K AL AH PENTING!!!Selalu save web page paling depan / paling awal dari suatu web dg namaindex. Kenapa? Karena udah jadi aturan tak tertulis pembuatan web & ini juga diharuskan oleh PakHeri.


11/30

updat ed : Monda y 15 th Fe ruar y 2010

b) nonanamoel ya

Penasaran kenapa sub-bab ini judulnya nonanamoelya & bukan pake nama web page seperti sub-bab yang lain? Karena yg bakalan qta buat di sub-bab ini adalah kerangka dari semua web page.Biar simple, perhatiin tabel ini, deh:

Head

Left {content} Right

Secara garis besar, seperti itu lah kerangka standard sebuah web( FrameSet). Terdiri dari:

y topFrame (yang biasa diberi nama Head) y leftFrame (yang biasa diberi nama Left) y rightFrame (yang biasa diberi nama Right) y mainFrame (yang biasa diberi nama tergantung dari isinya)

Sederhananya, klo waktu bikin index tadi, qta kan bikin satu web page yang tampilannya full se-window, nahmulai dari sini kita bikin web page tapi tampilannya g full se-window, tapi cumaditampilin dimainFrame ( {content}).

Kelihatannya ribet ya? Memang awalnya g segampang bikinindex, tapi frame2an ini nantinya justru bikin qta lebih gampang bikin web.

Di sub-bab ini, qta lebih fokus untuk bikin kerangkanya. Yuk, dimulai :)


12/30

updat ed : Monda y 15 th Fe ! ruar y 2010

1st kanvas yang hitam perawan ini qta cacah jadi 4 frame (sesuai kerangka standard).

Pertama, kita buat dulu topFrame-nya :


13/30

updat ed : Monda y" 15 th Fe # ruar y 2010

Kedua , kita bua t le ftFr a me -nya :


14/30

updat ed : Monda y$ 15 th Fe % ruar y 2010

Ketiga , kita buat r ig htFr a me -nya :

Kee m& at , fr a me yg wa rna nya puti h di uba h ja di ite m pa ke Page Prope r tie s.

Keli ma , bia r a ma n, di -sa ve dul u. Ca r a nge -sa ve -nya juga a da l ho :


15/30

updat ed : Monda y' 15 th Fe ( ruar y 2010

KlikFile > Save All, lalu keluar option seperti ini :

Di situ tertulis UntitledFrameset-3, kan. Itumaksudnya, yang akan qta save ini adalah keseluruhandari 4 frame itu *rangkaian frame itu disebut frameset, jadi qta namain sesuai nama web qta karena frameset

inilah kerangka dasar web qta. Versiq, aq kasih nama nonanamoelya.

Begitu qta klik Save, nanti bakalmuncul lagi option sejenis :


16/30

updat ed : Monda y) 15 th Fe 0 ruar y 2010

Beda sa ma yg tadi (tertulis UntitledFrameset-3), yg ini tertulis UntitledFrame-9. Inimaksudnya,yang akan qta save kali ini cuma salah satu frame dari 4 frame yg tadi udah qta buat. Tapi frame ygmana,nih? Perhatiin garis arsir yang ngelilingin frame, deh. Frame yg kelilingnya diarsir itu berarti

frame itulah yang akan di-save. Versiq, aq kasih nama right.


17/30

updat ed : Monda y1 15 th Fe 2 ruar y 2010

Setelah ngeklik Save, akanmuncul option :

Kali ini yangmuncul tulisannya Untitled-1 & yg diarsir adalah frame yg di tengah. Inimaksudnya,yg di-save adalah isi / frame utama dri frameset itu. Karena inimasih awal dari pembuatan web,

jadi frame ini qta kasih nama home.


18/30


19/30


Frameset-nya udah jadi! :D


20/30


2nd Qta bikin Headnya.*klo udah capek, istirahat dulu, lho

1st Buat judul yg segede gaban i tu dulu. Steps-nya persis sama 1st - 3rd step buat bikin Index karenaintinya kan cuma kasih judul+masukin gambar. Walau sebenernya g dikasih judul pun gmasalah,kan cuma frame.

2ndNah, di gambar atas itu kan ada 6 buttons, biar rapi pake tabel. Segampang bikin tabel di Ms. Excelsama Ms. Words kok. G usah diajarin gpp, dong. Ehe :)

Klo dicoba di browser,merhatiin g klo button-nya bisa berubah tampilan begitu kursor mouse lewat?Cara bikinnya gampang,kok. Kira-kira1button1menit lah ;)

Pertama klik insert image > Rollover Image


21/30

updat ed : Monda y9 15 th Fe @ ruar y 2010

Trus keluar dialog box. Udah user friendly tuh. Tinggal kasih nama, cari gambar pertama, carigambar kedua, sama tentuin link-nya. Then OK.

Button-nya udah 80% jadi tuh, sekarang tinggal gimanacaranyasupayakloqtaklikbutton-nya,nongolweb pageyangqtapengentapinongolnyabukandi windowtapidi fra me. Caranya, tinggal kita atur target-nya. PilihmainFrame karena qta mau apa yg diklikntar nongol di frame utama.

Udah? Ye ude gitu doank, kelar dah1button.

3rd Tinggal diulang caranya ke semua gambar and voila! Its done! Kepalanya udah jadi, deh :D


22/30

updat ed : Monda yA 15 th Fe B ruar y 2010

c ) Home

The magic of frameset *lebay bgt inimah o.O, jadi qta g perlu susah2 bikin home. Karena tampilan homeversiq ini sederhana banget, jadi bikinnya cuma bentar.

Bikinnya cuma tinggal ngetik, trus sebagian tulisan dijadiin link. Sebagian tulisan itu tinggaldiblok,lalu atur link + targetnya kemainFrame. Udah, deh :D


23/30


24/30

updat ed : Monda yE 15 th Fe F ruar y 2010

1st kanvas yangmasih hitam perawan dibagi jadi 2 frame sa ma besar. Versiq, frameset-nyadiberi nama Prologue.

2nd Prologue _head diedit jadi ber-background hitam, trus dikasih gambar judul.

3rd Prologue _contain cuma diisi tulisan.

Versiq, frame ini diberinama Prologue _head

Versiq, frame ini diberinama Prologue _contain


25/30

updat ed : Monda yG 15 th Fe H ruar y 2010

e) Sho uI

OuI

Tampilan Shout Out pada satu full window.

Tampilan Shout Out padamainFrame dalam frameset ana moelya.


26/30

updat ed : Monda yP 15 th Fe Q ruar y 2010

1st Persis sa ma 1st step pembuatan Prologue, tapi nama frameset versiq Shoutout.

2nd Untuk sementara, frameset Shoutout ditinggal dulu.Buat kanvas hitam perawan baru dan isidengan teks. Versiq, diberi nama dengan for mat Shoutout _[ judul].

Versiq, frame ini diberinama Shoutout _head

Versiq, frame ini diberinama Shoutout _contain


27/30

updat ed : Monda yR 15 th Fe S ruar y 2010

Web page ini nantinya akan jadi tampilan padaShou tou t _contain:

3rd Hampir seperti 2nd step pembu atan Prologu e, jadi frame sebelah kiri dikasih gambar ju du l +Ju mp Menu . Tinggal iku ti instr u ksi gambar aja.


28/30

updat ed : Monda yT 15 th Fe U ruar y 2010


29/30

updat ed : Monda yV 15 th Fe W ruar y 2010

Dan seterusnya nyampe se mua file udah ke-link di Jump Menu*kebanyakan,jdimales :P

4th Done :D


30/30

f) Hall of Art

Documents

Modul Dreamweaver @ayaayako