Di sesi ini saya akan melanjutkan mengenai pembuatan halaman website dengan menggunakan Dreamweaver. Pada sesi sebelumnya, saya sudah menunjukkan bagaimana membuat halaman website dengan menggunakan desain tabel. Sekarang adalah lanjutannya dengan sedikit lebih dalam dalam membuat halaman websitenya. Sehingga Anda harus mengetahui tulisan sebelumnya agar dapat mengikuti sesi ini dengan baik.

Tulisan ini untuk siapa?

• Untuk anda yang sudah mengetahui dasar HTML

Tujuan

• Dapat membuat halaman website dengan software Dreamweaver

Persiapan dan Tools

• Macromedia Dreamweaver atau Adobe Dreamweaver
• Browser

Letakkan kursor pada bagian Logo dan hapus teks "Logo" pada halaman website, lalu setting tinggi kolom dengan cara setting field width di bagian properties. Set nilai width dengan 100. Sehingga tinggi kolom Logo akan seperti berikut.

Selanjutnya tekan Ctrl + Alt + I untuk memasukkan gambar logo. Pilih gambar yang akan dijadikan logo dan tekan tombol OK. Pada window berikutnya masukkan teks "My Logo" pada field Alternate text. Teks ini akan tampil jika kursor sedang berada di atas gambar.

Gambar logo akan tampil seperti dibawah ini.

Berikutnya kita akan membuat menu halaman website. Letakkan kursor pada bagian Menu dan hilangkan teks "Menu". Masih dalam kondisi kursor berada di bagian Menu, setting field Vert pada properties dengan TOP. Kondisi ini akan membuat posisi elemen didalam kolom Menu dimulai dari Atas. Jika tidak disetting maka posisi elemen akan berada di tengah - tengah.

Masih dalam kondisi kursor berada di bagian Menu. Buat tabel baru dengan rows = 4, Columns = 1, width = 100% lalu tekan OK. Maka tabel akan tampil. Letakkan kursor berada di row pertama, ketik teks "Menu". Buka properties dan set bg(warna background) dengan #CCCCCC dan set Alignment dengan Center. Tampilan akan seperti dibawah ini.

Selanjutnya letakkan kursor di bagian Footer. Ganti teks "Footer" dengan teks "Copyrights @ 2008 Indonesia" dan set Alignment teks dengan Center.

Berikutnya membuat isi(content) halaman website.

Letakkan kursor pada bagian content, hapus teks content dan setting Vert dengan Top pada properties agar posisi elemen berada di posisi atas. Buat tabel dengan settingan seperti dibawah.

Maka tampilan tabel akan seperti dibawah ini.

Ketikkan teks didalam tabel tersebut dan hasil akhir dari halaman website akan seperti dibawah ini.

Kali ini cukup sampai disini pembahasannya. berikutnya kita akan membuat link dari tabel Menu yang dapat menghubungkan ke halaman lainnya.