Dreamweaver merupakan salah satu
software dari kelompok Adobe yang banyak digunakan untuk mendesain situs web.
Adapun Adobe Dreamweaver sendiri adalah sebuah HTML editor profesional yang
berfungsi mendesain secara visual dan mengelola situs web maupun halaman web.
Untuk memulai penggunaan Dreamweaver MX 2004, kliklah Start > All Program
> Macromedia Dreamweaver MX 2004. Saat pertama kali menggunakan Dreamweaver
akan tampil Welcome Screen dimana kita dapat memilih tutorial yang sudah
disediakan oleh Dreamweaver.
Gambar : 1.1 Welcome
Screen
1. Elemen Dreamweaver MX 2004
Dalam ruang kerja Dreamweaver ada
beberapa elemen utama yang membentuk suatu ruang kerja yang merupakan satu
kesatuan tampilan antara menu utama, panel, property inspector, serta toolbar.
Perhatikan ruang kerja Dreamweaver pada gambar berikut :
Gambar : 1.2 Ruang
Kerja Dreamweaver MX 2004
A. Insert bar berisi
tombol-tombol untuk menyisipkan berbagai macam objek, sepeti : image, tabel,
dan frame, ke dalam documen.
B. Document toolbar
berisi tombol menu pop-up yang menyediakan tampilan berbeda Document Window,
misalnya Code, Split, atau Design.
C. Document window
berfungsi menampilkan documen dimana anda bekerja sekarang.
D. Panel group adalah
kumpulan panel yang saling berkaitan satu sama lainnya yang dikelompokkan
dibawah satu judul.
E. Tag selector berfungsi
menampilkan hierarki tag disekitar pilihan yang aktif pada Design View.
F. Property inspector
berfungsi melihat dan mengubah berbagai property objek yang terpilih.
G. Files panel berfungsi
mengatur file-file dan folder-folder yang membentuk situs web anda.
2. Mengenal Panel
Properties
Panel Properties digunakan
untuk melihat dan mengubah berbagai property objek dan teks yang terpilih.
Setiap objek memiliki property yang berbeda-beda.
Gambar : 1.3
Properties untuk Teks
Kelebihan Dreamweaver MX 2004
1) Dapat digunakan pada
dua system operasi, diantaranya Macintosh atau windows.
2) Dapat dilihat tampilan
website preview pada computer, ponsel atau PDA, dan printer.
3) Membangun web dengan
CSS dengan menggunakan CSS layout, CSS panel, dan CSS visualization.
4) Fasilitas lengkap
pendukung CSS
3. Tabel
Tabel merupakan salah satu fasilitas
untuk mendesain halaman web. Dengan menggunakan table, lebih mudah untuk
memodifikasi desain web.Untuk membuat table lakukan beberapa langkah berikut
ini :
1) Siapkan file baru,
lalu letakkan kursor pada jendela dokumen.
2) Pilih salah satu
perintah pembuatan table berikut : pilih perintah menu Insert > Table. Klik
tombol table yang terletak pada tabulasi table didalam Insert Bar.
3) Selanjutnya akan
tampil kotak dialog Table seperti pada 1.4 kemudian, tentukan jumlah kolom dan
baris dengan memasukkan angka pada beberapa kotak teks yang sudah disediakan.
Gambar : 1.4 Kotak
Dialog Table
Mengatur nilai property table :
1) Row untuk menentukan
jumlah baris tabel.
2) Colums untuk
menentukan jumlah kolom table
3) Width untuk menentukan
ukuran lebar tabel dan satuan ukuran yang dipakai, pixels atau persentase.
4) Border untuk mengatur
ketebalan border atau garis bingkai tabel.
5) Cell Padding untuk
mengatur jarak antara isi sel dengan batas tepi sel atau penampang sel.
6) Cell Spacing untuk
menentukan jarak antar sell dalam tabel.
Bagian Header
Fungsinya memberikan keterangan yeks
pada bagian tabel sesuai dengan pilihan yang tersedia.
None, tanpa menggunkan keterangan teks.
Left untuk menampilkan keterangan teks
pada kolom pertama atau pada bagian sebelah kiri.
Top untuk menampilkan keterangan teks
pada baris pertama atau bagian sebelah atas.
Both untuk menampilkan keterangan teks
pada kolom dan baris pertama.
Bagian Accessbility
Anda dapat memberikan keterangan judul
tabel pada kotak teks Caption. Sementara untuk perataan teks busa menggunakan
Align Caption.
E. Penempatan Struktur VBScript di Tag
HTML
Stuktur dokumen HTML terbagi menjadi dua
bagian yaitu bagian yang di akhiri dengan dan bagian yang diakhiri dengan .
Pada bagian body disinilah yang akan ditampilkan didalam browser. Sebuah
dokumen HTML selalu diawali oleh sebuah tanda pembuka atau disebut dengan
opening tag dan diakhiri dengan tanda penutup yang disebut dengan ending tag
yang ditandai dengan karakter /. Contoh penulisan dokumen HTML dapat dilihat
sebagai berikut :
<html>
<html>
<head>
----------------
isi dari head
</head>
<body>
----------------
isi dari body
</body>
</html>
untuk penempatan struktur VBScript didalam dokumen HTML , kita membutuhkan Tag sebagai ending tag. Ada dua cara dalam penempatan struktur VBScript didalam dokumen HTML yaitu dibagian head dan pada bagian body. Cara penulisan tag VBScript ada dua macam yaitu :
<script
language="vbscript">
atau
<script
language="vbs">
Struktur VBScript yang diletakkan pada section body merupakan script yang berfungsi sebagai batang tubuhdari pemrograman VBScript dan diletakkan diakhir sebagai tujuan agar script dapat mengnali object html yang ada pada section body.
<html>
<head>
</head>
<body>
<script
language="vbscript">
-----------
isi dari kode VBScript ------------
</script>
</body>
</html>
contoh : simpan dengan nama contoh1.htm
<html>
<head>
</head>
<body>
<script
language="vbscript">
document.write("
saya baru belajar VBScript")
</script>
</body>
</html>
.jpg)
.jpg)
.jpg)
